refactor: Consolidate icon imports across components and streamline import statements for improved readability

src/app/features/settings/plugins/PluginButtonSlot.tsx

@@ -2,6 +2,7 @@ import React, { useSyncExternalStore } from 'react';
 import { IconButton } from 'folds';
 import * as lucide from 'lucide-react';
 import { UILocation } from '@paarrot/plugin-manager';
+import { Icon, Icons, type IconName } from '../../../components/icons';
 import { pluginRegistry } from './PluginAPI';
 
 // ---------------------------------------------------------------------------
@@ -39,11 +40,6 @@ interface PluginButtonSlotProps {
   location: UILocation;
 }
 
-type LucideIconComponent = React.ComponentType<{
-  size?: number | string;
-  strokeWidth?: number | string;
-}>;
-
 function renderPluginButtonIcon(button: {
   icon?: string;
   lucideIcon?: string;
@@ -54,8 +50,14 @@ function renderPluginButtonIcon(button: {
       ? button.icon.slice('lucide:'.length)
       : undefined);
 
+  if (lucideName && lucideName in Icons) {
+    return <Icon src={Icons[lucideName as IconName]} size="300" />;
+  }
+
   if (lucideName) {
-    const IconComponent = (lucide as Record<string, LucideIconComponent | undefined>)[lucideName];
+    const IconComponent = (lucide as Record<string, React.ComponentType<{ size?: number; strokeWidth?: number }> | undefined>)[
+      lucideName
+    ];
     if (IconComponent) {
       return <IconComponent size={18} strokeWidth={2} aria-hidden />;
     }

src/app/features/settings/plugins/Plugins.tsx

@@ -1,26 +1,6 @@
 import React, { useState, useEffect, useCallback, useMemo } from 'react';
-import {
-  Avatar,
-  Badge,
-  Box,
-  Button,
-  color,
-  config,
-  Header,
-  Icon,
-  IconButton,
-  Icons,
-  Input,
-  Menu,
-  MenuItem,
-  PopOut,
-  RectCords,
-  Scroll,
-  Spinner,
-  Switch,
-  Text,
-  toRem,
-} from 'folds';
+import { Avatar, Badge, Box, Button, color, config, Header, IconButton, Input, Menu, MenuItem, PopOut, RectCords, Scroll, Spinner, Switch, Text, toRem } from 'folds';
+import { Icon, Icons } from '../../../components/icons';
 import { HexColorPicker } from 'react-colorful';
 import FocusTrap from 'focus-trap-react';
 import { Page, PageContent, PageHeader } from '../../../components/page';