Commit Graph

129 Commits

Author SHA1 Message Date
Roman Gorbunov
6c5e2cbcf8 Added highlighting of search results
Summary:
Text of the component is now can be searched if flipper layout plugin
Flipper now highlight all the row if name of id or text of this component matched to the query

Reviewed By: priteshrnandgaonkar

Differential Revision: D16108315

fbshipit-source-id: ff5eb0bc4890f02c9b07e47c26b9ea1408d9c606
2019-07-08 03:43:55 -07:00
John Knox
33df17b462 Fix layout search red text
Summary: The search text should only appear red when it's a regex, and when that regex is not valid.

Reviewed By: danielbuechele

Differential Revision: D16091096

fbshipit-source-id: 22b3e229e2c82ced956bae8fd203c5f177323dc2
2019-07-03 03:40:16 -07:00
Benjamin Elo
28d4e6409d Created chained button group component
Summary:
This is a new component that allows for chaining of buttons in a button group by placing an icon in between them.

This is how we plan to navigate between views within an Android app.

Reviewed By: danielbuechele

Differential Revision: D16071234

fbshipit-source-id: 404a3a341081b6111667bd5acf27876bec627435
2019-07-01 08:31:22 -07:00
Roman Gorbunov
30b7d4e9dd Copy ID of view
Summary: Now if you copy one of components in flipper in layout plugin, you will get not only name but also id in your clipboard

Reviewed By: priteshrnandgaonkar

Differential Revision: D16031628

fbshipit-source-id: e2c38182dea28719615609f3aa2c74e58749cce4
2019-06-28 01:51:40 -07:00
Benjamin Elo
ecf2831d5d Added toggle fix for dropdown device menu
Summary:
Summary of Bug:

The devices menu popup does not toggle as expected.

Because of the way the click event is fired in Javascript, that is mousedown, mouseup, click, and the fact that the electron menu closes on mousedown, was why the menu was not toggling as expected.

Fix:

This is a potential fix where I add some state to tell if the menu was recently closed, and disable the popup if it was. This is done through the callback method of menu.popup. Then on the next mouse event I renable the popup.

In addition to this, I moved the popup logic into onMouseUp instead of onClick. This was simply to make the code neater. Before I would have to add a timer to the onMouseUp event that would fire after the click event and renable the popup.

Let me know if there is a simple solution to this problem that I've completely missed.

Reviewed By: jknoxville

Differential Revision: D16028864

fbshipit-source-id: a73202536762cce2ab623176cbda0369ca2b8079
2019-06-27 07:19:43 -07:00
Pritesh Nandgaonkar
81b71352dd Fix the bug related to the crash selection
Summary:
Fixes the bug when the crash options had same title. Selection was broken in that case. Look at the video.

{F163450316}

Reviewed By: jknoxville

Differential Revision: D15985919

fbshipit-source-id: 7366c8f5f33bbddc15c058b7d20d78d295161404
2019-06-27 06:58:08 -07:00
Daniel Büchele
ab6fe68a70 show multiple lines of markers
Summary: Multiple markers might got truncated, now the list expands on hover

Reviewed By: jknoxville

Differential Revision: D15939404

fbshipit-source-id: 2640f200dc17876391e04eeced59bc7a2d925113
2019-06-21 05:57:29 -07:00
John Knox
9c99211221 Rename regexSupported to allowRegexSearch
Summary: This was annoying me so I thought I'd rename it before anyone else starts to use the prop.

Reviewed By: danielbuechele

Differential Revision: D15919159

fbshipit-source-id: c351503797cedc5c11a158cec62515b1eb791a70
2019-06-20 06:29:10 -07:00
John Knox
5200f4f528 Use monospace font for regex in searchable
Summary:
Seemed a bit weird typing a regex without monospace.
Still would be good to have syntax highlighting. I tried using prismjs, but it seems to not work by default on Input elements.

Reviewed By: danielbuechele

Differential Revision: D15918742

fbshipit-source-id: b44c228b30f37f97811d09c80b191b52282720f8
2019-06-20 05:04:50 -07:00
Pascal Hartig
5c497d3eea Make the sidebar pretty
Summary:
Now that the events tracking works again, make sure that the padding is not all over the place in the sidebar.

Before:

{F162525912}

Reviewed By: priteshrnandgaonkar

Differential Revision: D15875758

fbshipit-source-id: a30f057c8c0dc2dc77fc40f416ff565cc6621109
2019-06-20 03:51:17 -07:00
John Knox
b7229b40ac Add regex search to logs plugin
Summary:
Adds regex support to the logs plugin.

You can now do the same for any other SearchableTable, just by adding the prop `regexSupported={true}`

For other types of searchables, like maybe the layout hierarchy, we'll need to modify the class that does the filtering for that type.

I've done what I can with the UI to make it usable, though it would be awesome to have some proper regex syntax parsing and highlighting going on. It will go red if it's not valid at least.

Reviewed By: danielbuechele

Differential Revision: D15898806

fbshipit-source-id: 425edb1834dcc14ca741ac7fc8d566b4f2763c63
2019-06-20 02:50:20 -07:00
Daniel Büchele
8bc26378f0 copy virtualized rows
Summary: Rows that were virtualized and currently not rendered weren't copied, because we were using the DOM to get their content. This changes this to use out `textContent` utility to get the value of a row and therefore enables copying rows that are not rendered.

Reviewed By: jknoxville

Differential Revision: D15898935

fbshipit-source-id: c372bc4e77477214860f0513b442374da8f72416
2019-06-19 09:01:00 -07:00
Daniel Büchele
3f1ab6be47 fix range select
Summary:
Where was a bug, where a range selection using the shift key wasn't working, when the start of the selection was outside the viewport.
The problem was caused by `selectInRange` firing twice, the second time with wrong arguments. In this diff, we are not firing the `onMouseEnterRow` handler, when the shift key is pressed.

Reviewed By: jknoxville

Differential Revision: D15897880

fbshipit-source-id: 95402dcbe9f8ce691be16cfd103918b09ff9e75c
2019-06-19 06:25:45 -07:00
John Knox
6bdaa6aff1 Keep autoscrolling even when a table is cleared
Summary:
The logs plugin had an inconsistency where you'd be tailing the logs, and then hit "Clear Logs", which would empty the screen, but as the page fills up again, it would stay in the current position and not scroll with the new ones coming in.

This makes it consistent by making the behaviour:
```
If not props.stickyBottom
    never autoscroll, e.g. for static tables of data
else
    if scrolled to the bottom
        autoscroll
    if all the rows fit into the screen at once
        autoscroll
```

Reviewed By: passy

Differential Revision: D15856813

fbshipit-source-id: 1357b0e39b576dbe69d260545b21fdab808d2bd2
2019-06-18 09:34:16 -07:00
Daniel Büchele
5aaf0c4f29 debounce search
Summary:
Debouncing search to prevent triggering multiple searches, while typing.
Now, a search is only triggered, when the input hasn't changed for more than 200ms.
This affects all SearchableTables.

Reviewed By: passy

Differential Revision: D15855343

fbshipit-source-id: 261cf601249ac604c865ae10deb25d5c836f964a
2019-06-17 10:02:37 -07:00
John Knox
1d776f6b9e Add copy with columns header option to table rows
Summary: Add "With columns header" and "Without columns header" options when copying rows.

Reviewed By: danielbuechele

Differential Revision: D15854176

fbshipit-source-id: ff7b5639cc313b74528e5e85f6c84e314058e899
2019-06-17 09:29:37 -07:00
John Knox
062cbc0dbd Fix contextClick after multi-highlight
Summary:
Select multiple rows, and then right click, or use Ctrl-click.
This was broken, it was resetting the selection when this happened.
This fixes it.

Now after selecting multiple, what happens depends where you right-click.

If you right-click within the current selection, it stays selected and you can copy it.
But if you right-click outside the current selection, that row becomes the new selected set, and you will just be able to copy that one. This feels right to me.

Reviewed By: passy

Differential Revision: D15822668

fbshipit-source-id: 6a6cda8a8f16fec55cffa52c1c2ff958c86b3f43
2019-06-14 09:13:52 -07:00
David Aurelio
c4f395dda2 Allow more alignments
Summary: Allows `flex-start` and `flex-end` as aligment values on table cells.

Reviewed By: danielbuechele

Differential Revision: D15754424

fbshipit-source-id: 67449e429e6841800cfab7728f51e2d59cb36f0f
2019-06-11 09:23:13 -07:00
Daniel Büchele
79414aa3e1 Bumped electron version
Summary:
We in React VR were need newer Chrome DevTools version to make our plugin work properly. Chromium version with required fixes were shipped in electron 5.0.0.

This diff bumps electron version and explicitly allows node integration (accessing require, process and other node related functions from window object in index.html), because it was disabled by default in 5.0.0.

Reviewed By: jknoxville

Differential Revision: D15693539

fbshipit-source-id: 4f71a07b2afaa489aec46940c924f4ad30ad0413
2019-06-10 10:36:25 -07:00
David Aurelio
844cabd5d3 ElementsInspector: Allow for custom row decorations.
Summary: Adds the capability to customize rows in the elements inspector via a callback.

Reviewed By: danielbuechele

Differential Revision: D15738355

fbshipit-source-id: 27b91a74535736318b7fdb9d2eb44dfa20b4d77b
2019-06-10 08:39:05 -07:00
David Aurelio
6792fb0bea StatusIndicator: support inline contexts.
Summary:
`StatusIndicator` works well as a flex child, but didn’t support usage in inline / text contexts.

Adding `display: inline-block` fixes that.

Reviewed By: danielbuechele

Differential Revision: D15695673

fbshipit-source-id: 30378d2292390b8d86c0a26c11571e5953b841f2
2019-06-07 08:36:12 -07:00
David Aurelio
8b7f17d932 Pull out colored disc indicator
Summary:
Pulls out the local `Lamp` component from `PluginDebugge` into `StatusIndicator`.

This will allow to reuse the component in different context, to guarantee a consistent appearance of Flipper throughout.

For good measure, we make diameter and title configurable. Vertical alignment is changed from `margin-top` to `align-self`.

Reviewed By: danielbuechele

Differential Revision: D15692275

fbshipit-source-id: 438b2f5300175565dbf07d07a5d757936b4f7cfe
2019-06-06 04:09:56 -07:00
John Knox
2221090037 Fix Select value/selected React warning
Summary:
React outputs the following error:
  Warning: Use the `defaultValue` or `value` props on <select> instead of setting `selected` on <option>.

This fixes it by using value instead of selected.

Reviewed By: danielbuechele

Differential Revision: D15535717

fbshipit-source-id: eb784ba2cdefe1c6744cc15592cd3e0191d237d0
2019-05-30 03:15:29 -07:00
John Knox
79902cd7cb Fix some react warnings
Summary: React is printing errors saying not to use "Span", and booleans in html properties

Reviewed By: danielbuechele

Differential Revision: D15535593

fbshipit-source-id: e074137c89abfa69625b370087c9c18b579ff279
2019-05-30 03:15:28 -07:00
Daniel Büchele
8c4e373dfc fix table context menu/drag-select
Summary:
As seen [here](https://fb.workplace.com/groups/230455004101832/permalink/623364598144202/?comment_id=623436418137020&comment_tracking=%7B%22tn%22%3A%22R%22%7D) using the primary key + CTRL to open the context menu, triggers the drag-select mode. This should not be the case. This diff changes the behaviour to:

- Not trigger the drag-select-mode, when openting the context menu using CTRL
- Select the current row, when performing a context click on it.

Reviewed By: jknoxville

Differential Revision: D15538057

fbshipit-source-id: d3d086c3d44618b2801e3a9b0646689c04fa32ff
2019-05-30 02:35:18 -07:00
Daniel Büchele
53b852dbe6 fix undefined colors on litho components
Summary:
When a color was changed on a litho component, the changes were made, but the display in Flipper's layout sidebar always showed `rgba(0,0,0,0)` as a color. This was because reading the color failed for `ComparableColorDrawable` and it sent `0` as fallback value.

This diff adds an additional check if the value is an instance of `ComparableColorDrawable` and reads the color from it.

Reviewed By: passy

Differential Revision: D15469093

fbshipit-source-id: 7f1aaf1c4981815605aca5ba735fa09e80deaa42
2019-05-29 09:19:29 -07:00
John Knox
592bd2671f Fix copy cell wrong cell bug
Summary:
It was relying on hash keys to be in order, which obviously won't work. Logs plugin, on "copy message" was copying a timestamp instead.
Fixed by using the columnOrder state instead.

Reviewed By: danielbuechele

Differential Revision: D15535281

fbshipit-source-id: 2d7db95c16cc4f75c0d9cf14806fcc80cc8e4bd9
2019-05-29 08:43:40 -07:00
John Knox
a630b50a8f Add databases plugin v0 (android) (#441)
Summary:
Adds a plugin for listing the databases, tables and contents of those tables in an android app.
Right now, works with sqlite, but it should be generic enough to work with other db types.

## Changelog

Add initial version of android databases plugin

Creating a PR, I may need to do some cleaning up, but this is to kick off that process.
Pull Request resolved: https://github.com/facebook/flipper/pull/441

Reviewed By: danielbuechele

Differential Revision: D15288831

Pulled By: jknoxville

fbshipit-source-id: 6379ad60d640ea6b0a9473acc03dd6ea81a3a8d4
2019-05-28 10:17:56 -07:00
John Knox
d85a357428 Fix columnSize prop
Summary: I added column size persistence when resizing manually, but broke initial column sizing when a prop is provided. This fixes it.

Reviewed By: passy

Differential Revision: D15392145

fbshipit-source-id: 53f79c520917cd571302502c8b75aa0475567cb9
2019-05-17 06:30:28 -07:00
Daniel Büchele
ffea42e57f show/update focused element
Summary: This was already implemented in the old versin of layout inspector and got lost during the refactoring. When using talkback, the focused view is highlighted in green in the a11y inspector.

Reviewed By: passy

Differential Revision: D15294025

fbshipit-source-id: 92cc015e4bc726515e433b7b96f924246916972d
2019-05-10 06:19:28 -07:00
Daniel Büchele
e38fc0ca90 update FB brand color
Summary: Updating FB's brandcolor to reflect launch of FB5.

Reviewed By: passy

Differential Revision: D15293747

fbshipit-source-id: e3c99119ccf9301cb0a3b64cdb06ead5cc31b338
2019-05-10 05:53:43 -07:00
John Knox
9528078296 Add "Copy cell" to ManagedTable
Summary:
Previously you could only copy the entire row.
Now you can choose which cell to copy.
Not the perfect UI admittedly, but that would require a big change to make individual cells selectable. I think it's a definite improvement.

Reviewed By: passy

Differential Revision: D15231784

fbshipit-source-id: 0d52192a5bf4e8ea1ebee74988c749d3f602fea9
2019-05-08 09:42:00 -07:00
John Knox
9bd6b6a607 Disable onClick for resize area of Interactive components
Summary: This was causing resizing to trigger onClick every time, which isn't wanted.

Reviewed By: passy

Differential Revision: D15219039

fbshipit-source-id: ea5d9221b0ce8fa7a050a8410876cf78bfee2bc6
2019-05-07 11:46:04 -07:00
John Knox
98d3dd4ebd Add initialSortOrder prop
Summary: Allows for sort order to be preserved and applied from the start.

Reviewed By: danielbuechele

Differential Revision: D15182696

fbshipit-source-id: ad546ce35bf4637ca637589c6c3d6291a4313db7
2019-05-03 11:13:11 -07:00
John Knox
70edb08999 Remember resized column sizes
Summary:
Adds a global inside managed table where, whenever a table key is provided, the column sizes are stored.
Then if a new table is constructed with the same key, it will get the sizes from before.

Reviewed By: danielbuechele

Differential Revision: D15181762

fbshipit-source-id: 98b5a14f8805075928cbe51511609b8b58c512fd
2019-05-03 11:07:31 -07:00
Daniel Büchele
fca7bc93ee horizontal scrolling
Summary:
Adding a property `horizontallyScrollable` the `ManagedTable` that enables horizontal scrolling, if that is required by the table's contents.
By default this behaviour is disabled to not break existing tables.

Reviewed By: jknoxville

Differential Revision: D15166144

fbshipit-source-id: 7a9b76facdbe717deb3d097e0b8883d4b0732d51
2019-05-01 09:32:32 -07:00
Pascal Hartig
6db83a7675 Use ToggleSwitches for binary options
Summary:
We've had a bunch of different options that were all binary
switches with very different ways of displaying them.

This consolidates them all to use ToggleSwitches. I think it
may still make sense to move them all to a sidebar as it's
the case for the Analytics plugin, but that's for another diff.

Reviewed By: danielbuechele

Differential Revision: D14933392

fbshipit-source-id: 7ef286b61142a564a7cde6de875266ac8641704b
2019-04-17 10:31:21 -07:00
Daniel Büchele
6741c55b72 fix "cannnot convert object to primitve value"
Summary:
The `instanceof Object` check was throwing an "cannnot convert object to primitve value" error, for some reason that I didn't fully understand. Replacing this check with a `typeof` check. However, `null` also returns `object`, so we are explictly checking this as well.

This was the error that happened before, on every POST request:
https://pxl.cl/vc6K

Reviewed By: passy

Differential Revision: D14827145

fbshipit-source-id: 999480db9afb1e0cc0d1bef73fb0cb2223fa0bc4
2019-04-08 03:09:38 -07:00
John Knox
57a24769e8 JS side of Native Plugins
Summary:
Native plugins are plugins that can be written in mobile code alone (java/objc), provided they conform to a template, currently table is the only implemented template.

This adds support to flipper for handling them.

Reviewed By: danielbuechele

Differential Revision: D14502188

fbshipit-source-id: a96be9b06de1cecf7977c4ef2fd05b168f7f1330
2019-03-22 07:07:31 -07:00
JianyingLi
2564bce5a0 Fix DataInspector Component diff some problems. (#397)
Summary:
1. In `diffMetadataExtractor` function, when the `data` or `diff` is `null`, it diff view does not display correctly.

```jsx

<Panel floating={false} heading={'Test'}>
  <ManagedDataInspector
    diff={{
      auth: null
    }}
    data={{
      auth: {
        user: {
          name: 'JianyingLi'
        }
      }
    }}
    expandRoot={true}
  />
</Panel>
```

Before:
![2561552808023_ pic](https://user-images.githubusercontent.com/3889523/54486986-db383b80-48ca-11e9-9869-a008f72f4324.jpg)

After:
![2551552807969_ pic](https://user-images.githubusercontent.com/3889523/54486992-ea1eee00-48ca-11e9-90b0-7fd043f1c2bd.jpg)

2. Status `added`(green) and `removed`(red) should be the opposite

```jsx
<ManagedDataInspector
  diff={{
    user: {
      name: 'Leo'
    }
  }}
  data={{
    user: {
      name: 'JianyingLi'
    }
  }}
  expandRoot={true}
/>
```

Before:
![2591552808195_ pic](https://user-images.githubusercontent.com/3889523/54487019-35390100-48cb-11e9-8c20-1526aeae52a1.jpg)

After:
![2581552808145_ pic](https://user-images.githubusercontent.com/3889523/54487022-3c600f00-48cb-11e9-9ea9-75a8c8490c22.jpg)
Pull Request resolved: https://github.com/facebook/flipper/pull/397

Reviewed By: danielbuechele

Differential Revision: D14505757

Pulled By: passy

fbshipit-source-id: 35ca1bf8721468fdde13f3a9ede75cb72a59caea
2019-03-19 17:04:15 -07:00
Pritesh Nandgaonkar
574ae7a3e8 Improve CrashReporter UI for the latest crash
Summary: I have updated the UI of the crash reporter. It doesn't show the multiple crashes now. I will work on that in other diff. This diff just updates the current UI that shows the latest crash, as per the [design](https://our.intern.facebook.com/intern/px/p/pJ11/)

Reviewed By: danielbuechele

Differential Revision: D14399400

fbshipit-source-id: f6f28c2c6d386f4cd99a257922993ef355b1059b
2019-03-19 08:18:13 -07:00
Daniel Büchele
f9ec0cd326 fix colorpicker in panel. Fixes #396
Summary: Overflow on panels was clipped. Setting overflow visible to make it visible.

Reviewed By: passy

Differential Revision: D14519402

fbshipit-source-id: 264f99e3ac20986365c8f69564c4633818dd4a94
2019-03-19 04:17:40 -07:00
Pascal Hartig
3141b954bf Run prettier fix
Summary: Should also fix the build.

Reviewed By: jknoxville

Differential Revision: D14477777

fbshipit-source-id: 01fcfb2321c9b7a12acdf079473d91b6805d4dda
2019-03-15 05:13:30 -07:00
Daniel Büchele
99ea11b8e6 createPaste
Reviewed By: jknoxville

Differential Revision: D14224400

fbshipit-source-id: 9a9a8578de00d276d65a7928964eae619f5bc41f
2019-02-28 07:28:25 -08:00
Daniel Büchele
385d74ef30 remove virtualization
Summary:
Removing the virtualization in the elements inspector. This didn't really make sense here, because usually the inspector renders 10-1000 rows, which can be easily done in the browser. Having virtualization here, caused some problems with icons flickering and scrolling being broken.

Let's make it less complex and just remove the virtualization!

Reviewed By: jknoxville

Differential Revision: D14209815

fbshipit-source-id: 115d3ed57a1ccdbc20108636ff4fc7fc68e6c9c0
2019-02-26 02:37:17 -08:00
Daniel Büchele
f1d46caa2f remove console.log
Summary: as per title

Reviewed By: jknoxville

Differential Revision: D14207127

fbshipit-source-id: e6608382061f4c4a8aff3076810d7ab32be9e990
2019-02-25 03:01:30 -08:00
Pascal Hartig
2a94da7db3 Best-effort fix for crash
Summary:
The keys in WeakMaps have to be Objects (i.e. can't be primitives) as
they have to be fall under the responsibility of the GC.

Without this check, we may get "TypeError: Invalid value used as weak map key"
as we accept `any` as `data` for the inspector. I'm not entirely
confident if this check is enough, but I also don't have a way of reproducing
the error we got reported.

Reviewed By: jknoxville

Differential Revision: D14182463

fbshipit-source-id: 3397678935f08513e485bf5654377b54053ee32f
2019-02-22 11:07:55 -08:00
Daniel Büchele
8ff625397b persist search
Summary:
The search query can only be persisted if we have an identifier for the searchable component. For this we already have a property `tableKey` on our `ManagedTable`. However, we don't want to require every plugin to provide a key for their table.

In this diff, a tableKey is auto-generated from the table's column configuration. This should be good enough to uniquely identify a table and persist it's query.

Reviewed By: passy

Differential Revision: D14168577

fbshipit-source-id: 13e928a606c3a05096dfbfb01ae90b15aa085bf2
2019-02-21 10:02:45 -08:00
Artur Pyrogovskyi
0a59dc2918 Added onSort and a fix for columnOrder to ManagedTable
Summary:
1. Added onSort() pass-through to ManagedTable which allows to handle sort order changes.

2. columnOrder now gets updated when the corresponding prop is changed indepedently from ref.

Reviewed By: danielbuechele

Differential Revision: D14147857

fbshipit-source-id: 03300629a3316a69be6b745810516966b8060aa6
2019-02-21 02:02:09 -08:00
Pritesh Nandgaonkar
5ad41b48ff Solves the bug which destroyed multi selection on ctrl+click
Summary: Soves the bug which caused the multiselection to clear off when one did ctrl+click

Reviewed By: jknoxville

Differential Revision: D14103906

fbshipit-source-id: 834d79e1c86a89b4d90c26e8db1850c1e8712a5d
2019-02-18 14:44:18 -08:00