Enhance style and lint

apache · Jan 24, 2023 · eb81c9e · eb81c9e
1 parent 41914ea
commit eb81c9e
Show file tree

Hide file tree

Showing 5 changed files with 36 additions and 19 deletions.
diff --git a/superset-frontend/src/components/DropdownSelectableIcon/index.tsx b/superset-frontend/src/components/DropdownSelectableIcon/index.tsx
@@ -81,6 +81,9 @@ const StyledMenu = styled(Menu)`
 const StyleSubmenuItem = styled.div`
   display: flex;
   justify-content: space-between;
+  > span {
+    width: 100%;
+  }
 `;
 
 export default (props: DropDownSelectableProps) => {

diff --git a/...dashboard/components/nativeFilters/FilterBar/FilterBarSettings/FilterBarSettings.test.tsx b/...dashboard/components/nativeFilters/FilterBar/FilterBarSettings/FilterBarSettings.test.tsx
@@ -24,8 +24,8 @@ import userEvent from '@testing-library/user-event';
 import { render, screen, within } from 'spec/helpers/testing-library';
 import { DashboardInfo, FilterBarOrientation } from 'src/dashboard/types';
 import * as mockedMessageActions from 'src/components/MessageToasts/actions';
-import FilterBarSettings from '.';
 import { FeatureFlag } from '@superset-ui/core';
+import FilterBarSettings from '.';
 
 const initialState: { dashboardInfo: DashboardInfo } = {
   dashboardInfo: {
@@ -54,16 +54,18 @@ const initialState: { dashboardInfo: DashboardInfo } = {
 };
 
 const setup = (dashboardInfoOverride: Partial<DashboardInfo> = {}) =>
-waitFor(() => render(<FilterBarSettings />, {
-    useRedux: true,
-    initialState: {
-      ...initialState,
-      dashboardInfo: {
-        ...initialState.dashboardInfo,
-        ...dashboardInfoOverride,
+  waitFor(() =>
+    render(<FilterBarSettings />, {
+      useRedux: true,
+      initialState: {
+        ...initialState,
+        dashboardInfo: {
+          ...initialState.dashboardInfo,
+          ...dashboardInfoOverride,
+        },
       },
-    },
-  }));
+    }),
+  );
 
 test('Dropdown trigger renders with FF HORIZONTAL_FILTER_BAR on', async () => {
   // @ts-ignore

diff --git a/...set-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterBarSettings/index.tsx b/...set-frontend/src/dashboard/components/nativeFilters/FilterBar/FilterBarSettings/index.tsx
@@ -42,9 +42,20 @@ import { clearDataMaskState } from 'src/dataMask/actions';
 type SelectedKey = FilterBarOrientation | string | number;
 
 const StyledMenuLabel = styled.span`
-  .enable-cross-filters {
-    vertical-align: middle;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+`;
+
+const StyledCheckbox = styled(Checkbox)`
+  ${({ theme }) => `
+  &,
+  svg {
+    display: inline-block;
+    width: ${theme.gridUnit * 4}px;
+    height: ${theme.gridUnit * 4}px;
   }
+`}
 `;
 
 const FilterBarSettings = () => {
@@ -115,12 +126,14 @@ const FilterBarSettings = () => {
   const crossFiltersMenuItem = useMemo(
     () => (
       <StyledMenuLabel>
-        <Checkbox
+        <StyledCheckbox
           className="enable-cross-filters"
           checked={crossFiltersEnabled}
           onChange={checked => setCrossFiltersEnabled(checked || false)}
         />{' '}
-        {t('Enable cross-filtering')}
+        <span className="enable-cross-filters-text">
+          {t('Enable cross-filtering')}
+        </span>
       </StyledMenuLabel>
     ),
     [crossFiltersEnabled],

diff --git a/...et-frontend/src/dashboard/components/nativeFilters/FilterBar/HorizontalFilterBar.test.tsx b/...et-frontend/src/dashboard/components/nativeFilters/FilterBar/HorizontalFilterBar.test.tsx
@@ -39,8 +39,8 @@ const renderWrapper = (overrideProps?: Record<string, any>) =>
       initialState: {
         dashboardInfo: {
           dash_edit_perm: true,
-        }
-      }
+        },
+      },
     }),
   );
 

diff --git a/superset-frontend/src/dashboard/util/crossFilters.ts b/superset-frontend/src/dashboard/util/crossFilters.ts
@@ -22,6 +22,5 @@ import { FeatureFlag, isFeatureEnabled } from '@superset-ui/core';
 export const isCrossFiltersEnabled = (
   metadataCrossFiltersEnabled: boolean | undefined,
 ): boolean =>
-  (isFeatureEnabled(FeatureFlag.DASHBOARD_CROSS_FILTERS) &&
-    (metadataCrossFiltersEnabled === undefined ||
-      metadataCrossFiltersEnabled));
+  isFeatureEnabled(FeatureFlag.DASHBOARD_CROSS_FILTERS) &&
+  (metadataCrossFiltersEnabled === undefined || metadataCrossFiltersEnabled);
-Original file line number
+Diff line change
@@ Expand Up @@
           initialState: {
             dashboardInfo: {
               dash_edit_perm: true,
-            }
-          }
+            },
+          },
         }),
       );
@@ Expand Down @@