Summary:
in Layout plugin, scrollbars where often not visible, for example to see the vertical scrollbar, one had to scroll to the horizontal end first.
Also introduced the `Scrollable` component to simplify this in the feature and separate the concepts of rendering something large and making it scrollable.
This diff cleans up the layout structure and fixes the problem
changelog: Fixed several minor layout issues in the Layout plugin
Reviewed By: cekkaewnumchai
Differential Revision: D21283157
fbshipit-source-id: 81849151475165796c65001616f038a9d6cbdfb2
Summary:
This diff updates the sidebar to show the recommended and all build types.
Also there is error handling in place along with tests. Right now the download happens by opening browser and the build gets downloaded in the download folder. But later in the diffs I will improve this flow to do that in the Flipper with a UX showing status updates.
Reviewed By: mweststrate
Differential Revision: D21556383
fbshipit-source-id: 6de9a00fe416c22cae7bacf91828a2221644eac7
Summary: FileSelector was added in D19743998, but it was not exported to be used by other. This diff exports it so that developers can use.
Reviewed By: mweststrate
Differential Revision: D21653870
fbshipit-source-id: 062247fa7a14c7ddf87c927205880a695598928d
Summary:
Fixed the layout usage in QPL, the `horizontal` was correct, but the elements where swapped (the table was supposed to take all remaining size, and sidebar it's needed space, rather than the reverse).
Made this more explicit in the Layout component, by splitting it up in `Layout.(Top|Left|Right|Bottom)`, so that one has to make an explicit choice here, making it less error prone.
Reviewed By: passy
Differential Revision: D21572438
fbshipit-source-id: 29aa3462a3c96d048825be3157730e26182cb2fa
Summary:
This allows long text to be seen on the sidebar in database plugin. Also, remove weird padding in the sidebar and separate sidebar component to a new file
Refactoring is in the next diff
Reviewed By: mweststrate
Differential Revision: D21550672
fbshipit-source-id: 3e80be16783719e18392fe3d8f8068caf9283f8f
Summary:
To comply with recent agreement, coverage test for MultipleSelectorSection is added.
Also, add undefined check in `elements.tsx` found while adding the test
Reviewed By: mweststrate
Differential Revision: D21554782
fbshipit-source-id: 7cd868bf16f6105d6f523048f29bdaa052837f45
Summary:
This diff updated the `flipper-out-of-contents` container to render with absolute position, which allows it to cover up all of the content in the plugin. This fixes an issue where content that exists in the plugin can be broken.
For example, the banner in the next diff would look like this:
{F237034745}
Reviewed By: mweststrate
Differential Revision: D21556849
fbshipit-source-id: 95ec4aac24ac995bd1c558123ef5da6087a40d0a
Summary: The effect of opening the screenshot after capturing was removed in D19765926.
Reviewed By: mweststrate
Differential Revision: D21571294
fbshipit-source-id: f3308d80e066cc01786c17323e4ff5f97c092de9
Summary:
Ugh, lockdown brain. This was supposed to be included in the test I added before
to get to 100% coverage. Well, it's here now.
Reviewed By: mweststrate
Differential Revision: D21550904
fbshipit-source-id: 044a11d38e211c6f57cce220adc8c42241a2043a
Summary:
This happened during startup:
{F237135281}
From `tmp` docs:
> IMPORTANT NOTE: template no longer accepts a path. Use the dir option instead if you require tmp to create your temporary filesystem object in a different place than the default tmp.tmpdir.
Reviewed By: mweststrate
Differential Revision: D21570416
fbshipit-source-id: 170886d0fda5e21cb23fe836fcde33eb457a4c1b
Summary: This diff updates the typescript version and it fixes `yarn lint:tsc`. It also successfully pointed out fes of the problems in our codebase. I have fixed those problems
Reviewed By: mweststrate
Differential Revision: D21548003
fbshipit-source-id: e69c986ee3c763588d9e1e290dad08d1cf1976a8
Summary:
Bumps [tmp](https://github.com/raszi/node-tmp) from 0.2.0 to 0.2.1.
<details>
<summary>Changelog</summary>
<p><em>Sourced from <a href="https://github.com/raszi/node-tmp/blob/master/CHANGELOG.md">tmp's changelog</a>.</em></p>
<blockquote>
<h2>v0.2.1 (2020-04-28)</h2>
<h4>🚀 Enhancement</h4>
<ul>
<li><a href="https://github-redirect.dependabot.com/raszi/node-tmp/pull/252">https://github.com/facebook/flipper/issues/252</a> Closes <a href="https://github-redirect.dependabot.com/raszi/node-tmp/issues/250">https://github.com/facebook/flipper/issues/250</a>: introduce tmpdir option for overriding the system tmp dir (<a href="https://github.com/silkentrance">silkentrance</a>)</li>
</ul>
<h4>🏠 Internal</h4>
<ul>
<li><a href="https://github-redirect.dependabot.com/raszi/node-tmp/pull/253">https://github.com/facebook/flipper/issues/253</a> Closes <a href="https://github-redirect.dependabot.com/raszi/node-tmp/issues/191">https://github.com/facebook/flipper/issues/191</a>: generate changelog from pull requests using lerna-changelog (<a href="https://github.com/silkentrance">silkentrance</a>)</li>
</ul>
<h4>Committers: 1</h4>
<ul>
<li>Carsten Klein (<a href="https://github.com/silkentrance">silkentrance</a>)</li>
</ul>
</blockquote>
</details>
<details>
<summary>Commits</summary>
<ul>
<li>See full diff in <a href="https://github.com/raszi/node-tmp/commits">compare view</a></li>
</ul>
</details>
<br />
[](https://dependabot.com/compatibility-score/?dependency-name=tmp&package-manager=npm_and_yarn&previous-version=0.2.0&new-version=0.2.1)
Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting `dependabot rebase`.
[//]: # (dependabot-automerge-start)
[//]: # (dependabot-automerge-end)
---
**Note:** This repo was added to Dependabot recently, so you'll receive a maximum of 5 PRs for your first few update runs. Once an update run creates fewer than 5 PRs we'll remove that limit.
You can always request more updates by clicking `Bump now` in your [Dependabot dashboard](https://app.dependabot.com).
<details>
<summary>Dependabot commands and options</summary>
<br />
You can trigger Dependabot actions by commenting on this PR:
- `dependabot rebase` will rebase this PR
- `dependabot recreate` will recreate this PR, overwriting any edits that have been made to it
- `dependabot merge` will merge this PR after your CI passes on it
- `dependabot squash and merge` will squash and merge this PR after your CI passes on it
- `dependabot cancel merge` will cancel a previously requested merge and block automerging
- `dependabot reopen` will reopen this PR if it is closed
- `dependabot close` will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
- `dependabot ignore this major version` will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
- `dependabot ignore this minor version` will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
- `dependabot ignore this dependency` will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
- `dependabot use these labels` will set the current labels as the default for future PRs for this repo and language
- `dependabot use these reviewers` will set the current reviewers as the default for future PRs for this repo and language
- `dependabot use these assignees` will set the current assignees as the default for future PRs for this repo and language
- `dependabot use this milestone` will set the current milestone as the default for future PRs for this repo and language
- `dependabot badge me` will comment on this PR with code to add a "Dependabot enabled" badge to your readme
Additionally, you can set the following in your Dependabot [dashboard](https://app.dependabot.com):
- Update frequency (including time of day and day of week)
- Pull request limits (per update run and/or open at any time)
- Out-of-range updates (receive only lockfile updates, if desired)
- Security updates (receive only security updates, if desired)
</details>
Pull Request resolved: https://github.com/facebook/flipper/pull/1127
Reviewed By: nikoant
Differential Revision: D21475580
Pulled By: passy
fbshipit-source-id: 5ddd73368b4178cd7a4b431e1661f9509f080635
Summary: Naive implementation of searchable data inspector: matching of search term agains first level keys of data
Reviewed By: cgrushko
Differential Revision: D21510073
fbshipit-source-id: 2010e584248a64fb3351c95a5646b1935445a13b
Summary: This was for V1 (D16990925) and is no longer referenced anywhere.
Reviewed By: nikoant
Differential Revision: D21501270
fbshipit-source-id: fef30f38c917afcd3d4150a0165cd0a59ad42b6a
Summary:
DataDescriptor currently shows a pencil icon next to text values starting with http/https. This is because otherwise it wouldn't be possible to edit them as a click would open the link in a web browser instead of triggering the edit mode.
Because of how this logic is implemented, it doesn't take into account whether editmode is enabled or not, thus it shows the pencil icon even when there's no need for it (custom plugins with no edit mode).
## Changelog
Fixed pencil icon visible in DataInspector for non-editable text fields
Pull Request resolved: https://github.com/facebook/flipper/pull/1002
Test Plan:
I tested this locally with LayoutInspector and my own custom plugin. The pencil still appears and works in the LayoutInspector but doesn't show up anymore in my custom plugin as the data there is not editable
## Result after the fix:
**Editable (LayoutInspector)**

**Non-Editable (Custom Plugin)**

Reviewed By: passy
Differential Revision: D21400359
Pulled By: mweststrate
fbshipit-source-id: 62b18f3f6c75c1b07440d51fca363d7e6fc60c6a
Summary: This allows props like `style` to be passed through (so it can be further styled), and makes `active` optional.
Reviewed By: jknoxville
Differential Revision: D21438791
fbshipit-source-id: bbab4a7768fce5de56e4deff67e50ff69914d123
Summary:
Fixes https://github.com/facebook/flipper/issues/1142
When using `client.call(methodName, params)`, params has to be an object, not, for example a string.
It may work on some client implementations, e.g. iOS, but this is a coincidence and not to be relied on. If this gives you new type errors, the plugin should continue to run in the short term but has no guarantees, please adapt it to conform. You can do this by preserving backwards compatibility by doing a typecheck in your client plugin if necessary.
CHANGELOG: Calling `client.call()` or `client.send()` now fails to type-check if params is not an object, to match client implementations.
Reviewed By: nikoant
Differential Revision: D21450694
fbshipit-source-id: 53db49f874838769e39a94b1c4bd4c0b30ecdbc7
Summary:
a bug found while trying to use multiple selector on Wilde. The data returned from specific call is not in the form that we expect. This caused an exception on layout plugin when using the selector
Specifically in WIlde, when we try to get data from node by calling client side to return it, sometimes the node has been invalidated or not saved. Hence, data returned are null or undefined. However, in previous implementation, this didn't take into consideration because we assumed that we always got correct data from client.
Reviewed By: mweststrate
Differential Revision: D21410989
fbshipit-source-id: 5135578606678973b504c9be897cb48fca547555
Summary:
Both export methods behaved slightly differently:
* Export to file returned earlier when running in background, which skiped the tracking of export termination;
* Share link always showed notification, even when on foreground;
* Share link status "hanged" - the share was never unset.
This change makes both consistent:
* Always track export finish - whether its in foreground or background;
* Only show notificaiton if running in background;
* Always reset the share/status.
On top of this it also:
* Normalizes the screenshot status to terminate in '...' as all the others;
* Only copies export URL to clipboard when exporting link if running in the background.
Reviewed By: passy
Differential Revision: D21425095
fbshipit-source-id: 9864a63269df6bd05ab065ff0e5d9f17b9ac6db6
Summary:
There's an issue with the Searchable component, where the keys in manually typed filters (key=value) are case sensitive, but you would never know that because even after creating a filter by clicking on a cell, the new one looks capitalized "Tag=..." where really it is "tag=...".
This changes the blue filter tokens to show what you would have to type to recreate it.
I haven't made the key case insensitive because there may be some capitalized uses of it out in the world and that would break them.
Also, it would be nice, as the capitalized key tends to be equal to the column name you see in the header, but that column name can actually be anything, so that could be a bit misleading.
Context: https://fb.workplace.com/groups/flippersupport/permalink/869112616902731/
Reviewed By: mweststrate
Differential Revision: D21448087
fbshipit-source-id: 8b28e3b890f024bbad03ffd0809e9e1e888075f0
Summary:
This diff removes a bunch of performance bottlenecks of `DataInspector`, mostly by making sure that non new data structures are send to children during rendering. For example, before this diff, fields like `expanded`, `ancestry` and `path` would always be freshly constructed, resulting in new data structures send down, causing the full json tree to always re-render.
By migrating to hooks this became a lot easy to manage.
Also fixed some other minor component reuse issues
Fixed rendering of recursive trees which was broken in the past, and added regression test
Fixed issue with uppercase search string causing unnecessary re-filtering
Make sure changing expand / collapse resets the filter
Reviewed By: passy
Differential Revision: D21381647
fbshipit-source-id: 72834e15088432f55b4b9c88f182ffc9908d4e49
Summary:
This diff adds multiple selector UI on layout plugin, which shows up when there are more than one component at a touch.
This UI allows user to do similar thing to element inspector. Expanding functionality on main component will be added in next diffs.
Reviewed By: mweststrate
Differential Revision: D21214899
fbshipit-source-id: 5c9cae93122cc4f7c326ccd0878d2b9dddebf62b
Summary:
The component will show nothing if root element if not provided. In my case, I just want to reuse it without root specified due to elements are separated
## Explanation for seed and root
`flatElements` is the representation of component tree expressed in an array form. It is derived from an object `props.elements` where id (key) is corresponding to its information about a component (value). This includes children ids of a component. `flatElements` allows visual indentation to be easily done at render process; we can use level directly as the number of spaces we need to make.
`FlatElements` can be evaluated to tree by:
- the lowest number is the root of a tree (in this case, it is 1)
- a node with `i+1` level is a child of a closest previous node with level `i`
`seed` is the function trying to derive elements in object form to array form. First, it is given that there is one id to be a root node.
However, This component will not be rendered if a root node id is not given, while a root node id can be null or undefined, which doesn't make sense to me. In addition, if I want to reuse this component, this component should render without root node id given. That's the reason why there's this diff.
The implementation is as followed:
1. Set every node to be root (level 1)
2. Iterate through elements
2.1. Remove nodes that are children of elements because they cannot be roots
Assumed that there is no cycle, in the end we get all root nodes. Then, we do `seed` for all root nodes to get all trees in `FlatElements` structure
Even though to cover my feature the removal of ids are not needed because we know that all elements will be roots of themselves, I want to cover the case that a user wants tree-like (or forest-like) hierarchy view without given root id.
(Disclaimer: this is written from what I have observed while investigating this. I am not a person who have initially designed this, so apologize in advance in this is not correct)
Reviewed By: mweststrate
Differential Revision: D21214897
fbshipit-source-id: 7657d0ea8607e07e97be968ef927f17c2bc8990e
Summary:
***
� **Important announcement:** Greenkeeper will be saying goodbye � and passing the torch to Snyk on June 3rd, 2020! [Find out how to migrate to Snyk and more at greenkeeper.io](https://greenkeeper.io)
***
## The dependency [uuid](https://github.com/uuidjs/uuid) was updated from `7.0.3` to `8.0.0`.
This version is **not covered** by your **current version range**.
If you don’t accept this pull request, your project will work just like it did before. However, you might be missing out on a bunch of new features, fixes and/or performance improvements from the dependency update.
---
**Publisher:** [ctavan](https://www.npmjs.com/~ctavan)
**License:** MIT
[Find out more about this release](https://github.com/uuidjs/uuid).
---
<details>
<summary>FAQ and help</summary>
There is a collection of [frequently asked questions](https://greenkeeper.io/faq.html). If those don’t help, you can always [ask the humans behind Greenkeeper](https://github.com/greenkeeperio/greenkeeper/issues/new).
</details>
---
Your [Greenkeeper](https://greenkeeper.io) bot 🌴
Pull Request resolved: https://github.com/facebook/flipper/pull/1079
Reviewed By: passy
Differential Revision: D21324797
Pulled By: nikoant
fbshipit-source-id: aa1883120472229827021cbbd121a9a40a30002d
Summary: Panels need to let their content overflow, for example the color picker.
Reviewed By: priteshrnandgaonkar
Differential Revision: D21404621
fbshipit-source-id: 70498e335c9fcb3767aaef2bbd2ce22324adc8e5
Summary:
Before this diff filtering and manual expanding / collapsing could not be combined, this diff fixes that
{F236120000}
Reviewed By: jonathoma
Differential Revision: D21381515
fbshipit-source-id: b0662fcbad3b0dfcb0bfe846e3c05a3a78294dde
Summary: Element also contains `id`, which is equivalent to ElementID used in the existing extension. This change will help the implementation of layout intern search easier.
Reviewed By: mweststrate
Differential Revision: D21385001
fbshipit-source-id: b8c6e6f052af8cfa54bf3a132571e40567cdee4b
Summary:
Looks like we don't have a lint for `jest.mock` imports.
Pull Request resolved: https://github.com/facebook/flipper/pull/1100
Test Plan: yarn test
Reviewed By: jknoxville
Differential Revision: D21378747
Pulled By: passy
fbshipit-source-id: 118372596d6247282b1ddad1f22ed3916d303bb1
Summary:
Introduced a highlight manager, which prevents drilling the highlight through the entire component tree and causing too many re-renders.
Also smartly optimizes that non-matched highlighted text doesn't render unnecessarily, and debounces the updates.
Finally, automatically scroll to the first highlight.
Reviewed By: jknoxville
Differential Revision: D21348575
fbshipit-source-id: 71f7ba2e981ad3fc1ea7f5e7043645e6b6811fb7
Summary:
Large GraphQL responses feel pretty unwieldy, added a search option.
Added filter functionality to ManagedDataInspector, and use it in GraphQL
changelog: It is now possible to search inside GraphQL responses
making it slightly more efficient, and scrolling to the matches will be done in a next diff
Reviewed By: jknoxville
Differential Revision: D21347880
fbshipit-source-id: 85c95be0964515e737de2ab41bbdd8cc6a87544e
Summary:
This diff introduces the concept of `shouldExpand` in DataInspector. Rather than expanding components right away, we only expand if the CPU is idly, this makes sure our app remains interactive, rather than stalling for 15 seconds as shown in the example query.
In the future we could solve the blocking by using react suspense as well, but this solution has the nice benefit that it allows inspecting and interacting with the data right away.
Changelog: The JSON inspector in plugins like GraphQL no longer freezes Flipper temporarily when expanding large data sets and will remain interactive during
Reviewed By: jknoxville
Differential Revision: D21302821
fbshipit-source-id: 6a53858f9062175596dc695c4af172d60422abe7
Summary: The goal of this stack is to gradually expand large data trees, rather than all at once. To enable that, we need to be able to distinguish 'expandability' vs. 'being expanded'. By moving computations from render to the component hooks and store the results locally, we get a step closer to that.
Reviewed By: jknoxville
Differential Revision: D21301927
fbshipit-source-id: cfb617214d4b2005796b33b41c1abe0032e41847
Summary:
Added unit tests to DataInspector prevent regressions in upcoming refactor
Found a bug where changes in `collapsed` aren't propagated. Fixed as well.
Reviewed By: jknoxville
Differential Revision: D21301858
fbshipit-source-id: 764bddeff30f9d4dbfc85d990635f67c20cfacb1
Summary:
Good bye, sweet prince.
We've decided to remove the internal bugnub as its usage is quite low
and the experience is subpar. In the future, we'd rather reuse the
support form v2 and integrate it with our group.
Reviewed By: mweststrate
Differential Revision: D21300627
fbshipit-source-id: d3c7271efcee4ad22ec76394870902f2712e392d
Summary:
Searched for broken link patterns inside the app itself. I think I found them all but it's not certain.
Patterns searched for and replaced:
```
.html
getting-started/)
getting-started)
getting-started"
```
and also searched the repo for regex `\]\(.*)` and checked them by eye.
Reviewed By: passy
Differential Revision: D21306944
fbshipit-source-id: a2e09b0fd8677f5f26e5cc4a06805b474247f7e6
Summary: As titled. The android plugin was already sending the data in blob cells as `{ type: 'blob' value: string }` (see com/facebook/flipper/plugins/databases/ObjectMapper.java?lines=213-216).
Reviewed By: jknoxville
Differential Revision: D21253129
fbshipit-source-id: 15a44c72f4030887a50faece780c89aa65f6a45b