refactor: improve code quality and consistency (#197)

* refactor: convert components to named exports

- Convert arrow function components to function declarations
- Replace React.forwardRef with modern TypeScript patterns
- Remove unnecessary displayName assignments
- Ensure consistent component declaration style across codebase

* refactor: convert all components to named exports for consistency

- Convert default exports to named exports across features directory
- Update all import statements to use named imports
- Move sidebarNavItems outside Settings component for better organization
- Improve component parameter formatting for readability
- Ensure consistent export patterns throughout codebase

* refactor: enforce and update import type for typescript types

Author: satnaing

eslint.config.js

@@ -42,6 +42,15 @@ export default tseslint.config(
           ignoreRestSiblings: true,
         },
       ],
+      // Enforce type-only imports for TypeScript types
+      '@typescript-eslint/consistent-type-imports': [
+        'error',
+        {
+          prefer: 'type-imports',
+          fixStyle: 'inline-type-imports',
+          disallowTypeAnnotations: false,
+        },
+      ],
     },
   }
 )

src/assets/brand-icons/icon-discord.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconDiscord({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-docker.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconDocker({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-facebook.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconFacebook({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-figma.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconFigma({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-github.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconGithub({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-gitlab.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconGitlab({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-gmail.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconGmail({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-medium.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconMedium({ className, ...props }: SVGProps<SVGSVGElement>) {

src/assets/brand-icons/icon-notion.tsx

@@ -1,4 +1,4 @@
-import { SVGProps } from 'react'
+import { type SVGProps } from 'react'
 import { cn } from '@/lib/utils'
 
 export function IconNotion({ className, ...props }: SVGProps<SVGSVGElement>) {