Commit Graph

185 Commits

Author SHA1 Message Date
Daniel Büchele
73e5824e35 ManagedTable debouncing
Summary:
Removes the fix introduced in D9570518 and upgrading to `react-window@1.1.2` which fixes the problem in the library.

Also finetuning debounce times.

Reviewed By: passy

Differential Revision: D9582591

fbshipit-source-id: 92b008d29f96ce0f11f5cfb5d9e92175ae536ee2
2018-08-30 11:30:36 -07:00
Daniel Büchele
63c8bd4368 fix for missing rows in ManagedTable
Summary:
When starting with an empty table and adding rows, the scrollOffset of the table might end up with a negative value, which causes rows not to be rendered.

See https://github.com/bvaughn/react-window/issues/49 for more details.

This only calls `scrollToItem` when the table is actually scrollable to prevent a negative scrollOffset.

Reviewed By: passy

Differential Revision: D9570518

fbshipit-source-id: 5b08990a353a6d41d0f1bc5c1481d5a5e471bd94
2018-08-30 08:13:07 -07:00
Daniel Büchele
2c905646ec fixing table default props
Summary:
Table was missing support for some properties, that were supported previously, which caused some regressions. Support for the following properties was added:
- `multiHighlight: boolean = false`
- `autoHeight: boolean = false`
- `highlightableRows: boolean = true`
- `onRowHighlighted: Function`

Reviewed By: jknoxville

Differential Revision: D9549384

fbshipit-source-id: 1db2e7e8c6ad483d3d9d3a5814c76c564e9ba7f4
2018-08-29 04:27:25 -07:00
Daniel Büchele
2596e7d42a recalculate row heights on change
Summary: When table rows are chaning, we need to recaluculate all row heights. This was already done when filtering/searching, but there are other occurrences where we need to recalculate the heights (like clearing the table).

Reviewed By: passy

Differential Revision: D9540881

fbshipit-source-id: ef6e94c0330294d8196f946799a436aa5e9ce5c5
2018-08-28 10:29:26 -07:00
Daniel Büchele
2c071e226f fixing warnings related to emotion
Summary: Fixes some warnings that were caused by the switch to react-emotion.

Reviewed By: jknoxville

Differential Revision: D9483185

fbshipit-source-id: 8e49469772efd37f18342252653648618e644d55
2018-08-23 12:57:18 -07:00
Daniel Büchele
726966fdc0 convert to emotion
Summary:
My benchmarks have shown react-emotion to be faster than the current implementation of `styled`. For this reason, I am converting all styling to [emotion](https://emotion.sh).

Benchmark results:
{F136839093}

The syntax is very similar between the two libraries. The main difference is that emotion only allows a single function for the whole style attribute, whereas the old implementation had functions for every style-attirbute.

Before:
```
{
  color: props => props.color,
  fontSize: props => props.size,
}
```

After:
```
props => ({
  color: props.color,
  fontSize: props.size,
})
```

Reviewed By: jknoxville

Differential Revision: D9479893

fbshipit-source-id: 2c39e4618f7e52ceacb67bbec8ae26114025723f
2018-08-23 09:42:18 -07:00
Daniel Büchele
624d06f2c2 remove old virtualized
Summary: Switches elements from custom virtualization to react-window, so the custom implementation is not needed anymore and therefore can be removed.

Reviewed By: jknoxville

Differential Revision: D9447723

fbshipit-source-id: 7abcc077f87fe634a0e9517908db03398848bce7
2018-08-23 04:57:29 -07:00
Daniel Büchele
7bdb21e055 adding table debouncing
Summary:
When changing the props of a table often, this might results in a lot of unnecessary rerenders. This could be mostly seen in the analytics plugin, which is sending a lot of messages in a short time.

The update of the table component is now debounced to only re-render every 150ms. This also affects searching and filtering and makes typing in the search input smoother.

Reviewed By: passy

Differential Revision: D9447722

fbshipit-source-id: 00e092e4e047e9c40e5a1ec2789644858acc18dd
2018-08-23 04:57:28 -07:00
Daniel Büchele
1891e2c869 moving tables to react-window
Summary:
Tables were using a custom virtualization, which wasn't as performant as other solutions out there. In this diff, the table component is reworked for performance.
- removes `Table` component, because it was never used standalone, `ManagedTable` is what all plugins used
- uses `react-window` for `ManagedTable`
- reworks table highlighting and arrow-navigation to work with the new virtualization
- moves actual filtering out of `ManagedTable` into `Searchable` component for a better separation of concerns.

Reviewed By: jknoxville

Differential Revision: D9447721

fbshipit-source-id: 15eb2eb55eed9f49a0cb1ccfb2d748b3672fa898
2018-08-23 04:57:28 -07:00
Sara Valderrama
7852a3886b Accessibility Inspector open-sourcing move and documentation
Summary: Replaces AXElementsInpector with normal inspector implementation, removes gating from external builds. Adds documentation to https://fbflipper.com/docs/layout-plugin.html.

Reviewed By: passy

Differential Revision: D9438713

fbshipit-source-id: 18616c6cbab339bf474d116cac128e1d4a5fc2be
2018-08-22 14:57:44 -07:00
Sara Valderrama
7acf0ff9af Remove sidebar extensions from accessibility inspector
Summary: Sidebar extensions are automatically added to main inspector sidebar but kept from accessibility side menu.

Reviewed By: xiphirx

Differential Revision: D9438644

fbshipit-source-id: 47a9cc630117e15be3368d78f2396f02796c998d
2018-08-22 09:58:23 -07:00
Hilal Alsibai
1aee2cdaa3 Pass the Layout plugin's logger to the sidebar and sidebar extensions
Summary: Lets the sidebar + sidebar extensions log custom events

Reviewed By: danielbuechele

Differential Revision: D9411001

fbshipit-source-id: 37704e805eda56347cd95c155f81ad31b34bd508
2018-08-21 02:58:33 -07:00
Sara Valderrama
c428de3948 Tooltips added on hover for AX sidebar
Summary: Adds on hover descriptions for some of the more esoteric properties in the accessibility sidebar panel such as accessibility-focused and all the talkback derived properties. Also change talkback-focusable and talkback-ignored to both be talkback-focusable.

Differential Revision: D9381676

fbshipit-source-id: 55ce854da24241a7c89b0c122c4c3ebd77438dbb
2018-08-20 09:41:46 -07:00
Hilal Alsibai
82c2f0c68c Minor typo
Summary: Minor typo

Reviewed By: passy

Differential Revision: D9393881

fbshipit-source-id: 252ed38f1532947a7a15b2149bd5da42d6e0e31d
2018-08-20 02:56:44 -07:00
Daniel Büchele
aace545ba6 move WelcomeScreen
Summary: The sidebar is now shown, even if no device is connected. This prevents the jumping layout when Flipper launches, but still has not connected to devices.

Reviewed By: passy

Differential Revision: D9263892

fbshipit-source-id: d5b96a8619393ee4002863a83d9024f00c6cb396
2018-08-10 08:57:09 -07:00
Sara Valderrama
c07d8c14a4 Add icon to show which elements in ax tree are talkback-focusable
Summary: Puts an accessibility icon next to any elements in the ax tree that may be focused on when talkback is running to show that they are "accessibility-focusable". When any sidebar values are changed, the icon will show up/disappear accordingly.

Reviewed By: danielbuechele

Differential Revision: D9171781

fbshipit-source-id: f3b42624988aaef22040ac3325d745a12f0622db
2018-08-07 09:42:27 -07:00
Sara Valderrama
1fb2c4ee76 Add focus option to context menu in the accessibility tree
Summary: Allow user to open the context menu on an element in the ax tree and request accessibility focus to that element. If the element is focusable (and talkback or another accessibility service is running), accessibility focus will change to that element, if not, it will not change anything.

Differential Revision: D9162382

fbshipit-source-id: 5dda9b87a2cc6eba4130e3feee978b5fa38ac9f1
2018-08-07 09:42:27 -07:00
Daniel Büchele
75dfbf51f8 electron flow type definitions
Summary: Adding a flowtype library definition for electron 3 and fixing related type errors

Reviewed By: passy

Differential Revision: D9124758

fbshipit-source-id: e09cb5b05ba952e7f95f68f9043edc586f81ae83
2018-08-02 03:57:52 -07:00
Sara Valderrama
30a19901ee Cleanup js in layout inspector, add check for ios
Summary: Clean up javascript. Add a check to remove ax mode toggle if using ios. Add safety check for extraInfo where it hasn't been added yet.

Reviewed By: danielbuechele

Differential Revision: D9070574

fbshipit-source-id: 49ac781c01ea47239d6c24089976497371973726
2018-08-01 13:41:43 -07:00
Daniel Büchele
06e70a1555 Screen capture unique file names and location
Summary: Screen captures now have unique names, so they don't get overwritten. By default they are saved to the desktop, but the path can be overwritten by setting `screenCapturePath` in `~/.sonar/config.js`

Reviewed By: jknoxville

Differential Revision: D9120822

fbshipit-source-id: ab6880eac475da3839f08c6e644c16bdc8693647
2018-08-01 11:29:05 -07:00
Benjamin Pankow
a4638033b7 Improve styling of Hprof Analysis for Memory Tools plugin
Summary:
Improves the look of analyzed Hprof data for the Memory Tools plugin. Adds an expandable/collapsable tree using ElementsInspector and groups large objects/leaked objects.
https://pxl.cl/fxNs

Reviewed By: danielbuechele

Differential Revision: D8721141

fbshipit-source-id: f78fe32bd2ca1f11ce39b9e696f48a56dc5c9bff
2018-07-31 14:56:28 -07:00
Sara Valderrama
33e6538477 Highlight the current talkback-focused element in the accessibility tree
Summary: Highlights the element corresponding to the view talkback is focused on in green in the ax tree (and updates live as talkback moves).

Reviewed By: blavalla

Differential Revision: D9021542

fbshipit-source-id: c3bf6f5625aacb0cd054032b33a50541b88b2eaf
2018-07-31 04:14:49 -07:00
Aurelien Fredouelle
5714ce08c9 Added export for the DataDescription component
Reviewed By: jknoxville

Differential Revision: D8896383

fbshipit-source-id: f4873c251046be5983ef1e7377a9a269a087261a
2018-07-26 04:34:46 -07:00
Benjamin Pankow
e223595941 Add 'depressed' param to Button
Summary: Adds an optional 'depressed' param to Button. If set to true, displays the Button as if it was depressed. Used to add a set of togglable buttons in which all or none can be selected.

Reviewed By: jknoxville

Differential Revision: D8903854

fbshipit-source-id: ff39bed91514e420b49cb75fe57e490fa641b810
2018-07-25 10:33:36 -07:00
Sara Valderrama
41f4478a74 Basic mutual highlighting for Litho components
Summary: Shows basic relationship between the AX and nonAX tree litho nodes. When a litho component is selected from the nonAX tree, it's corresponding hostView or lithoView (root of the component tree) is highlighted in the AX tree giving priority to the hostView if it exists. If a hostView is selected in the AX tree, it's corresponding component is selected in the non-AX tree. If a lithoView is selected from the AX tree, it's corresponding lithoView is highlighted in the non-AX tree. This means that each hostView has a one-to-one highlighting between the two trees but lithoViews will have many nodes in the main tree that map to one node in the AX tree (which is accurate to litho components rendering but we may need to change in the future if it is not clear).

Reviewed By: jknoxville

Differential Revision: D8972205

fbshipit-source-id: d136f5b594d0ac1b66a82b35dc7b085186829fc4
2018-07-25 10:19:37 -07:00
Sara Valderrama
c57e6e4396 Expand trees together - including fragments, not including litho components
Summary: When expanding one tree, the other tree also expands. This expanding jumps over fragments (which are not in the accessibility tree) so that the trees can stay in sync even when there are extra wrappers in the main tree. Need to figure out functionality for litho components (these simply don't expand together right now since the relationship between the trees at these nodes are less obvious).

Differential Revision: D8943229

fbshipit-source-id: 289c3511a6495508b45a62da13ae4c50209e6118
2018-07-25 10:19:37 -07:00
Pascal Hartig
a876f90b68 Fix lint error
Summary: Per title. CI is unhappy.

Reviewed By: jknoxville

Differential Revision: D8991974

fbshipit-source-id: db7b9161b814fbbae0849d3ee3d551a7a8588985
2018-07-25 09:19:38 -07:00
Pascal Hartig
6a7a580db3 Import "Fix some typos (it's vs its)" (#175)
Summary:
Original author: noahsark769

Closes https://github.com/facebook/Sonar/pull/175

Reviewed By: jknoxville

Differential Revision: D8989724

fbshipit-source-id: 8e1c09196b0c6c0d0fb0446a2a4a595d09f21652
2018-07-25 07:18:54 -07:00
Sam Goldman
51741a2741 Update Sonar from 0.69.0 to 0.70.0
Summary:
All the new errors were missing annotation errors. I fixed as many as I could
by adding annotations. For the rest I added a $FlowFixMe suppression type.

Reviewed By: nmote

Differential Revision: D8756267

fbshipit-source-id: a69b6e21525b9b12e582ff18dcb1eeea584abb2a
2018-07-06 16:04:19 -07:00
Sara Valderrama
d8cf48d750 Two-tree view up and running, separately interactive/editable
Summary: Added duplicate view tree (will be replaced with accessibility node tree eventually). Can toggle ax mode on and off and interact with each tree individually to view/change properties.

Reviewed By: danielbuechele

Differential Revision: D8717557

fbshipit-source-id: 1109ccafd49b6958ee7a70c2e8851ed8351516ae
2018-07-05 16:19:29 -07:00
Hilal Alsibai
44f561a683 Add ability to dynamically extend the layout inspector sidebar
Summary: This adds the ability to extend the layout inspector's sidebar via SidebarExtensions

Reviewed By: sjkirby

Differential Revision: D8677332

fbshipit-source-id: 1880d5d2185306290a278e8a48e965ad94b98cc0
2018-07-03 16:33:42 -07:00
Daniel Büchele
cbab597236 show only one device in sidbar
Summary:
Refactors the plugin architecture of Sonar:
- Before plugin rendering had it's own implementation of the react lifecycle. This means the `render`-function was not called by react, but rather by the application it self. In this diff, the render method is now called from react, which enables better debugging and allows react to do optimizations.
- Business logic for querying emulators is moved away from the view components into its own dispatcher
- All plugin handling is moved from `App.js` to `PluginContainer`.
- The sidebar only shows one selected device. This allows us to add the screenshot feature as part of the Sonar main app and not a plugin.
- This also fixes the inconsistency between the devices button and the sidebar

Reviewed By: jknoxville

Differential Revision: D8186933

fbshipit-source-id: 46404443025bcf18d6eeba0679e098d5440822d5
2018-06-25 10:04:00 -07:00
Daniel Buchele
6fda334a00 fbshipit-source-id: 5d9ecf33fca19e4a6b8c979b879ec9dd82af1ef9 2018-06-25 04:33:04 -07:00
Daniel Buchele
f7d487dd76 fbshipit-source-id: 2cd940396d650342920b28835f6e672febe6b55c 2018-06-12 03:39:09 -07:00
Daniel Büchele
fbbf8cf16b Initial commit 🎉
fbshipit-source-id: b6fc29740c6875d2e78953b8a7123890a67930f2
Co-authored-by: Sebastian McKenzie <sebmck@fb.com>
Co-authored-by: John Knox <jknox@fb.com>
Co-authored-by: Emil Sjölander <emilsj@fb.com>
Co-authored-by: Pritesh Nandgaonkar <prit91@fb.com>
2018-06-01 11:03:58 +01:00