add param open in navitem component

src/components/NavItem/NavItem.stories.tsx

@@ -1,33 +1,43 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { ChartNoAxesColumn } from 'lucide-react';
 
-import { NavItem } from './NavItem';
+import { NavItem, NavItemProps } from './NavItem';
 
-const meta: Meta<typeof NavItem> = {
+const meta: Meta<NavItemProps> = {
   title: 'Components/NavItem',
   component: NavItem,
   parameters: {
     controls: { expanded: true },
   },
-  argTypes: {},
+  argTypes: {
+    open: {
+      control: { type: 'boolean' },
+      description: 'Open state of the NavItem',
+      defaultValue: false,
+    },
+  },
 };
 
 export default meta;
 
-type Story = StoryObj<typeof NavItem>;
+type Story = StoryObj<NavItemProps>;
 
 export const _NavItem: Story = {
-  render: () => (
+  render: (args) => (
     <div className="w-72">
       <NavItem
-        label="Organisations"
         preIcon={<ChartNoAxesColumn className="w-6 h-6" strokeWidth={2} />}
-        onClick={() => console.log('clicked')}
+        {...args}
       >
         <NavItem label="Raccord" />
-        <NavItem label="Epitech" />
         <NavItem label="Studio 17" />
+        <NavItem label="Epitech" />
       </NavItem>
     </div>
   ),
+  args: {
+    label: 'Organisations',
+    onClick: () => console.log('clicked'),
+    open: false,
+  },
 };

src/components/NavItem/NavItem.tsx

@@ -16,20 +16,29 @@ const navItemVariants = cva('w-full', {
   },
 });
 
-interface NavItemProps
+export interface NavItemProps
   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
     VariantProps<typeof navItemVariants> {
   label: string;
   preIcon?: React.ReactNode;
+  open?: boolean;
 }
 
 const NavItem = forwardRef<HTMLDivElement, NavItemProps>((props, ref) => {
-  const { label, preIcon, variant, onClick, className, children, ...rest } =
-    props;
+  const {
+    label,
+    preIcon,
+    open = false,
+    variant,
+    onClick,
+    className,
+    children,
+    ...rest
+  } = props;
 
   const isPreIconNotExist = preIcon === undefined;
 
-  const [isOpen, setIsOpen] = useState<boolean>(false);
+  const [isOpen, setIsOpen] = useState<boolean>(open);
 
   function handleClick(e: React.MouseEvent<HTMLButtonElement>) {
     setIsOpen(!isOpen);