feat(redmine 1246959): fix type errors

Smile-SA · Nov 20, 2023 · c9c7c5e · c9c7c5e
1 parent 58b7e5e
commit c9c7c5e
Show file tree

Hide file tree

Showing 6 changed files with 52 additions and 20 deletions.
diff --git a/packages/react-front-kit/src/Components/Filters/Filters.tsx b/packages/react-front-kit/src/Components/Filters/Filters.tsx
@@ -1,7 +1,7 @@
 'use client';
 
-import type { ISidebarFilterMenuProps } from './SidebarFilterMenu/SidebarFilterMenu';
-import type { ElementType, ReactElement, ReactNode } from 'react';
+import type { IFiltersItem } from './SidebarFilterMenu/SidebarFilterMenu';
+import type { ReactElement, ReactNode } from 'react';
 
 import { Badge, Box, Button, Group } from '@mantine/core';
 import { TrashSimple, X } from '@phosphor-icons/react';
@@ -16,20 +16,17 @@ export interface ISidebarFilter {
   value: unknown;
 }
 
-export interface IFiltersProps<
-  T extends number | string,
-  C extends ElementType,
-> {
+export interface IFiltersProps {
   activeFilters?: ISidebarFilter[] | [];
   deleteButtonLabel?: string;
   filterLabelButton?: string;
   onDeleteButtonClick?: (filters: ISidebarFilter[]) => void;
   onFilterButtonClick?: (filters: ISidebarFilter[]) => void;
-  sideBarFiltersMenu?: ISidebarFilterMenuProps<T, C>;
+  sideBarFiltersMenu?: IFiltersItem<number | string>[] | undefined;
   title?: ReactNode;
 }
 
-export function Filters(props: IFiltersProps<T, C>): ReactElement {
+export function Filters(props: IFiltersProps): ReactElement {
   const {
     activeFilters = [],
     title = 'Active filters',

diff --git a/packages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.mock.tsx b/packages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.mock.tsx
@@ -5,7 +5,7 @@ import { Checkbox, Group } from '@mantine/core';
 export const menu: IFiltersItem<number>[] = [
   {
     content: (
-      <>
+      <div style={{ padding: '10px 0' }}>
         <Group>
           <Checkbox value="Dupont" /> Dupont
         </Group>
@@ -17,12 +17,40 @@ export const menu: IFiltersItem<number>[] = [
         <Group>
           <Checkbox value="André" /> Andrée
         </Group>
-      </>
+      </div>
     ),
     id: 1,
     label: 'Nom du client',
   },
   {
+    children: [
+      {
+        content: (
+          <div style={{ padding: '10px 0' }}>
+            <Group>
+              <Checkbox value="CDI" /> CDI
+            </Group>
+            <br />
+            <Group>
+              <Checkbox value="CDD" /> CDD
+            </Group>
+          </div>
+        ),
+        id: 10,
+        label: 'Contrat classique',
+      },
+      {
+        content: (
+          <Group style={{ padding: '10px 0' }}>
+            <span>
+              <Checkbox value="FREELANCE" /> Freelance
+            </span>
+          </Group>
+        ),
+        id: 11,
+        label: 'Contrat special',
+      },
+    ],
     id: 3,
     label: 'Type de contrat',
   },

diff --git a/...ages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.style.tsx b/...ages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.style.tsx
@@ -0,0 +1,7 @@
+import { createStyles } from '@mantine/styles';
+
+export const useStyles = createStyles((theme) => ({
+  buttonLabel: {
+    background: 'black',
+  },
+}));
diff --git a/packages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.tsx b/packages/react-front-kit/src/Components/Filters/SidebarFilterMenu/SidebarFilterMenu.tsx
@@ -13,18 +13,20 @@ import { useMemo, useState } from 'react';
 import { addPathAndDepth, flattenNestedObjects } from '../../../helpers';
 import { CollapseButtonControlled } from '../../CollapseButton/CollapseButtonControlled';
 
-export interface IFiltersItem<T extends number | string> extends IMenuItem<T> {
+export interface IFiltersItem<T extends number | string>
+  extends Omit<IMenuItem<T>, 'children'> {
+  children?: IFiltersItem<T>[];
   content?: ReactNode;
 }
-
 export interface ISidebarFilterMenuProps<
   T extends number | string,
   C extends ElementType,
 > extends Omit<ISidebarMenuProps<T, C>, 'menu'>,
     PaperProps {
-  menu?: IFiltersItem<T>;
+  menu?: IFiltersItem<T>[];
 }
 
+// eslint-disable-next-line react-refresh/only-export-components
 export function getRecursiveMenu<
   T extends number | string,
   C extends ElementType,
@@ -34,7 +36,10 @@ export function getRecursiveMenu<
   openedMenuIds: T[],
   selectedId?: T,
   menu?: IFiltersItem<T>[],
-  collapseButtonProps?: Omit<ICollapseButtonProps<T, C>, 'opened'>,
+  collapseButtonProps?:
+    | Omit<ICollapseButtonProps<T, C>, 'opened'>
+    | ((item: IFiltersItem<T>) => Omit<ICollapseButtonProps<T, C>, 'opened'>)
+    | undefined,
   level = 0,
 ): ReactElement[] | null {
   if (!menu || menu.length === 0) {
@@ -85,7 +90,6 @@ export function SidebarFilterMenu<
     onMenuOpen,
     openedMenuIds,
   } = props;
-
   const flatMenu = useMemo(
     () => flattenNestedObjects(addPathAndDepth(menu)),
     [menu],

diff --git a/packages/react-front-kit/src/Components/SidebarMenu/SidebarMenu.tsx b/packages/react-front-kit/src/Components/SidebarMenu/SidebarMenu.tsx
@@ -17,10 +17,7 @@ export interface IMenuItem<T extends number | string> {
   leftIcon?: ReactNode;
 }
 
-export type ICollapseButtonProps<
-  T extends number | string,
-  C extends ElementType,
-> =
+type ICollapseButtonProps<T extends number | string, C extends ElementType> =
   | ICollapseButtonControlledProps<T, C>
   | ((item: IMenuItem<T>) => ICollapseButtonControlledProps<T, C>);
 

diff --git a/packages/react-front-kit/src/index.tsx b/packages/react-front-kit/src/index.tsx
@@ -1,7 +1,6 @@
 /* eslint-disable react-refresh/only-export-components */
 export * from '@smile/react-front-kit-shared';
 // component exports
-export * from './Components/SidebarFilterMenu/SidebarFilterMenu';
 export * from './Components/Filters/Filters';
 export * from './Components/DocumentCard/DocumentCard';
 export * from './Components/BitConverter/BitConverter';