feat: add multiple admin dashboard layout components and update sidebar and navbar

eslint.config.mjs

@@ -6,6 +6,7 @@ import importPlugin from 'eslint-plugin-import'
 import tseslint from 'typescript-eslint'
 import tsEslintParser from '@typescript-eslint/parser'
 import eslintPluginUnicorn from 'eslint-plugin-unicorn'
+import reactPlugin from 'eslint-plugin-react'
 
 export default tseslint.config(
   { ignores: ['dist', 'node_modules', '.react-router'] },
@@ -24,6 +25,7 @@ export default tseslint.config(
     },
     plugins: {
       'react-hooks': reactHooks,
+      react: reactPlugin,
     },
     languageOptions: {
       parser: tsEslintParser,
@@ -42,6 +44,7 @@ export default tseslint.config(
     rules: {
       ...reactHooks.configs.recommended.rules,
       ...tseslint.configs.recommended.rules,
+      ...reactPlugin.configs.recommended.rules,
       '@typescript-eslint/no-unused-vars': [
         'error',
         {
@@ -120,6 +123,15 @@ export default tseslint.config(
           ],
         },
       ],
+      'react/react-in-jsx-scope': 'off',
+      'react/jsx-key': [
+        'error',
+        {
+          checkFragmentShorthand: true,
+          checkKeyMustBeforeSpread: true,
+          warnOnDuplicates: true,
+        },
+      ],
     },
   },
 )