base structure

src/shared/components/SubMenuItem.tsx

@@ -0,0 +1,33 @@
+import { FC } from 'react'
+import { Link } from 'react-router-dom'
+import { clx } from '../../helpers/utils'
+
+type Props = {
+    title: string,
+    isActive: boolean,
+    link: string,
+    isLogout?: boolean,
+}
+
+const SubMenuItem: FC<Props> = (props: Props) => {
+    return (
+        <Link to={props.link} className={clx(
+            'flex text-xs gap-6 mt-1',
+        )}>
+            <div className={clx(
+                'w-1 bg-black h-6',
+                !props.isActive && 'invisible',
+            )}></div>
+            <div className={clx(
+                'flex gap-3 items-center mt-1',
+            )}>
+                <div className={props.isActive ? 'text-black' : 'text-description'}>
+                    {props.title}
+                </div>
+            </div>
+
+        </Link>
+    )
+}
+
+export default SubMenuItem