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: 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
Summary: This diff refactors the group selection to the dropdown. As with the growing list of grps, dropdown will be easy to search and scale
Reviewed By: mweststrate
Differential Revision: D21175998
fbshipit-source-id: 90f1a81dfc6c2232cd2dcf767ed01205fc63e1fd
Summary: a bit of refactoring since we are going to use elements inspector a lot in NT related plugins
Reviewed By: jknoxville
Differential Revision: D21155830
fbshipit-source-id: 0ff6acf97658bccbbed86388257bbad207fd65b4
Summary:
Docusaurus 2 is quite a lot more powerful than docu 1 it turns out.
This should convert the website fully.
* [done] Go through migration guide https://v2.docusaurus.io/docs/migrating-from-v1-to-v2
* [done] Convert landing page html
* [done] Convert all images to img tags
* [done] Convert all .md files to .mdx
* [done] Make sure ui-doc generation and including still works
* [done] Scan every page visually for sanity check
* [done] Make sure footer still works
* [done] Make sure search still works
* [done] Change all links/ to links/index
* [done] Change all links.md to links
* [done] Add some custom css to make the navbar look like the old one and darken the footer.
Reviewed By: passy
Differential Revision: D21158717
fbshipit-source-id: 5f45b711b1b6fd5ece4c5c15c55635c7ebbfb568
Summary:
There was a bug where tooltip was even showed after there were no validation errors.
This bug exists everywhere where the tooltip is used.
See the video:
{F235201264}
The reason was the we were not invalidating the react hooks.
Reviewed By: jknoxville
Differential Revision: D21229754
fbshipit-source-id: 50b438bd78e8adb5b17c6d0da15b2f34d7ae2597
Summary: Added eslint rule "no-extraneous-imports" which disallow using modules which are not listed as dependencies in the corresponding package.json. Fixed a bunch of reported errors after the rule applied.
Reviewed By: passy
Differential Revision: D21186848
fbshipit-source-id: 0af9ac4b3fffdfd0ab7c23ae4ff12a3f5989d5e9
Summary: Returning arrays from render kills react-reconciliation and produces missing key warnings. Turned all array rendering methods to use Fragments, where I could find them.
Reviewed By: jknoxville
Differential Revision: D21178253
fbshipit-source-id: 85ddf8adfa79732ccbe68409fdcf150399455983
Summary: This diff fixes the tripple scrollbars in the graphQL plugin, and makes sure scrollbars for the detail panel are properly shown
Reviewed By: jonathoma
Differential Revision: D21177849
fbshipit-source-id: d40173d7e9a45064b608c8d953c7aea47a4acd0f
Summary:
This diff introduces a Layout component.
Layout is now quite randomly build up by using panels, sidebars, flex columns, flexrow and view components. They all have slight different scrolling, overflow, and grow behavior. Which causes issues with areas not being srcollable, double scrollbars or simply the wrong area scrolling. Too make things worse to design, many components by default display hidden content, and show scrollbars automatically rather than deliberately.
To work towards a consist, and especially simple layout model, over time I want to build a consistent outside-in layout model, where always parents reserve space for children, and children fill the available space and device it even further.
Note that this approaches better how 'applications' typically organize their layout, which is opposite from the classic 'document', where the contents is allowed to grow and is used to push things down / aside where they want. However, such a model fits an application with toolbars, sidebars and scroll regions badly, and currently those two philosophies are mixed throughout the application.
This component is a very small first step to organizing our layout consistently. By using a new component there is less risk to break existing layouts. The `Layout` component takes up all available space, both horizontally and vertically, and gives the first child what it needs based on its own size (typically, a toolbar or (resizable) sidebar), and all the remaining space to the second child. By default the space is distributed vertically, but it can also be distributed horizontally. It can provide scrollbars as well if needed so that the main content doesn't need to provide that by itself.
Examples:
```
<Layout scrollable>
<Toolbar />
<LargePicture />
</Layout>
<Layout horizontal>
<ResizableSidebar />
<SomeContentTable />
</Layout>
```
Reviewed By: jknoxville
Differential Revision: D21178245
fbshipit-source-id: c2d2f167d1572278e51a5b66e1cbf13c42c3b898
Summary: Just fixed warning that kebab-style properties are deprecated and camel-case should be used instead
Reviewed By: mweststrate
Differential Revision: D21178489
fbshipit-source-id: 9fba323b3c6ccfce7eb2acc97aa57526305e24ac
Summary: there are two plugins which uses copy-pasted ToolbarIcon and at least one more where it will be helpful. Let's move it to components folder
Reviewed By: nikoant
Differential Revision: D21089290
fbshipit-source-id: a14dcd56633dd24016711e34308b94023fcb40ed
Summary:
This change makes it possible to remove preferences. I also added a `Delete` context menu option to `DataInspector` because I needed it to implement this feature. passy confirmed that it makes sense to add this because delete is a common action.
Fixes https://github.com/facebook/flipper/issues/451
Pull Request resolved: https://github.com/facebook/flipper/pull/1018
Reviewed By: jknoxville
Differential Revision: D21086308
Pulled By: passy
fbshipit-source-id: 551ff0908d5e6c93f58d6012b42e1ee3531de997
Summary:
changelog: Add scroll to inspected element in layout plugin
Before this diff, when one inspected an element, one needed to scroll down to see highlighted line for that element. This diff added automatic scroll to inspected element. It will scroll so that the line is in middle of the app.
Also, fix direct state mutation and this error:
```
Public property 'onKeyDown' of exported class has or is using private name 'Element'.
```
Reviewed By: passy, mweststrate
Differential Revision: D20798587
fbshipit-source-id: 763eb63cd51abd73940e301e36e89232033722c3
Summary:
There was a problem for the next diff because ContextMenu doesn't forward reference to child elements which causes no component attached to ref.
This diff forward ref of ContextMenu to its child. Also, there is casting because of genetic functional component used by NotificationHub
Reviewed By: mweststrate
Differential Revision: D20817968
fbshipit-source-id: d0a19a447decca73db53f02ea029f56fc7127e94
Summary:
Quick notes:
- This looks worse than it is. It adds mandatory parentheses to single argument lambdas. Lots of outrage on Twitter about it, personally I'm {emoji:1f937_200d_2642} about it.
- Space before function, e.g. `a = function ()` is now enforced. I like this because both were fine before.
- I added `eslint-config-prettier` to the config because otherwise a ton of rules conflict with eslint itself.
Close https://github.com/facebook/flipper/pull/915
Reviewed By: jknoxville
Differential Revision: D20594929
fbshipit-source-id: ca1c65376b90e009550dd6d1f4e0831d32cbff03
Summary:
Breaking down 'big' links and diving deeper into stack trace
each link is built from multiple events with same function on top of call stack
Now we can break that group and/or navigate one level deeper in that stack
coloring links: according to the latest event timestamp: blue -> orange gradient
{F232164201}
Reviewed By: SimoneCasagranda
Differential Revision: D20596812
fbshipit-source-id: 9debbc55a716166e20c94f51989742bf40b95878
Summary:
The memoized callback didn't have any dependencies, so whenever a context menu was computed for a component, it was never changed again.
This broke the network plugin as the context menu should change depending on what element is selected.
Reviewed By: cekkaewnumchai
Differential Revision: D20596750
fbshipit-source-id: 275453d972079954e310fd3e97f2dd9f437bf748
Summary: Fixed circular dependency warnings and removed some dead code while at it.
Reviewed By: jknoxville
Differential Revision: D20557313
fbshipit-source-id: 856c42113a9abe36d3e14f9d538eb40705ceb87f
Summary:
Set line height to make space between lines look better in cramper space (See Test Plan).
This has direct side effect on:
- https://fburl.com/diffusion/0dtt1cgl
- ToggledSection component
In addition, this diff adds an offline cache.
Reviewed By: mweststrate
Differential Revision: D20574486
fbshipit-source-id: 8689bc95e2f18409e82c923fea361e033e77bc00
Summary:
1) moved "sonar/desktop/src" to "sonar/desktop/app/src", so "app" is now a separate package containing the core Flipper app code
2) Configured yarn workspaces with the root in "sonar/desktop": app, static, pkg, doctor, headless-tests. Plugins are not included for now, I plan to do this later.
Reviewed By: jknoxville
Differential Revision: D20535782
fbshipit-source-id: 600b2301960f37c7d72166e0d04eba462bec9fc1
