Summary:
This plugin is rarely used and would need to be re-worked to work in a world where ComponentTree is not the only way of rendering a Litho hierarchy.
Deleting for now for simplicity
Reviewed By: adityasharat, passy
Differential Revision: D42573698
fbshipit-source-id: 0d9cd713b668e6fc79cd5cddcdcb9f24ed98f927
Summary: Out of the box the library search has some issues. when search matches it steals focus from the input. Eventually we want to customise the rendering of the tree items anyway so this lays the foundation for taht
Reviewed By: antonk52
Differential Revision: D41336524
fbshipit-source-id: 194f67023edd0675cd9bd8d6134260439c6b2785
Summary: Set width of sidebar for `main` position in `MasterDetail`.
Reviewed By: mweststrate
Differential Revision: D41493698
fbshipit-source-id: a9f4804256a7ee46ed32f367e8b21ff57dd484e0
Summary: If we have a milliseconds portion of a date that's <100, we'd fill in zeroes in a symmetrical way (around the value) rather than filling in at the front, which led to some confusion.
Reviewed By: mweststrate
Differential Revision: D41342194
fbshipit-source-id: a8f60110dcad8bfa77b81abed88df0b0643c780e
Summary:
Flipper plugins fail when importing css from third-party dependencies. This diff tries to fix that.
Effectively, the plugin can import the css and export it when is bundled.
When we load the plugin, we check if there's a css file for it. If there's one, we return it and try to use it.
Reviewed By: aigoncharov
Differential Revision: D40758178
fbshipit-source-id: e53afffcc481504905d5eeb1aea1f9114ee2a86b
Summary:
Replace draft inspectors with read-only components.
This is a first step into having a richer UI. At the moment, these are read-only components but will likely be extended in the future as to allow editing of values.
Reviewed By: LukeDefeo
Differential Revision: D40345016
fbshipit-source-id: a6aef5861474b4aa8353c00ef257ab17b4cff00e
Summary:
In a headless mode we do not have access to local storage. As a result, headless plugins that try to use `persistToLocalStorage` option crash. We should ignore the option for these plugins for now and add a way to persist the plugin state to the disk in a headless mode in the future.
CHANGELOG: Ignore persistToLocalStorage in headless mode
Resolves https://github.com/facebook/flipper/issues/4190
Reviewed By: lblasa
Differential Revision: D40341873
fbshipit-source-id: 40774c0024f79cf1652f24146fd16f6a101ca99e
Summary:
A side affect of the new tree implementation was unecessary renders. For very large trees this was noticable to the user.
A condition is added to the props are equal function for the memoized component to consider if this nodes path is a prefix to the new or previous hover path. This indicates whether it needs to rerender or wether the change in hover state is unconsequential to this component.
changelog: Fixed a bug in the nested highlighting of the data inspector, previously it could remain highlighted while moving the mouse away quickly and multiple highlights could be visible at the same time
Reviewed By: mweststrate
Differential Revision: D39883905
fbshipit-source-id: abdac71574695000addb4ba6477503b7d44a4faf
Summary:
There were 2 issues with the previous implementation of the nested hover.
1. If you moved the mouse out of the inspector quickly we would miss the event and we would have a hover state of the root element when we shouldnt
2. The hover state was stored per node, it was possible to have mulitple children hovered at the same time if you moved the mouse fast enough in a very complex tree
The new implementation has the hovered id stored in the Datainspector root. This solves the multiple state issue since there can only be one. Finally There is an onMouseLeave hook added to the parent div which seems to reliably fire no mouse how erractic my mouse movements :) Also the new implementation is a lot easier to understand
Reviewed By: mweststrate
Differential Revision: D39855733
fbshipit-source-id: 96b43f216deef72b81cd52001f8de26df55ea693
Summary: We have a list of modules that we do not bundle with the plugins, but provide externally to them from Flipper. For the mechanism to work correctly, we have to stop importing from nested paths of these modules.
Reviewed By: mweststrate
Differential Revision: D39776237
fbshipit-source-id: 06eae9bf9d5b11b48d2720bf592bfea749773847
Summary:
flipper-server-companion depends on flipper-plugin. flipper-plugin includes dependencies that run only in a browser. Splitting flipper-plugin into core and browser packages helps to avoid including browser-only dependencies into flipper-server bundle.
As a result, bundle size could be cut in half. Subsequently, RSS usage drops as there is twice as less code to process for V8.
Note: it currently breaks external flipper-data-source package. It will be restored in subsequent diffs
Reviewed By: lblasa
Differential Revision: D38658285
fbshipit-source-id: 751b11fa9f3a2d938ce166687b8310ba8b059dee
Summary:
I noticed that on my Mac M1 Flipper feels really sluggish in term of interactions compared to my Mac Pro. Started profiling and notices we have continously 60 reflows/sec and a very continous stream of DOM nodes allocations. This in turn is caused by our NUX elements, whose opacity anymation causes a reflow, which causes our interactive container (used for resizable sidebars etc) do to some calculations.
This is quite noticeble in how fluent clicks etc are handled, as long as there are NUX-es open. Not sure why this doesn't feel as bad on Intel machines, but alas the effect is very clearly visible in the performance monitor. Or when dismissing all NUX-es, which drops the performance issue even in current builds.
Disabling the opacity anymation and giving it a fixed value, fixes the issue as well, which is done in this diff.
Changelog: Minor improvements on M1 machines
Reviewed By: passy
Differential Revision: D38859406
fbshipit-source-id: 3b97c6c8444290e2a0a8b17b175de9e44159e258
Summary: Since there were large refactoring's done to `DataSource` during the milestone for side-by-side panels, wanted to update some of the documentation as well so that the information is accurate and up to date.
Reviewed By: mweststrate
Differential Revision: D38541404
fbshipit-source-id: a6ba472f881fb8cbfa90ff5ac295a0b87c595080
Summary: There was a regression in which the selection background color made the selection hard to read in dark mode.
Reviewed By: mweststrate
Differential Revision: D38572894
fbshipit-source-id: c46d384175132112e1223434534a379318bfa2ea
Summary:
1. Added icon to search bar to manually trigger the hide/show search context/results functionality, which was only triggerable by ctrl(now migrated to ctrl+t) before.
2. Added tool tips to increase visibility of keyboard shortcuts
Changelog: Added icon for showing search result context(only triggered by keyboard shortcut before). Added tool tips to search bar icons.
Reviewed By: mweststrate
Differential Revision: D38207087
fbshipit-source-id: a34c1322294ed8091ea3f90d2f1f206af981c9ca
Summary:
Currently there's no way of quickly selecting recent searches other than manually opening the recent search history and then clicking one of the search terms. This diff seeks to add a new feature that would allow not only a keyboard short cut to open the recent search history drop down but also number the most recent 5 search terms so that the user could quickly select them with a number on their keyboard
Additionally, fixed bug found in terms of the search bar not showing the current search value correctly
`Changelog`: Introduced keyboard shortcut(ctrl + f) option to toggle the search history dropdown along with numbers attached to the options in order to quickly navigate to recent search terms. Have to first enable the option(search shortcut) in menu in order to use the feature. Also added a new button in the options menu that would trigger the search result toggle as triggered by the keyboard shortcut `ctrl` before(`ctrl` + `t` now)
WARNING: The current behavior of "ctrl" toggling back and forth to focus the selected item has been migrated to "ctrl + t" key combo
Reviewed By: mweststrate
Differential Revision: D37685738
fbshipit-source-id: a7ac4dd3dceb846a98258de2d884ebc279ee5995
Summary:
In order to accomplish multi-panel mode, we need to use multiple data views on the same data source so that the filters can be applied differently, etc.
This diff serves to refactor DataTable and some of its associated classes to use DataView as the primary driver for data management. Additionally, the diff refactored the state to allow multi-paneling to be on the DataPanel layer instead of the DataTable layer for ease of usage
This is the last diff of the larger stack which introduces the multi-panel mode feature. A possible next step could be allowing infinite(up to a certain limit) panels to be populated.
Changelog: Introduced side by side view feature for `DataTable`. There is now a new boolean for `DataTable` props called `enableMultiPanels`. If this is passed in, then the table will have an option to open a different "side panel" using a completely different dataview which allows different filters, searches, etc.
Reviewed By: mweststrate
Differential Revision: D37685390
fbshipit-source-id: 51e35f59da1ceba07ba8d379066970b57ab1734e
Summary: SidebarInteractiveContainer sets mousedown/mouseup handlers. Whenever user tries to select text in child element those are triggered.
Reviewed By: passy
Differential Revision: D37994014
fbshipit-source-id: 5dcf5642b3a92ec50008aa4aad6b9522a09c1527
Summary:
This diff adds a new menu option to the Logs plugin which allows for enabling/disabling the automatic filtering of search terms in the search history as user types.
Additionally, fixed bug regarding the search term that's used is not actually showing correctly. This is caused by the search value being set in the input search bar instead of the autoComplete component level
Differential Revision: D37555209
fbshipit-source-id: 8a76299f7e1a4b0a3adfa6a4dd883d17f1e7a442
Summary:
A few comments in my rewrite stack got missed, I am addressing them here.
In addition react testing library has been hoisted to the root module in the project and been made available to all sub modules
Reviewed By: mweststrate
Differential Revision: D37712339
fbshipit-source-id: 60984c3d16bd535b0c489570907f097c7d80f634
Summary: This is needed to avoid mobile builds depending on BaseDevice
Reviewed By: mweststrate
Differential Revision: D37315909
fbshipit-source-id: a090bd3e76ceefe1f2ac68f832ee544ae45a8d6a
Summary: There is a new flipper server command to install apps. For android it uses adb (via adb kit) For ios depending on idb availablity it will use idb or xcrun. Consumed in the next diff
Reviewed By: lblasa, aigoncharov
Differential Revision: D36936637
fbshipit-source-id: e09d34d840a9f3bf9136bcaf94fb8ca15dd27cbb
Summary:
See https://fb.workplace.com/100051336486185/videos/469885544533059/
I couldn't reproduce it myself, but it is reported that when copying logs, the order of the selection is not preserve. Diving into the example there is a block of rows (around the 1.09 timestamp) that appear 'too early' in the output.
In flipper we sort the selection before copying the data by row index. This is to make sure if the user has multiple selections, they appear in the order of the logs (including any applied sorting), rather than in the order of which the user selected them.
However, when sorting numbers, JavaScript by coerces them to strings first (wtf JS), so the issue can be prevented by explicitly providing a sort function. Proof: {F749329864}
Reviewed By: lblasa
Differential Revision: D37596975
fbshipit-source-id: 820e03350034e7af8148200a58a8c858b358acd8
Summary:
In diff D36663929 (e07d5c5bfe) the behaviour of data table was changed so that it only searched fields that were columns in the table. Due to user request we are restoring the functionality where you can search and it will look in all top level fields in the underlying object for the row
changelog: Fixed 'free text search' for data table. E.g network plugin
Reviewed By: mweststrate
Differential Revision: D37552492
fbshipit-source-id: 00ec942b2a2336c19a7d067d85cc6c81b8a175e1
Summary:
Currently, we call onSelect in DataTable only when user changes their selection. At that moment, we pass the row data to the `onSelect` callback. However, if later the data changes, but the selection stays the same, we do not call `onSelect` again. As result, any listener to onSelect does not receive the latest data.
In this diff, we start calling `onSelect` when the selection does not change, but the underlying data does.
Reviewed By: mweststrate
Differential Revision: D37520346
fbshipit-source-id: a88d34654e9ad0721caf5918dde49b86ba20fc1f
Summary:
This diff builds on the previous ones by enabling other colors to be used as highlights for the search terms. Current color options are: yellow(default), red, blue, green. Possible extensions to this feature could include allow the user to enter a custom hex-color string and use that as the highlight color.
Changelog: DataTable will now have option to have its search terms highlighted in the search results by toggling and customizing the highlight colors in the menu bar
Reviewed By: mweststrate
Differential Revision: D37383163
fbshipit-source-id: c81e383c0570ef5efbf3171b92b81a8fb2e55ea7
Summary: Building on the previous diff which added a setting to enable/disable highlighting search terms in the logs. This diff adds the actual highlighting and connects with the setting. The highlighting currently only supports one color, while the next diff will seek to support a preset of a "custom" colors for the highlighting
Reviewed By: mweststrate
Differential Revision: D37348441
fbshipit-source-id: 7a2b74b16f239d5e36c213e06ccb86f74eaa8df5
Summary:
Created search highlight settings to be stored as part of persisted state. Added toggle/menu option in the dropdown.
This diff serves as the start of the stack that introduces highlighting the search terms in the search results of flipper. Currently, the results returned do not show why(the key word) they are appearing.
The next diffs will introduce not only the actual highlighting but also "custom"-ish color-picking for the highlights. The colors will be chosen from the sub-menu where the highlighting is enabled.
Reviewed By: mweststrate
Differential Revision: D37229735
fbshipit-source-id: d681f8e7b7fdfce8135c2c3fa81d8450447565c1
Summary:
Added a mouse hover state to detail inspector. The hover state follows you into and out of the hierarchy.
changelog: Added hover state to detail inspector
Reviewed By: mweststrate
Differential Revision: D36781553
fbshipit-source-id: eafbf119a81779bf07199142d305b06ad6b98c52
Summary:
Previously if you activated context menu in detail inspector it would trigger a context menu for multiple
overlapping children. This behaviour can be observed in live by right clicking a nested property an selecting 'Copy value'.
Most of the time you will copy the entire tree as you are clicking on the parents context menu. This is
the solution recommended by the antd team. https://github.com/ant-design/ant-design/issues/33865 (see the
response fiddle from the maintainer)
changelog: Fixed bug when copying value from context menu in detail sidebar
Reviewed By: mweststrate
Differential Revision: D36781555
fbshipit-source-id: 010a04648eb90eb19a47aa0f1f2b0427c9f5f7cc
Summary:
Getting the behavior exactly right was tricky, now settled on the following:
* Don't automatically show the search history (the default) but introduce an explicit button to toggle it, as opening it by default was pretty obtrusive in testing
* Items are added to the history when using return / explicitly clicking search, to only get "clean" entries into the history, and not half complete searches. Needing to press enter might be to subtle since datatable will also search without that, but not searching on keypress felt as a regression as well.
* Introduced a menu item for clearing the search history
* Search history is persisted like search filters.
Yay to Antd's AutoComplete, which is really straightforward and cleanly composes with Input.Search.
Changelog: DataTable will now keep a history of search items when hitting <return> to search. Use the history button to bring up the history.
Reviewed By: aigoncharov
Differential Revision: D36736821
fbshipit-source-id: 8d18b85308a39bd1644057371040855d199545c7
Summary:
The `Control` button press, that hides the current search filter, had some specific logic to make sure that the current selection remained visible. Since this is now generically supported, this is no longer needed.
Also updated the `Control` button behavior to also toggle back the search filter if needed, which was never finished in the original implementation.
Changelog: DataTable: pressing the control key can be used to temporarily turn the current search filter on and off.
Reviewed By: aigoncharov
Differential Revision: D36736494
fbshipit-source-id: 2c4949efa0d6935735f61ee43f9268b7e27d1fcf
Summary:
During filter changes, DataTable would loose any selections made, which was posted multiple times as papercut
I didn't implement preserving multi line selections. That should be straightforward, but wasn't sure that'd be desirable or not.
Changelog: DataTable: Data tables will now preserve the current selection and scroll it into view when changing the search filter.
Reviewed By: aigoncharov
Differential Revision: D36736496
fbshipit-source-id: 401ef351c847f58a5d411cf9f352390f6a110b24
Summary:
DataTable selected rows are a bit hard to spot when changing search, scrolling etc, so give them a bit more prominent background
Changelog: DataTable: more pronounced background color for selections
Reviewed By: aigoncharov
Differential Revision: D36736495
fbshipit-source-id: 2cab9eb99594ffaaccdd9ebe0d922691adb27bdc
Summary:
This adds support for the key of DataTableColumn to be a dotted path into a nested object, e.g foo.bar. Currently the typescript types only allow a top level key to be set, making this feature currently unusuable from plugin code.
While this could be addressed in a future commit the intention of this is to allow the user to add custom fields into their table columns at run time
Note there is a side effect to free text search from this commit. Previously it would search all top keys in the object. Now it will only search in columns that are in the table.
changelog: Searching data table will now only search columns in the table, rather than all top level attributes of the object
Reviewed By: mweststrate
Differential Revision: D36663929
fbshipit-source-id: 3688e9f26aa7e1828f8e9ee69f8e6f86268c8a54
Summary:
When filter is applied for the first time we shouldn't debounce to avoid "flashing" on datatable loading when it is first loaded without filter and then filter applied after 250ms.
Changelog:
Fixed flashing on opening datatable-based plugin with a filter.
Reviewed By: timur-valiev
Differential Revision: D36602929
fbshipit-source-id: 8bd33f50c92036f2a5565f636f4f2fbe69d900f2
Summary:
As we persist column filters between sessions - sometimes it's not obvious that they are applied.
This diff adds "Reset filters" action just near message "No records match the current search / filter criteria" to make it obvious that some records are hidden because of filters and let user quickly disable filters to see all items.
The same action also added to datatable's context menu.
Changelog:
Quick action "Reset filters" for datatable-based plugins which is shown in context menu and in empty table when all items filtered out.
Reviewed By: timur-valiev
Differential Revision: D36600535
fbshipit-source-id: 782e7f863f2f52d7f6017685bdebcb1feeb97dbd
Summary: Required for companion in later diffs
Reviewed By: passy
Differential Revision: D36517737
fbshipit-source-id: ad47ae00cc88f424507284553c7d4eb430691311
