Enforce react/jsx-boolean-value

Summary: yarn fix results. Reviewed By: nikoant Differential Revision: D28329714 fbshipit-source-id: 564aa24bcdb4bc6cdea67dfad10a077a9c817a2d
2021-05-11 10:12:56 -07:00
parent 8ba27f5487
commit 69c7876be9
37 changed files with 71 additions and 86 deletions
--- a/desktop/app/src/chrome/RatingButton.tsx
+++ b/desktop/app/src/chrome/RatingButton.tsx
@@ -223,7 +223,7 @@ class FeedbackComponent extends Component<
              onKeyDown={(e) =>
                e.key == 'Enter' && this.onCommentSubmitted(this.state.comment)
              }
-              autoFocus={true}
+              autoFocus
            />
          </Row>,
          <Row key="contactCheckbox">
--- a/desktop/app/src/chrome/SettingsSheet.tsx
+++ b/desktop/app/src/chrome/SettingsSheet.tsx
@@ -191,7 +191,7 @@ class SettingsSheet extends Component<Props, State> {
            <FilePathConfigField
              label="IDB binary location"
              defaultValue={idbPath}
-              isRegularFile={true}
+              isRegularFile
              onChange={(v) => {
                this.setState({
                  updatedSettings: {...this.state.updatedSettings, idbPath: v},
--- a/desktop/app/src/chrome/ShareSheetErrorList.tsx
+++ b/desktop/app/src/chrome/ShareSheetErrorList.tsx
@@ -48,7 +48,7 @@ export default class Popover extends PureComponent<Props> {
      return null;
    }
    return (
-      <VBox scrollable={true} maxHeight={300}>
+      <VBox scrollable maxHeight={300}>
        <Info type={this.props.type}>
          <Title bold>{this.props.title}</Title>
          {this.props.errors.map((e: Error, index) => (
--- a/desktop/app/src/chrome/VideoRecordingButton.tsx
+++ b/desktop/app/src/chrome/VideoRecordingButton.tsx
@@ -81,7 +81,7 @@ export default class VideoRecordingButton extends Component<Props, State> {
    const {selectedDevice} = this.props;
    return (
      <Button
-        compact={true}
+        compact
        onClick={this.onRecordingClicked}
        pulse={this.state.recording}
        selected={this.state.recording}
--- a/desktop/app/src/chrome/plugin-manager/PluginInstaller.tsx
+++ b/desktop/app/src/chrome/plugin-manager/PluginInstaller.tsx
@@ -147,7 +147,7 @@ const PluginInstaller = function ({
        <ManagedTable_immutable
          rowLineHeight={28}
          floating={false}
-          multiline={true}
+          multiline
          columnSizes={columnSizes}
          columns={columns}
          highlightableRows={false}
--- a/desktop/app/src/chrome/plugin-manager/tests/PluginInstaller.node.tsx
+++ b/desktop/app/src/chrome/plugin-manager/tests/PluginInstaller.node.tsx
@@ -82,7 +82,7 @@ test('load PluginInstaller list', async () => {
        // Bit ugly to have this as an effectively test-only option, but
        // without, we rely on height information from Electron which we don't
        // have, causing no items to be rendered.
-        autoHeight={true}
+        autoHeight
      />
    </Provider>
  );
@@ -106,7 +106,7 @@ test('load PluginInstaller list with one plugin installed', async () => {
        // Bit ugly to have this as an effectively test-only option, but
        // without, we rely on height information from Electron which we don't
        // have, causing no items to be rendered.
-        autoHeight={true}
+        autoHeight
      />
    </Provider>
  );
--- a/desktop/app/src/createTablePlugin.tsx
+++ b/desktop/app/src/createTablePlugin.tsx
@@ -198,18 +198,18 @@ export function createTablePlugin<T extends RowData>(props: Props<T>) {
      const {columns, columnSizes} = props;
      const {rows} = this.props.persistedState;
      return (
-        <FlexColumn grow={true}>
+        <FlexColumn grow>
          <SearchableTable_immutable
            key={this.constructor.id}
            rowLineHeight={28}
            floating={false}
-            multiline={true}
+            multiline
            columnSizes={columnSizes}
            columns={columns}
            onRowHighlighted={this.onRowHighlighted}
-            multiHighlight={true}
+            multiHighlight
            rows={rows}
-            stickyBottom={true}
+            stickyBottom
            actions={<Button onClick={this.clear}>Clear Table</Button>}
          />
          <DetailSidebar>{this.renderSidebar()}</DetailSidebar>
--- a/desktop/app/src/plugins/TableNativePlugin.tsx
+++ b/desktop/app/src/plugins/TableNativePlugin.tsx
@@ -124,7 +124,7 @@ function renderValue({type, value}: {type: string; value: any}) {
  switch (type) {
    case 'boolean':
      return (
-        <BooleanValue code={true} active={value}>
+        <BooleanValue code active={value}>
          {value.toString()}
        </BooleanValue>
      );
@@ -232,7 +232,7 @@ function renderSidebarSection(
    case 'json':
      return (
        <Panel floating={false} heading={section.title} key={index}>
-          <DataInspector data={section.content} expandRoot={true} />
+          <DataInspector data={section.content} expandRoot />
        </Panel>
      );
    case 'toolbar':
@@ -240,7 +240,7 @@ function renderSidebarSection(
    default:
      return (
        <Panel floating={false} heading={'Details'} key={index}>
-          <DataInspector data={section} expandRoot={true} />
+          <DataInspector data={section} expandRoot />
        </Panel>
      );
  }
@@ -480,20 +480,20 @@ export default function createTableNativePlugin(id: string, title: string) {
        : null;

      return (
-        <FlexColumn grow={true}>
+        <FlexColumn grow>
          {topToolbarComponent}
          <SearchableTable
            key={this.constructor.id}
            rowLineHeight={28}
            floating={false}
-            multiline={true}
+            multiline
            columnSizes={columnSizes}
            columnOrder={columnOrder}
            columns={columns}
            onRowHighlighted={this.onRowHighlighted}
-            multiHighlight={true}
+            multiHighlight
            rows={this.applyMetadataToRows(rows)}
-            stickyBottom={true}
+            stickyBottom
            actions={<Button onClick={this.clear}>Clear Table</Button>}
          />
          <DetailSidebar>{this.renderSidebar()}</DetailSidebar>
--- a/desktop/app/src/ui/components/ButtonGroup.tsx
+++ b/desktop/app/src/ui/components/ButtonGroup.tsx
@@ -36,7 +36,7 @@ export const ButtonGroupContext = createContext(false);
 */
 export default function ButtonGroup({children}: {children: React.ReactNode}) {
  return (
-    <ButtonGroupContext.Provider value={true}>
+    <ButtonGroupContext.Provider value>
      <Space>{children}</Space>
    </ButtonGroupContext.Provider>
  );
--- a/desktop/app/src/ui/components/ButtonGroupChain.tsx
+++ b/desktop/app/src/ui/components/ButtonGroupChain.tsx
@@ -72,7 +72,7 @@ type Props = {
 */
 export default function ButtonGroupChain({children, iconSize, icon}: Props) {
  return (
-    <ButtonGroupContext.Provider value={true}>
+    <ButtonGroupContext.Provider value>
      <ButtonGroupChainContainer iconSize={iconSize}>
        {React.Children.map(children, (child, idx) => {
          if (idx === 0) {
--- a/desktop/app/src/ui/components/ErrorBoundary.tsx
+++ b/desktop/app/src/ui/components/ErrorBoundary.tsx
@@ -76,7 +76,7 @@ export default class ErrorBoundary extends Component<
      }

      return (
-        <ErrorBoundaryContainer grow={true}>
+        <ErrorBoundaryContainer grow>
          <Heading>{heading}</Heading>
          {this.props.showStack !== false && (
            <ErrorBoundaryStack error={error} />
--- a/desktop/app/src/ui/components/FileSelector.tsx
+++ b/desktop/app/src/ui/components/FileSelector.tsx
@@ -91,7 +91,7 @@ export default function FileSelector({
      <FileInputBox
        placeholder={placeholderText}
        value={value}
-        isValid={true}
+        isValid
        onDrop={(e) => {
          if (e.dataTransfer.files.length) {
            onChange(e.dataTransfer.files[0].path);
--- a/desktop/app/src/ui/components/StackTrace.tsx
+++ b/desktop/app/src/ui/components/StackTrace.tsx
@@ -188,7 +188,7 @@ export default class StackTrace extends Component<{
          <ManagedTable
            columns={columns}
            rows={rows}
-            hideHeader={true}
+            hideHeader
            autoHeight
            zebra={false}
            columnOrder={columnOrder}
--- a/desktop/app/src/ui/components/Tabs.tsx
+++ b/desktop/app/src/ui/components/Tabs.tsx
@@ -315,7 +315,7 @@ export default function Tabs(props: {
  }

  return (
-    <FlexColumn grow={true}>
+    <FlexColumn grow>
      <TabList>
        {before}
        {tabList}
--- a/desktop/app/src/ui/components/TabsContainer.tsx
+++ b/desktop/app/src/ui/components/TabsContainer.tsx
@@ -26,7 +26,7 @@ export const TabsContext = React.createContext(true);
 export default function TabsContainer(props: {children: any}) {
  return (
    <Container>
-      <TabsContext.Provider value={true}>{props.children}</TabsContext.Provider>
+      <TabsContext.Provider value>{props.children}</TabsContext.Provider>
    </Container>
  );
 }
--- a/desktop/app/src/ui/components/VirtualList.tsx
+++ b/desktop/app/src/ui/components/VirtualList.tsx
@@ -133,11 +133,7 @@ export default class VirtualList extends Component<
    }

    return (
-      <View
-        grow={true}
-        onScroll={this.handleScroll}
-        ref={this.setRef}
-        scrollable={true}>
+      <View grow onScroll={this.handleScroll} ref={this.setRef} scrollable>
        {inner}
      </View>
    );
--- a/desktop/app/src/ui/components/elements-inspector/sidebar.tsx
+++ b/desktop/app/src/ui/components/elements-inspector/sidebar.tsx
@@ -66,8 +66,8 @@ class InspectorSidebarSection extends Component<InspectorSidebarSectionProps> {
          data={this.props.data}
          setValue={this.props.onValueChanged ? this.setValue : undefined}
          extractValue={this.extractValue}
-          expandRoot={true}
-          collapsed={true}
+          expandRoot
+          collapsed
          tooltips={this.props.tooltips}
        />
      </Panel>
--- a/desktop/app/src/ui/components/table/TableHead.tsx
+++ b/desktop/app/src/ui/components/table/TableHead.tsx
@@ -178,7 +178,7 @@ class TableHeadColumn extends PureComponent<{
    if (isResizable) {
      children = (
        <TableHeaderColumnInteractive
-          grow={true}
+          grow
          resizable={RIGHT_RESIZABLE}
          onResize={this.onResize}
          minWidth={20}>
--- a/desktop/flipper-plugin/src/ui/data-inspector/tests/DataInspector.node.tsx
+++ b/desktop/flipper-plugin/src/ui/data-inspector/tests/DataInspector.node.tsx
@@ -32,7 +32,7 @@ test('changing collapsed property works', async () => {
  res.rerender(<DataInspector data={json} collapsed={false} expandRoot />);
  await res.findByText(/cool/);

-  res.rerender(<DataInspector data={json} collapsed={true} expandRoot />);
+  res.rerender(<DataInspector data={json} collapsed expandRoot />);
  expect(res.queryAllByText(/cool/).length).toBe(0);
 });

--- a/desktop/flipper-plugin/src/ui/data-table/TableHead.tsx
+++ b/desktop/flipper-plugin/src/ui/data-table/TableHead.tsx
@@ -210,7 +210,7 @@ function TableHeadColumn({
  if (isResizable) {
    children = (
      <TableHeaderColumnInteractive
-        grow={true}
+        grow
        resizable={RIGHT_RESIZABLE}
        onResize={onResize}
        minWidth={20}>
--- a/desktop/plugins/public/cpu/TemperatureTable.tsx
+++ b/desktop/plugins/public/cpu/TemperatureTable.tsx
@@ -62,14 +62,14 @@ export default class TemperatureTable extends Component<TemperatureTableProps> {
  render() {
    return (
      <SearchableTable
-        multiline={true}
-        autoHeight={true}
+        multiline
+        autoHeight
        floating={false}
-        zebra={true}
+        zebra
        columnSizes={ColumnSizes}
        columns={Columns}
        rows={this.buildRows()}
-        grow={true}
+        grow
      />
    );
  }
--- a/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx
+++ b/desktop/plugins/public/databases/DatabaseDetailSidebar.tsx
@@ -81,9 +81,7 @@ function buildSidebarRow(key: string, val: Value): TableRow {
      var parsed = JSON.parse(val.value);
    } catch (_error) {}
    if (parsed) {
-      output = (
-        <ManagedDataInspector data={parsed} expandRoot={true} collapsed />
-      );
+      output = <ManagedDataInspector data={parsed} expandRoot collapsed />;
    }
  }
  return {
@@ -186,7 +184,7 @@ export default React.memo(function DatabaseDetailSidebar(
  );
  return (
    <DetailSidebar>
-      <Panel title="Row details" collapsible={true}>
+      <Panel title="Row details" collapsible>
        {onSave ? (
          <Layout.Right>
            <div />
--- a/desktop/plugins/public/databases/DatabasesPlugin.tsx
+++ b/desktop/plugins/public/databases/DatabasesPlugin.tsx
@@ -131,9 +131,9 @@ const QueryHistory = React.memo(({history}: {history: Array<Query>}) => {
        floating={false}
        columns={columns}
        columnSizes={{time: 75}}
-        zebra={true}
+        zebra
        rows={rows}
-        horizontallyScrollable={true}
+        horizontallyScrollable
      />
    </Layout.Horizontal>
  );
@@ -232,12 +232,12 @@ const DataTable = React.memo(
              }),
            {},
          )}
-          zebra={true}
+          zebra
          rows={page.rows.map((row: Array<Value>, index: number) =>
            transformRow(page.columns, row, index),
          )}
-          horizontallyScrollable={true}
-          multiHighlight={true}
+          horizontallyScrollable
+          multiHighlight
          onRowHighlighted={highlightedRowsChanged}
          onSort={sortOrderChanged}
          initialSortOrder={currentSort ?? undefined}
@@ -281,7 +281,7 @@ const QueryTable = React.memo(
        <Layout.Horizontal grow>
          <ManagedTable
            floating={false}
-            multiline={true}
+            multiline
            columnOrder={columns.map((name) => ({
              key: name,
              visible: true,
@@ -291,11 +291,11 @@ const QueryTable = React.memo(
                Object.assign({}, acc, {[val]: {value: val, resizable: true}}),
              {},
            )}
-            zebra={true}
+            zebra
            rows={rows.map((row: Array<Value>, index: number) =>
              transformRow(columns, row, index),
            )}
-            horizontallyScrollable={true}
+            horizontallyScrollable
            onRowHighlighted={highlightedRowsChanged}
          />
          {table.highlightedRows.length === 1 && (
--- a/desktop/plugins/public/fresco/ImagesCacheOverview.tsx
+++ b/desktop/plugins/public/fresco/ImagesCacheOverview.tsx
@@ -191,7 +191,7 @@ export default class ImagesCacheOverview extends PureComponent<

    return (
      <ImagesCacheOverview.Container
-        grow={true}
+        grow
        onKeyDown={this.onKeyDown}
        tabIndex={0}>
        <Toolbar position="top">
--- a/desktop/plugins/public/fresco/ImagesSidebar.tsx
+++ b/desktop/plugins/public/fresco/ImagesSidebar.tsx
@@ -100,10 +100,7 @@ class EventDetails extends Component<{
    const {event} = this.props;

    return (
-      <Panel
-        heading={<RequestHeader event={event} />}
-        floating={false}
-        padded={true}>
+      <Panel heading={<RequestHeader event={event} />} floating={false} padded>
        <p>
          <DataDescriptionKey>Attribution</DataDescriptionKey>
          <span key="sep">: </span>
--- a/desktop/plugins/public/fresco/index.tsx
+++ b/desktop/plugins/public/fresco/index.tsx
@@ -115,15 +115,14 @@ export function plugin(client: PluginClient<Events, Methods>) {
        message: (
          <Fragment>
            <InlineFlexRow>
-              CloseableReference leaked for{' '}
-              <Text code={true}>{event.className}</Text>
+              CloseableReference leaked for <Text code>{event.className}</Text>
              (identity hashcode: {event.identityHashCode}).
            </InlineFlexRow>
            <InlineFlexRow>
-              <Text bold={true}>Stacktrace:</Text>
+              <Text bold>Stacktrace:</Text>
            </InlineFlexRow>
            <InlineFlexRow>
-              <Text code={true}>{event.stacktrace || '<unavailable>'}</Text>
+              <Text code>{event.stacktrace || '<unavailable>'}</Text>
            </InlineFlexRow>
          </Fragment>
        ),
@@ -466,7 +465,7 @@ function Sidebar() {

  if (currentSelectedImage == null) {
    return (
-      <EmptySidebar grow={true}>
+      <EmptySidebar grow>
        <Text align="center">
          Select an image to see the events associated with it.
        </Text>
--- a/desktop/plugins/public/kaios-allocations/index.tsx
+++ b/desktop/plugins/public/kaios-allocations/index.tsx
@@ -390,7 +390,7 @@ export default class AllocationsPlugin extends FlipperDevicePlugin<
          heading="Page allocations"
          floating={false}
          collapsable={false}
-          grow={true}>
+          grow>
          <Toolbar position="top">
            <Select
              options={appTitlesForSelect}
@@ -429,11 +429,11 @@ export default class AllocationsPlugin extends FlipperDevicePlugin<
            {(this.state.totalAllocatedBytes / 1024 / 1024).toFixed(3)}
          </Label>
          <ManagedTable
-            multiline={true}
+            multiline
            columnSizes={ColumnSizes}
            columns={Columns}
            floating={false}
-            zebra={true}
+            zebra
            rows={this.buildMemRows()}
          />
        </Panel>
--- a/desktop/plugins/public/kaios-ram/index.tsx
+++ b/desktop/plugins/public/kaios-ram/index.tsx
@@ -244,7 +244,7 @@ export default class KaiOSGraphs extends FlipperDevicePlugin<State, any, any> {
        heading="Free memory"
        floating={false}
        collapsable={false}
-        grow={true}>
+        grow>
        <Toolbar position="top">
          {this.state.monitoring ? (
            <Button onClick={this.onStopMonitor} icon="pause">
@@ -256,7 +256,7 @@ export default class KaiOSGraphs extends FlipperDevicePlugin<State, any, any> {
            </Button>
          )}
        </Toolbar>
-        <FlexColumn grow={true}>
+        <FlexColumn grow>
          <ResponsiveContainer height={500}>
            <LineChart data={pointsToDraw}>
              <XAxis type="number" domain={[0, MAX_POINTS]} dataKey="idx" />
--- a/desktop/plugins/public/layout/InspectorSidebar.tsx
+++ b/desktop/plugins/public/layout/InspectorSidebar.tsx
@@ -69,8 +69,8 @@ class InspectorSidebarSection extends PureComponent<InspectorSidebarSectionProps
          data={this.props.data}
          setValue={this.props.onValueChanged ? this.setValue : undefined}
          extractValue={this.extractValue}
-          expandRoot={true}
-          collapsed={true}
+          expandRoot
+          collapsed
          tooltips={this.props.tooltips}
        />
      </Panel>
--- a/desktop/plugins/public/layout/index.tsx
+++ b/desktop/plugins/public/layout/index.tsx
@@ -448,7 +448,7 @@ export default class LayoutPlugin extends FlipperPlugin<
        <Inspector
          {...inspectorProps}
          onSelect={(selectedAXElement) => this.setState({selectedAXElement})}
-          showsSidebar={true}
+          showsSidebar
          ax
        />
      </Sidebar>
@@ -533,7 +533,7 @@ export default class LayoutPlugin extends FlipperPlugin<
          element.decoration === 'litho' ? (
            <Button
              icon={'share-external'}
-              compact={true}
+              compact
              style={{marginTop: 8, marginRight: 12}}
              onClick={() => {
                this.props.selectPlugin('YogaPerformance', element!.id);
--- a/desktop/plugins/public/leak_canary/index.tsx
+++ b/desktop/plugins/public/leak_canary/index.tsx
@@ -192,7 +192,7 @@ export default class LeakCanary<PersistedState> extends FlipperPlugin<
          <Panel heading={'Instance'} floating={false} grow={false}>
            <ManagedDataInspector
              data={instanceFields}
-              expandRoot={true}
+              expandRoot
              extractValue={this._extractValue}
            />
          </Panel>
@@ -201,7 +201,7 @@ export default class LeakCanary<PersistedState> extends FlipperPlugin<
          <Panel heading={'Static'} floating={false} grow={false}>
            <ManagedDataInspector
              data={staticFields}
-              expandRoot={true}
+              expandRoot
              extractValue={this._extractValue}
            />
          </Panel>
@@ -221,8 +221,8 @@ export default class LeakCanary<PersistedState> extends FlipperPlugin<

    return (
      <Window>
-        <FlexColumn grow={true}>
-          <FlexColumn grow={true} scrollable={true}>
+        <FlexColumn grow>
+          <FlexColumn grow scrollable>
            {this.state.leaks.map((leak: Leak, idx: number) => {
              const elements = showFullClassPaths
                ? leak.elements
--- a/desktop/plugins/public/navigation/components/FavoriteButton.tsx
+++ b/desktop/plugins/public/navigation/components/FavoriteButton.tsx
@@ -39,12 +39,7 @@ export default (props: Props) => {
          {...iconButtonProps}
        />
      ) : null}
-      <IconButton
-        outline={true}
-        icon="star"
-        onClick={onClick}
-        {...iconButtonProps}
-      />
+      <IconButton outline icon="star" onClick={onClick} {...iconButtonProps} />
    </FavoriteButtonContainer>
  );
 };
--- a/desktop/plugins/public/navigation/components/SearchBar.tsx
+++ b/desktop/plugins/public/navigation/components/SearchBar.tsx
@@ -143,7 +143,7 @@ class SearchBar extends Component<Props, State> {
              <IconButton
                icon="send"
                size={16}
-                outline={true}
+                outline
                onClick={() => this.navigateTo(searchInputValue)}
              />
              <FavoriteButton
--- a/desktop/plugins/public/network/RequestDetails.tsx
+++ b/desktop/plugins/public/network/RequestDetails.tsx
@@ -390,7 +390,7 @@ class VideoFormatter {
    if (contentType.startsWith('video/')) {
      return (
        <Layout.Container center>
-          <VideoFormatter.Video controls={true}>
+          <VideoFormatter.Video controls>
            <source src={request.url} type={contentType} />
          </VideoFormatter.Video>
        </Layout.Container>
--- a/desktop/plugins/public/network/index.tsx
+++ b/desktop/plugins/public/network/index.tsx
@@ -515,7 +515,7 @@ export function Component() {
  return (
    <NetworkRouteContext.Provider value={networkRouteManager}>
      <Layout.Container
-        grow={true}
+        grow
        key={
          columns.length /* make sure to reset the table if colums change */
        }>
--- a/desktop/plugins/public/seamammals/src/index.tsx
+++ b/desktop/plugins/public/seamammals/src/index.tsx
@@ -105,7 +105,7 @@ function renderSidebar(row: Row) {
  return (
    <Layout.Container gap pad>
      <Typography.Title level={4}>Extras</Typography.Title>
-      <ManagedDataInspector data={row} expandRoot={true} />
+      <ManagedDataInspector data={row} expandRoot />
    </Layout.Container>
  );
 }
--- a/desktop/plugins/public/shared_preferences/src/index.tsx
+++ b/desktop/plugins/public/shared_preferences/src/index.tsx
@@ -166,7 +166,7 @@ export function Component() {
  }

  return (
-    <RootColumn grow={true}>
+    <RootColumn grow>
      <Heading>
        <span style={{marginRight: '16px'}}>Preference File</span>
        <Select
@@ -180,7 +180,7 @@ export function Component() {
          onChange={instance.setSelectedPreferences}
        />
      </Heading>
-      <FlexRow grow={true} scrollable={true}>
+      <FlexRow grow scrollable>
        <InspectorColumn>
          <Heading>Inspector</Heading>
          <ManagedDataInspector