Organize and normalize imports across project

Reorder and normalize import statements, group icon imports, and add
missing utility imports (cn). Fix export/newline formatting and minor
type import tweaks. Add ESLint scripts to package.json and update the
lockfile.

App.tsx

@@ -1,22 +1,22 @@
-import React, { useEffect, useMemo, useState, useCallback } from 'react';
-import SettingsDialog from './components/SettingsDialog';
-import { SftpView } from './components/SftpView';
-import { TopTabs } from './components/TopTabs';
-import { QuickSwitcher } from './components/QuickSwitcher';
-import { VaultView } from './components/VaultView';
-import { TerminalLayer } from './components/TerminalLayer';
-import ProtocolSelectDialog from './components/ProtocolSelectDialog';
-import { Host, HostProtocol } from './types';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter } from './components/ui/dialog';
-import { Button } from './components/ui/button';
-import { Input } from './components/ui/input';
-import { Label } from './components/ui/label';
+import React,{ useCallback,useEffect,useMemo,useState } from 'react';
+import { useIsVaultActive } from './application/state/activeTabStore';
+import { useSessionState } from './application/state/useSessionState';
 import { useSettingsState } from './application/state/useSettingsState';
 import { useVaultState } from './application/state/useVaultState';
-import { useSessionState } from './application/state/useSessionState';
-import { useIsVaultActive } from './application/state/activeTabStore';
+import ProtocolSelectDialog from './components/ProtocolSelectDialog';
+import { QuickSwitcher } from './components/QuickSwitcher';
+import SettingsDialog from './components/SettingsDialog';
+import { SftpView } from './components/SftpView';
+import { TerminalLayer } from './components/TerminalLayer';
+import { TopTabs } from './components/TopTabs';
+import { Button } from './components/ui/button';
+import { Dialog,DialogContent,DialogFooter,DialogHeader,DialogTitle } from './components/ui/dialog';
+import { Input } from './components/ui/input';
+import { Label } from './components/ui/label';
 import { ToastProvider } from './components/ui/toast';
+import { VaultView } from './components/VaultView';
 import { cn } from './lib/utils';
+import { Host,HostProtocol } from './types';
 
 // Visibility container for VaultView - isolates isActive subscription
 const VaultViewContainer: React.FC<{ children: React.ReactNode }> = ({ children }) => {

application/state/activeTabStore.ts

@@ -1,4 +1,4 @@
-import { useSyncExternalStore, useCallback, useRef } from 'react';
+import { useCallback,useSyncExternalStore } from 'react';
 
 // Simple store for active tab that allows fine-grained subscriptions
 type Listener = () => void;

application/state/usePortForwardingState.ts

@@ -1,8 +1,8 @@
-import { useCallback, useEffect, useState } from 'react';
-import { PortForwardingRule, PortForwardingType } from '../../domain/models';
+import { useCallback,useEffect,useState } from 'react';
+import { PortForwardingRule } from '../../domain/models';
 import { STORAGE_KEY_PORT_FORWARDING } from '../../infrastructure/config/storageKeys';
 import { localStorageAdapter } from '../../infrastructure/persistence/localStorageAdapter';
-import { getActiveRuleIds, getActiveConnection } from '../../infrastructure/services/portForwardingService';
+import { getActiveConnection,getActiveRuleIds } from '../../infrastructure/services/portForwardingService';
 
 export type ViewMode = 'grid' | 'list';
 export type SortMode = 'az' | 'za' | 'newest' | 'oldest';

application/state/useSessionState.ts

@@ -1,13 +1,13 @@
-import { MouseEvent, useMemo, useState, useCallback } from 'react';
-import { Host, Snippet, TerminalSession, Workspace, WorkspaceNode, WorkspaceViewMode } from '../../domain/models';
+import { MouseEvent,useCallback,useMemo,useState } from 'react';
+import { Host,Snippet,TerminalSession,Workspace,WorkspaceViewMode } from '../../domain/models';
 import {
-  createWorkspaceFromSessions as createWorkspaceEntity,
-  insertPaneIntoWorkspace,
-  pruneWorkspaceNode,
-  SplitHint,
-  updateWorkspaceSplitSizes,
-  createWorkspaceFromSessionIds,
-  collectSessionIds,
+collectSessionIds,
+createWorkspaceFromSessions as createWorkspaceEntity,
+createWorkspaceFromSessionIds,
+insertPaneIntoWorkspace,
+pruneWorkspaceNode,
+SplitHint,
+updateWorkspaceSplitSizes,
 } from '../../domain/workspace';
 import { activeTabStore } from './activeTabStore';
 

application/state/useSettingsState.ts

@@ -1,10 +1,10 @@
-import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useCallback,useEffect,useMemo,useState } from 'react';
 import { SyncConfig } from '../../domain/models';
 import {
-  STORAGE_KEY_COLOR,
-  STORAGE_KEY_SYNC,
-  STORAGE_KEY_TERM_THEME,
-  STORAGE_KEY_THEME,
+STORAGE_KEY_COLOR,
+STORAGE_KEY_SYNC,
+STORAGE_KEY_TERM_THEME,
+STORAGE_KEY_THEME,
 } from '../../infrastructure/config/storageKeys';
 import { TERMINAL_THEMES } from '../../infrastructure/config/terminalThemes';
 import { localStorageAdapter } from '../../infrastructure/persistence/localStorageAdapter';

application/state/useSftpState.ts

@@ -1,13 +1,13 @@
-import { useState, useCallback, useRef, useEffect } from 'react';
+import { useCallback,useEffect,useRef,useState } from 'react';
 import {
-  SftpConnection,
-  SftpFileEntry,
-  TransferTask,
-  TransferStatus,
-  TransferDirection,
-  FileConflict,
-  Host,
-  SSHKey,
+FileConflict,
+Host,
+SftpConnection,
+SftpFileEntry,
+SSHKey,
+TransferDirection,
+TransferStatus,
+TransferTask,
 } from '../../domain/models';
 
 // Helper functions

application/state/useVaultState.ts

@@ -1,15 +1,15 @@
-import { useCallback, useEffect, useState } from 'react';
-import { Host, SSHKey, Snippet, KeySource, KeyCategory, KnownHost, ShellHistoryEntry } from '../../domain/models';
-import { normalizeDistroId, sanitizeHost } from '../../domain/host';
-import { INITIAL_HOSTS, INITIAL_SNIPPETS } from '../../infrastructure/config/defaultData';
+import { useCallback,useEffect,useState } from 'react';
+import { normalizeDistroId,sanitizeHost } from '../../domain/host';
+import { Host,KeyCategory,KeySource,KnownHost,ShellHistoryEntry,Snippet,SSHKey } from '../../domain/models';
+import { INITIAL_HOSTS,INITIAL_SNIPPETS } from '../../infrastructure/config/defaultData';
 import {
-  STORAGE_KEY_GROUPS,
-  STORAGE_KEY_HOSTS,
-  STORAGE_KEY_KEYS,
-  STORAGE_KEY_SNIPPET_PACKAGES,
-  STORAGE_KEY_SNIPPETS,
-  STORAGE_KEY_KNOWN_HOSTS,
-  STORAGE_KEY_SHELL_HISTORY,
+STORAGE_KEY_GROUPS,
+STORAGE_KEY_HOSTS,
+STORAGE_KEY_KEYS,
+STORAGE_KEY_KNOWN_HOSTS,
+STORAGE_KEY_SHELL_HISTORY,
+STORAGE_KEY_SNIPPET_PACKAGES,
+STORAGE_KEY_SNIPPETS,
 } from '../../infrastructure/config/storageKeys';
 import { localStorageAdapter } from '../../infrastructure/persistence/localStorageAdapter';
 

components/AuthDialog.tsx

@@ -1,13 +1,13 @@
-import React, { useState } from 'react';
-import { Lock, Key, User, Eye, EyeOff, ChevronDown } from 'lucide-react';
-import { Host, SSHKey } from '../types';
+import { ChevronDown,Eye,EyeOff,Key,Lock,User } from 'lucide-react';
+import React,{ useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,SSHKey } from '../types';
 import { DistroAvatar } from './DistroAvatar';
 import { Button } from './ui/button';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
-import { Popover, PopoverContent, PopoverTrigger } from './ui/popover';
+import { Popover,PopoverContent,PopoverTrigger } from './ui/popover';
 import { ScrollArea } from './ui/scroll-area';
-import { cn } from '../lib/utils';
 
 interface AuthDialogProps {
     host: Host;

components/DistroAvatar.tsx

@@ -1,8 +1,8 @@
-import React, { memo } from 'react';
-import { Host } from '../types';
+import { Server } from 'lucide-react';
+import React,{ memo } from 'react';
 import { normalizeDistroId } from '../domain/host';
 import { cn } from '../lib/utils';
-import { Server } from 'lucide-react';
+import { Host } from '../types';
 
 export const DISTRO_LOGOS: Record<string, string> = {
   ubuntu: "/distro/ubuntu.svg",

components/GroupTreeItem.tsx

@@ -1,9 +1,9 @@
-import React, { useMemo } from 'react';
-import { ChevronRight, Folder, FolderOpen, FolderPlus, Plus } from 'lucide-react';
-import { GroupNode } from '../types';
+import { ChevronRight,Folder,FolderOpen,FolderPlus,Plus } from 'lucide-react';
+import React,{ useMemo } from 'react';
 import { cn } from '../lib/utils';
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './ui/context-menu';
+import { GroupNode } from '../types';
+import { Collapsible,CollapsibleContent,CollapsibleTrigger } from './ui/collapsible';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuTrigger } from './ui/context-menu';
 
 interface GroupTreeItemProps {
   node: GroupNode;

components/HostDetailsPanel.tsx

@@ -1,21 +1,20 @@
-import React, { useEffect, useMemo, useState } from "react";
-import { Host, SSHKey, ProxyConfig, ProxyType, HostChainConfig, EnvVar } from "../types";
-import { Input } from "./ui/input";
+import { Check,Fingerprint,FolderPlus,Globe,Key,Link2,Plus,Shield,Tag,TerminalSquare,Variable,X } from "lucide-react";
+import React,{ useEffect,useMemo,useState } from "react";
+import { TERMINAL_THEMES } from "../infrastructure/config/terminalThemes";
+import { cn } from "../lib/utils";
+import { EnvVar,Host,ProxyConfig,SSHKey } from "../types";
+import { DistroAvatar } from "./DistroAvatar";
+import ThemeSelectPanel from "./ThemeSelectPanel";
+import { AsidePanel,AsidePanelContent,AsidePanelFooter } from "./ui/aside-panel";
+import { Badge } from "./ui/badge";
 import { Button } from "./ui/button";
 import { Card } from "./ui/card";
-import { Badge } from "./ui/badge";
-import { cn } from "../lib/utils";
-import { Network, KeyRound, Lock, Share2, Server, Shield, Zap, TerminalSquare, Tag, ChevronLeft, Navigation, PhoneCall, Plus, FolderPlus, ArrowLeft, Link2, Trash2, GripVertical, Globe, HelpCircle, X, ArrowDown, ArrowRight, Check, Variable, Key, Fingerprint, Palette } from "lucide-react";
-import { ScrollArea } from "./ui/scroll-area";
-import { DistroAvatar } from "./DistroAvatar";
-import { AsidePanel, AsidePanelContent, AsidePanelFooter } from "./ui/aside-panel";
-import { Combobox, MultiCombobox, ComboboxOption } from "./ui/combobox";
-import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover";
-import ThemeSelectPanel from "./ThemeSelectPanel";
-import { TERMINAL_THEMES } from "../infrastructure/config/terminalThemes";
+import { Combobox,ComboboxOption,MultiCombobox } from "./ui/combobox";
+import { Input } from "./ui/input";
+import { Popover,PopoverContent,PopoverTrigger } from "./ui/popover";
 
 // Import host-details sub-panels
-import { CreateGroupPanel, ProxyPanel, ChainPanel, EnvVarsPanel } from "./host-details";
+import { ChainPanel,CreateGroupPanel,EnvVarsPanel,ProxyPanel } from "./host-details";
 
 type Protocol = "ssh" | "telnet";
 type AuthMethod = "password" | "key" | "certificate" | "fido2";

components/HostForm.tsx

@@ -1,12 +1,12 @@
-import React, { useState, useEffect } from 'react';
-import { Host, SSHKey } from '../types';
-import { Server, Save, Key, Lock, X, Plus } from 'lucide-react';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DialogDescription } from './ui/dialog';
+import { Key,Lock,Plus,Save,Server,X } from 'lucide-react';
+import React,{ useEffect,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,SSHKey } from '../types';
 import { Button } from './ui/button';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from './ui/dialog';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
-import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from './ui/select';
-import { cn } from '../lib/utils';
+import { Select,SelectContent,SelectItem,SelectTrigger,SelectValue } from './ui/select';
 
 interface HostFormProps {
   initialData?: Host | null;

components/KeyManager.tsx

@@ -1,13 +1,13 @@
-import React, { useMemo, useState } from 'react';
+import { Key,LayoutGrid,List as ListIcon,Pencil,Plus,Search,Shield,Trash2 } from 'lucide-react';
+import React,{ useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
 import { SSHKey } from '../types';
-import { Key, Plus, Trash2, Shield, Search, LayoutGrid, List as ListIcon, Pencil } from 'lucide-react';
 import { Button } from './ui/button';
+import { Card,CardDescription,CardTitle } from './ui/card';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from './ui/dialog';
 import { Input } from './ui/input';
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from './ui/card';
 import { Label } from './ui/label';
 import { Textarea } from './ui/textarea';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DialogDescription } from './ui/dialog';
-import { cn } from '../lib/utils';
 
 interface KeyManagerProps {
   keys: SSHKey[];

components/KeychainManager.tsx

@@ -1,52 +1,47 @@
-import React, { useMemo, useState, useCallback } from 'react';
-import { SSHKey, KeyType, KeySource, KeyCategory, Identity, IdentityAuthMethod, Host } from '../types';
 import {
-    Key,
-    Plus,
-    Trash2,
-    Shield,
-    Search,
-    LayoutGrid,
-    List as ListIcon,
-    ChevronDown,
-    Fingerprint,
-    BadgeCheck,
-    MoreHorizontal,
-    ChevronRight,
-    Upload,
-    UserPlus,
-    Info,
+BadgeCheck,
+ChevronDown,
+ChevronRight,
+Fingerprint,
+Info,
+Key,
+LayoutGrid,
+List as ListIcon,
+MoreHorizontal,
+Plus,
+Search,
+Shield,
+Upload,
+UserPlus
 } from 'lucide-react';
+import React,{ useCallback,useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,Identity,KeyType,SSHKey } from '../types';
+import SelectHostPanel from './SelectHostPanel';
+import { AsidePanel,AsidePanelContent } from './ui/aside-panel';
 import { Button } from './ui/button';
+import { Collapsible,CollapsibleContent,CollapsibleTrigger } from './ui/collapsible';
+import { Dropdown,DropdownContent,DropdownTrigger } from './ui/dropdown';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
 import { Textarea } from './ui/textarea';
-import { cn } from '../lib/utils';
-import { Dropdown, DropdownTrigger, DropdownContent } from './ui/dropdown';
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible';
-import SelectHostPanel from './SelectHostPanel';
 import { toast } from './ui/toast';
-import { AsidePanel, AsidePanelContent } from './ui/aside-panel';
 
 // Import utilities and components from keychain module
 import {
-    generateMockKeyPair,
-    createFido2Credential,
-    createBiometricCredential,
-    isMacOS,
-    copyToClipboard,
-    type PanelMode,
-    type FilterTab,
-    KeyCard,
-    IdentityCard,
-    GenerateStandardPanel,
-    GenerateBiometricPanel,
-    GenerateFido2Panel,
-    ImportKeyPanel,
-    ViewKeyPanel,
-    EditKeyPanel,
-    IdentityPanel,
-    ExportKeyPanel,
+createBiometricCredential,
+createFido2Credential,
+type FilterTab,
+GenerateBiometricPanel,
+GenerateFido2Panel,
+GenerateStandardPanel,
+IdentityCard,
+IdentityPanel,
+ImportKeyPanel,
+isMacOS,
+KeyCard,
+type PanelMode,
+ViewKeyPanel
 } from './keychain';
 
 interface KeychainManagerProps {

components/KnownHostConfirmDialog.tsx

@@ -1,9 +1,8 @@
+import { ShieldCheck } from 'lucide-react';
 import React from 'react';
-import { AlertTriangle, ShieldCheck, ShieldX, Info } from 'lucide-react';
-import { Host, KnownHost } from '../types';
+import { Host } from '../types';
 import { DistroAvatar } from './DistroAvatar';
 import { Button } from './ui/button';
-import { cn } from '../lib/utils';
 
 export interface HostKeyInfo {
     hostname: string;

components/KnownHostsManager.tsx

@@ -1,26 +1,26 @@
-import React, { useState, useMemo, useEffect, useCallback, memo, useDeferredValue } from 'react';
 import {
-    Search,
-    Import,
-    Trash2,
-    Server,
-    Key,
-    Clock,
-    ArrowRight,
-    RefreshCw,
-    Shield,
-    FolderOpen,
-    LayoutGrid,
-    List as ListIcon,
-    ChevronDown,
+ArrowRight,
+ChevronDown,
+Clock,
+FolderOpen,
+Import,
+Key,
+LayoutGrid,
+List as ListIcon,
+RefreshCw,
+Search,
+Server,
+Shield,
+Trash2,
 } from 'lucide-react';
-import { KnownHost, Host } from '../types';
+import React,{ memo,useCallback,useDeferredValue,useEffect,useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,KnownHost } from '../types';
 import { Button } from './ui/button';
+import { Dropdown,DropdownContent,DropdownTrigger } from './ui/dropdown';
 import { Input } from './ui/input';
 import { ScrollArea } from './ui/scroll-area';
-import { cn } from '../lib/utils';
-import { Dropdown, DropdownContent, DropdownTrigger } from './ui/dropdown';
-import { SortDropdown, SortMode } from './ui/sort-dropdown';
+import { SortDropdown,SortMode } from './ui/sort-dropdown';
 
 interface KnownHostsManagerProps {
     knownHosts: KnownHost[];

components/PortForwardingNew.tsx

@@ -1,48 +1,38 @@
-import React, { useCallback, useMemo, useState } from 'react';
 import {
-    ChevronDown,
-    Copy,
-    LayoutGrid,
-    List as ListIcon,
-    Loader2,
-    Search,
-    Trash2,
-    Zap,
-    Globe,
-    Server,
-    Shuffle,
-    Check,
+Check,
+ChevronDown,
+Globe,
+LayoutGrid,
+List as ListIcon,
+Search,
+Server,
+Shuffle,
+Zap
 } from 'lucide-react';
-import { PortForwardingRule, PortForwardingType, Host, SSHKey } from '../domain/models';
-import { Button } from './ui/button';
-import { AsidePanel, AsidePanelContent, AsidePanelFooter, AsideActionMenu, AsideActionMenuItem } from './ui/aside-panel';
-import { Input } from './ui/input';
-import { Dropdown, DropdownTrigger, DropdownContent } from './ui/dropdown';
-import { SortDropdown } from './ui/sort-dropdown';
-import { cn } from '../lib/utils';
-import { TrafficDiagram } from './TrafficDiagram';
-import SelectHostPanel from './SelectHostPanel';
+import React,{ useCallback,useState } from 'react';
 import {
-    usePortForwardingState,
-    ViewMode,
-    SortMode
+usePortForwardingState
 } from '../application/state/usePortForwardingState';
+import { Host,PortForwardingRule,PortForwardingType,SSHKey } from '../domain/models';
 import {
-    startPortForward,
-    stopPortForward,
-    isBackendAvailable,
+startPortForward,
+stopPortForward
 } from '../infrastructure/services/portForwardingService';
+import { cn } from '../lib/utils';
+import SelectHostPanel from './SelectHostPanel';
+import { AsidePanel,AsidePanelContent,AsidePanelFooter } from './ui/aside-panel';
+import { Button } from './ui/button';
+import { Dropdown,DropdownContent,DropdownTrigger } from './ui/dropdown';
+import { Input } from './ui/input';
+import { SortDropdown } from './ui/sort-dropdown';
 import { toast } from './ui/toast';
 
 // Import components and utilities from port-forwarding module
 import {
-    TYPE_LABELS,
-    TYPE_DESCRIPTIONS,
-    TYPE_ICONS,
-    RuleCard,
-    WizardContent,
-    EditPanel,
-    NewFormPanel,
+EditPanel,
+NewFormPanel,
+RuleCard,
+WizardContent
 } from './port-forwarding';
 
 type WizardStep = 'type' | 'local-config' | 'remote-host-selection' | 'remote-config' | 'destination' | 'host-selection' | 'label';

components/ProtocolSelectDialog.tsx

@@ -1,15 +1,14 @@
-import React, { useState, useMemo } from 'react';
 import {
-    Terminal as TerminalIcon,
-    Globe,
-    Wifi,
-    X,
+Globe,
+Terminal as TerminalIcon,
+Wifi
 } from 'lucide-react';
-import { Host, HostProtocol } from '../types';
+import React,{ useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,HostProtocol } from '../types';
 import { DistroAvatar } from './DistroAvatar';
 import { Button } from './ui/button';
 import { Input } from './ui/input';
-import { cn } from '../lib/utils';
 
 interface ProtocolOption {
     protocol: HostProtocol;

components/QuickConnectWizard.tsx

@@ -1,28 +1,22 @@
-import React, { useState, useMemo, useCallback } from 'react';
 import {
-    Lock,
-    Key,
-    User,
-    Eye,
-    EyeOff,
-    ChevronDown,
-    Globe,
-    Terminal as TerminalIcon,
-    Plus,
-    ArrowLeft,
+ArrowLeft,
+ChevronDown,
+Eye,
+EyeOff,
+Globe,
+Key,
+Lock,
+Plus,
+Terminal as TerminalIcon,
+User,
 } from 'lucide-react';
-import { Host, SSHKey, KnownHost, ProxyConfig, HostChainConfig, EnvVar } from '../types';
-import { DistroAvatar } from './DistroAvatar';
+import React,{ useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,KnownHost,SSHKey } from '../types';
 import { Button } from './ui/button';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
 import { ScrollArea } from './ui/scroll-area';
-import { cn } from '../lib/utils';
-import {
-    AsidePanel,
-    AsidePanelContent,
-    AsidePanelFooter,
-} from './ui/aside-panel';
 
 // Protocol types supported for quick connect
 type Protocol = 'ssh' | 'mosh' | 'telnet';

components/QuickSwitcher.tsx

@@ -1,9 +1,9 @@
-import React, { useState, useRef, useEffect, memo } from 'react';
-import { Monitor, TerminalSquare, Shield, Folder, LayoutGrid, Terminal, Search } from 'lucide-react';
-import { Host, TerminalSession, Workspace } from '../types';
+import { Folder,LayoutGrid,Search,Shield,Terminal,TerminalSquare } from 'lucide-react';
+import React,{ memo,useEffect,useRef,useState } from 'react';
+import { Host,TerminalSession,Workspace } from '../types';
+import { DistroAvatar } from './DistroAvatar';
 import { Button } from './ui/button';
 import { Input } from './ui/input';
-import { DistroAvatar } from './DistroAvatar';
 import { ScrollArea } from './ui/scroll-area';
 
 interface QuickSwitcherProps {

components/SFTPModal.tsx

@@ -1,9 +1,38 @@
-import React, { useState, useEffect, useRef, useCallback, useMemo } from 'react';
-import { RemoteFile, Host } from '../types';
 import {
-    Folder, FileText, Download, Upload, ArrowUp, RefreshCw, HardDrive, Trash2, Loader2, Plus, X, ChevronRight, Home,
-    FileCode, FileImage, FileVideo, FileAudio, FileArchive, FileSpreadsheet, FileType, File, Terminal, Settings, Database, Globe, Lock, Key
+ArrowUp,
+ChevronRight,
+Database,
+Download,
+File,
+FileArchive,
+FileAudio,
+FileCode,FileImage,
+FileSpreadsheet,
+FileText,
+FileType,
+FileVideo,
+Folder,
+Globe,
+Home,
+Key,
+Loader2,
+Lock,
+Plus,
+RefreshCw,
+Settings,
+Terminal,
+Trash2,
+Upload,
+X
 } from 'lucide-react';
+import React,{ useCallback,useEffect,useMemo,useRef,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,RemoteFile } from '../types';
+import { DistroAvatar } from './DistroAvatar';
+import { Button } from './ui/button';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuTrigger } from './ui/context-menu';
+import { Dialog,DialogContent,DialogHeader,DialogTitle } from './ui/dialog';
+import { Input } from './ui/input';
 
 // Comprehensive file icon helper
 const getFileIcon = (fileName: string, isDirectory: boolean) => {
@@ -97,8 +126,6 @@ const getFileIcon = (fileName: string, isDirectory: boolean) => {
     // Default
     return <File size={18} className={iconClass} />;
 };
-import { Button } from './ui/button';
-import { cn } from '../lib/utils';
 
 // Format bytes with appropriate unit (B, KB, MB, GB)
 const formatBytes = (bytes: number | string): string => {
@@ -118,10 +145,6 @@ const formatDate = (dateStr: string | number | undefined): string => {
     const pad = (n: number) => n.toString().padStart(2, '0');
     return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
 };
-import { Input } from './ui/input';
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from './ui/dialog';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './ui/context-menu';
-import { DistroAvatar } from './DistroAvatar';
 
 interface SFTPModalProps {
     host: Host;

components/SelectHostPanel.tsx

@@ -1,23 +1,22 @@
-import React, { useMemo, useState } from 'react';
-import { Host, SSHKey } from '../types';
 import {
-    ArrowLeft,
-    X,
-    Plus,
-    Search,
-    LayoutGrid,
-    Check,
-    ChevronRight,
-    Home,
+ArrowLeft,
+Check,
+ChevronRight,
+LayoutGrid,
+Plus,
+Search,
+X
 } from 'lucide-react';
+import React,{ useMemo,useState } from 'react';
+import { cn } from '../lib/utils';
+import { Host,SSHKey } from '../types';
+import { DistroAvatar } from './DistroAvatar';
+import HostDetailsPanel from './HostDetailsPanel';
 import { Button } from './ui/button';
 import { Input } from './ui/input';
 import { ScrollArea } from './ui/scroll-area';
-import { cn } from '../lib/utils';
-import { DistroAvatar } from './DistroAvatar';
-import { SortDropdown, SortMode } from './ui/sort-dropdown';
+import { SortDropdown,SortMode } from './ui/sort-dropdown';
 import { TagFilterDropdown } from './ui/tag-filter-dropdown';
-import HostDetailsPanel from './HostDetailsPanel';
 
 interface SelectHostPanelProps {
     hosts: Host[];

components/SettingsDialog.tsx

@@ -1,16 +1,16 @@
-import React, { useState } from 'react';
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogDescription } from './ui/dialog';
-import { Button } from './ui/button';
-import { Label } from './ui/label';
-import { Input } from './ui/input';
-import { Textarea } from './ui/textarea';
-import { Tabs, TabsContent, TabsList, TabsTrigger } from './ui/tabs';
-import { ScrollArea } from './ui/scroll-area';
-import { Sun, Moon, Cloud, Download, Upload, Palette, Github, Loader2, Check, TerminalSquare } from 'lucide-react';
+import { Check,Cloud,Download,Github,Loader2,Moon,Palette,Sun,TerminalSquare,Upload } from 'lucide-react';
+import React,{ useState } from 'react';
+import { TERMINAL_THEMES } from '../infrastructure/config/terminalThemes';
+import { loadFromGist,syncToGist } from '../infrastructure/services/syncService';
 import { cn } from '../lib/utils';
 import { SyncConfig } from '../types';
-import { syncToGist, loadFromGist } from '../infrastructure/services/syncService';
-import { TERMINAL_THEMES } from '../infrastructure/config/terminalThemes';
+import { Button } from './ui/button';
+import { Dialog,DialogContent,DialogDescription,DialogHeader,DialogTitle } from './ui/dialog';
+import { Input } from './ui/input';
+import { Label } from './ui/label';
+import { ScrollArea } from './ui/scroll-area';
+import { Tabs,TabsContent,TabsList,TabsTrigger } from './ui/tabs';
+import { Textarea } from './ui/textarea';
 
 interface SettingsDialogProps {
   isOpen: boolean;

components/SftpView.tsx

@@ -14,53 +14,48 @@
  * - components/sftp/SftpHostPicker.tsx - Host selection dialog
  */
 
-import React, { useMemo, useState, useCallback, useRef, memo } from 'react';
-import { Badge } from './ui/badge';
+import React,{ memo,useCallback,useMemo,useRef,useState } from 'react';
+import { useIsSftpActive } from '../application/state/activeTabStore';
+import { SftpPane,useSftpState } from '../application/state/useSftpState';
+import { cn } from '../lib/utils';
+import { Host,SftpFileEntry,SSHKey } from '../types';
 import { Button } from './ui/button';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogFooter } from './ui/dialog';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuSeparator,ContextMenuTrigger } from './ui/context-menu';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from './ui/dialog';
 import { Input } from './ui/input';
 import { Label } from './ui/label';
-import { cn } from '../lib/utils';
-import { Host, SSHKey, SftpFileEntry } from '../types';
-import { DistroAvatar } from './DistroAvatar';
-import { useSftpState, SftpPane } from '../application/state/useSftpState';
-import { useIsSftpActive } from '../application/state/activeTabStore';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuSeparator, ContextMenuTrigger } from './ui/context-menu';
 
 // Import extracted components
 import {
-    formatBytes,
-    formatDate,
-    getFileIcon,
-    SortField,
-    SortOrder,
-    ColumnWidths,
-    SftpBreadcrumb,
-    SftpFileRow,
-    SftpTransferItem,
-    SftpConflictDialog,
-    SftpPermissionsDialog,
-    SftpHostPicker,
+ColumnWidths,
+SftpBreadcrumb,
+SftpConflictDialog,
+SftpFileRow,
+SftpHostPicker,
+SftpPermissionsDialog,
+SftpTransferItem,
+SortField,
+SortOrder
 } from './sftp';
 
 import {
-    Folder,
-    HardDrive,
-    Monitor,
-    Plus,
-    X,
-    RefreshCw,
-    ChevronLeft,
-    ArrowDown,
-    Loader2,
-    AlertCircle,
-    Trash2,
-    FolderPlus,
-    Pencil,
-    Copy,
-    Home,
-    Search,
-    Shield,
+AlertCircle,
+ArrowDown,
+ChevronLeft,
+Copy,
+Folder,
+FolderPlus,
+HardDrive,
+Home,
+Loader2,
+Monitor,
+Pencil,
+Plus,
+RefreshCw,
+Search,
+Shield,
+Trash2,
+X,
 } from 'lucide-react';
 
 // SFTP Pane component

components/SnippetsManager.tsx

@@ -1,20 +1,19 @@
-import React, { useMemo, useState, useCallback, useRef, useEffect } from 'react';
-import { Host, Snippet, ShellHistoryEntry, SSHKey } from '../types';
-import { FileCode, Plus, Trash2, Edit2, Copy, Clock, List as ListIcon, FolderPlus, Play, ArrowLeft, X, Check, ChevronDown, Loader2, Package, Search, LayoutGrid } from 'lucide-react';
-import { Button } from './ui/button';
-import { Input } from './ui/input';
-import { Textarea } from './ui/textarea';
-import { Card } from './ui/card';
-import { Label } from './ui/label';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger, ContextMenuSeparator } from './ui/context-menu';
+import { Check,ChevronDown,Clock,Copy,Edit2,FileCode,FolderPlus,LayoutGrid,List as ListIcon,Loader2,Package,Play,Plus,Search,Trash2 } from 'lucide-react';
+import React,{ useCallback,useEffect,useMemo,useRef,useState } from 'react';
 import { cn } from '../lib/utils';
-import { ScrollArea } from './ui/scroll-area';
+import { Host,ShellHistoryEntry,Snippet,SSHKey } from '../types';
 import { DistroAvatar } from './DistroAvatar';
 import SelectHostPanel from './SelectHostPanel';
-import { AsidePanel, AsidePanelContent } from './ui/aside-panel';
-import { Combobox, ComboboxOption } from './ui/combobox';
-import { Dropdown, DropdownTrigger, DropdownContent } from './ui/dropdown';
-import { SortDropdown, SortMode } from './ui/sort-dropdown';
+import { AsidePanel,AsidePanelContent } from './ui/aside-panel';
+import { Button } from './ui/button';
+import { Card } from './ui/card';
+import { Combobox,ComboboxOption } from './ui/combobox';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuSeparator,ContextMenuTrigger } from './ui/context-menu';
+import { Dropdown,DropdownContent,DropdownTrigger } from './ui/dropdown';
+import { Input } from './ui/input';
+import { Label } from './ui/label';
+import { SortDropdown,SortMode } from './ui/sort-dropdown';
+import { Textarea } from './ui/textarea';
 
 interface SnippetsManagerProps {
   snippets: Snippet[];

components/Terminal.tsx

@@ -1,16 +1,15 @@
-import React, { useEffect, useRef, useState, memo } from 'react';
-import { init as initGhostty, Terminal as GhosttyTerminal, FitAddon } from 'ghostty-web';
-import { Host, SSHKey, Snippet, TerminalSession, TerminalTheme, KnownHost, ProxyConfig, HostChainConfig, ShellHistoryEntry } from '../types';
+import { FitAddon,Terminal as GhosttyTerminal,init as initGhostty } from 'ghostty-web';
 import { Maximize2 } from 'lucide-react';
-import { DistroAvatar } from './DistroAvatar';
-import { Button } from './ui/button';
+import React,{ memo,useEffect,useRef,useState } from 'react';
 import { cn } from '../lib/utils';
+import { Host,KnownHost,SSHKey,Snippet,TerminalSession,TerminalTheme } from '../types';
+import KnownHostConfirmDialog,{ HostKeyInfo } from './KnownHostConfirmDialog';
 import SFTPModal from './SFTPModal';
-import KnownHostConfirmDialog, { HostKeyInfo } from './KnownHostConfirmDialog';
+import { Button } from './ui/button';
 
 // Import terminal sub-components
-import { TerminalToolbar } from './terminal/TerminalToolbar';
 import { TerminalConnectionDialog } from './terminal/TerminalConnectionDialog';
+import { TerminalToolbar } from './terminal/TerminalToolbar';
 
 interface TerminalProps {
   host: Host;

components/TerminalLayer.tsx

@@ -1,12 +1,12 @@
-import React, { useEffect, useMemo, useRef, useState, useCallback, memo } from 'react';
-import { cn } from '../lib/utils';
-import Terminal from './Terminal';
-import { Host, SSHKey, Snippet, TerminalSession, TerminalTheme, Workspace, WorkspaceNode, KnownHost } from '../types';
+import { Circle,LayoutGrid,Server } from 'lucide-react';
+import React,{ memo,useCallback,useEffect,useMemo,useRef,useState } from 'react';
 import { useActiveTabId } from '../application/state/activeTabStore';
 import { collectSessionIds } from '../domain/workspace';
+import { cn } from '../lib/utils';
+import { Host,KnownHost,SSHKey,Snippet,TerminalSession,TerminalTheme,Workspace,WorkspaceNode } from '../types';
 import { DistroAvatar } from './DistroAvatar';
+import Terminal from './Terminal';
 import { Button } from './ui/button';
-import { LayoutGrid, Server, Circle } from 'lucide-react';
 import { ScrollArea } from './ui/scroll-area';
 
 type WorkspaceRect = { x: number; y: number; w: number; h: number };

components/ThemeSelectPanel.tsx

@@ -1,13 +1,13 @@
-import React, { useState, useMemo } from 'react';
 import { Users } from 'lucide-react';
-import { TerminalTheme } from '../types';
+import React,{ useMemo,useState } from 'react';
 import { TERMINAL_THEMES } from '../infrastructure/config/terminalThemes';
-import { ScrollArea } from './ui/scroll-area';
 import { cn } from '../lib/utils';
+import { TerminalTheme } from '../types';
 import {
-    AsidePanel,
-    AsidePanelContent,
+AsidePanel,
+AsidePanelContent,
 } from './ui/aside-panel';
+import { ScrollArea } from './ui/scroll-area';
 
 interface ThemeSelectPanelProps {
     open: boolean;

components/TopTabs.tsx

@@ -1,10 +1,10 @@
-import React, { useState, useEffect, useRef, useMemo, useCallback, memo, useLayoutEffect } from 'react';
-import { TerminalSquare, Shield, Folder, LayoutGrid, Plus, Bell, User, Sun, Moon, X, Minus, Square, Copy, MoreHorizontal } from 'lucide-react';
-import { TerminalSession, Workspace } from '../types';
-import { Button } from './ui/button';
+import { Bell,Copy,Folder,LayoutGrid,Minus,Moon,MoreHorizontal,Plus,Shield,Square,Sun,TerminalSquare,User,X } from 'lucide-react';
+import React,{ memo,useCallback,useEffect,useLayoutEffect,useMemo,useRef,useState } from 'react';
+import { activeTabStore,useActiveTabId } from '../application/state/activeTabStore';
 import { cn } from '../lib/utils';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './ui/context-menu';
-import { useActiveTabId, activeTabStore } from '../application/state/activeTabStore';
+import { TerminalSession,Workspace } from '../types';
+import { Button } from './ui/button';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuTrigger } from './ui/context-menu';
 
 interface TopTabsProps {
   theme: 'dark' | 'light';

components/VaultView.tsx

@@ -1,45 +1,44 @@
-import React, { useMemo, useState, memo, useCallback } from 'react';
-import { AppLogo } from './AppLogo';
 import {
-  Activity,
-  BookMarked,
-  ChevronDown,
-  FolderPlus,
-  FolderTree,
-  Edit2,
-  FileCode,
-  Key,
-  LayoutGrid,
-  List,
-  Plug,
-  Plus,
-  Search,
-  Settings,
-  Trash2,
-  TerminalSquare,
-  Upload,
-  Zap,
+Activity,
+BookMarked,
+ChevronDown,
+Edit2,
+FileCode,
+FolderPlus,
+FolderTree,
+Key,
+LayoutGrid,
+List,
+Plug,
+Plus,
+Search,
+Settings,
+TerminalSquare,
+Trash2,
+Upload,
+Zap,
 } from 'lucide-react';
-import { Host, SSHKey, Snippet, GroupNode, TerminalSession, KnownHost, ShellHistoryEntry, HostProtocol } from '../types';
-import { DistroAvatar } from './DistroAvatar';
-import SnippetsManager from './SnippetsManager';
-import KeychainManager from './KeychainManager';
-import PortForwarding from './PortForwardingNew';
-import KnownHostsManager from './KnownHostsManager';
-import HostDetailsPanel from './HostDetailsPanel';
-import QuickConnectWizard, { parseQuickConnectInput, isQuickConnectInput } from './QuickConnectWizard';
-import ProtocolSelectDialog from './ProtocolSelectDialog';
-import { Button } from './ui/button';
-import { Input } from './ui/input';
-import { Dropdown, DropdownTrigger, DropdownContent } from './ui/dropdown';
-import { cn } from '../lib/utils';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger } from './ui/context-menu';
-import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from './ui/dialog';
-import { Label } from './ui/label';
-import { SortDropdown, SortMode } from './ui/sort-dropdown';
-import { TagFilterDropdown } from './ui/tag-filter-dropdown';
+import React,{ memo,useCallback,useMemo,useState } from 'react';
 import { sanitizeHost } from '../domain/host';
-import { useIsVaultActive } from '../application/state/activeTabStore';
+import { cn } from '../lib/utils';
+import { GroupNode,Host,HostProtocol,KnownHost,SSHKey,ShellHistoryEntry,Snippet,TerminalSession } from '../types';
+import { AppLogo } from './AppLogo';
+import { DistroAvatar } from './DistroAvatar';
+import HostDetailsPanel from './HostDetailsPanel';
+import KeychainManager from './KeychainManager';
+import KnownHostsManager from './KnownHostsManager';
+import PortForwarding from './PortForwardingNew';
+import ProtocolSelectDialog from './ProtocolSelectDialog';
+import QuickConnectWizard,{ isQuickConnectInput,parseQuickConnectInput } from './QuickConnectWizard';
+import SnippetsManager from './SnippetsManager';
+import { Button } from './ui/button';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuTrigger } from './ui/context-menu';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from './ui/dialog';
+import { Dropdown,DropdownContent,DropdownTrigger } from './ui/dropdown';
+import { Input } from './ui/input';
+import { Label } from './ui/label';
+import { SortDropdown,SortMode } from './ui/sort-dropdown';
+import { TagFilterDropdown } from './ui/tag-filter-dropdown';
 
 type VaultSection = 'hosts' | 'keys' | 'snippets' | 'port' | 'knownhosts';
 

components/host-details/ChainPanel.tsx

@@ -2,14 +2,14 @@
  * Host Chain Sub-Panel
  * Panel for configuring SSH jump host chain
  */
+import { ArrowDown,Plus,X } from 'lucide-react';
 import React from 'react';
-import { Plus, ArrowDown, X } from 'lucide-react';
 import { Host } from '../../types';
+import { DistroAvatar } from '../DistroAvatar';
+import { AsidePanel } from '../ui/aside-panel';
 import { Button } from '../ui/button';
 import { Card } from '../ui/card';
 import { ScrollArea } from '../ui/scroll-area';
-import { AsidePanel } from '../ui/aside-panel';
-import { DistroAvatar } from '../DistroAvatar';
 
 export interface ChainPanelProps {
     formLabel: string;

components/host-details/CreateGroupPanel.tsx

@@ -2,12 +2,12 @@
  * Create Group Sub-Panel
  * Panel for creating new groups within the host details
  */
+import { FolderPlus,HelpCircle,Plus } from 'lucide-react';
 import React from 'react';
-import { FolderPlus, Plus, HelpCircle } from 'lucide-react';
+import { AsidePanel,AsidePanelContent } from '../ui/aside-panel';
 import { Button } from '../ui/button';
-import { Input } from '../ui/input';
 import { Card } from '../ui/card';
-import { AsidePanel, AsidePanelContent } from '../ui/aside-panel';
+import { Input } from '../ui/input';
 
 interface ToggleRowProps {
     label: string;

components/host-details/EnvVarsPanel.tsx

@@ -2,13 +2,13 @@
  * Environment Variables Sub-Panel
  * Panel for configuring environment variables for SSH connections
  */
+import { Plus,X } from 'lucide-react';
 import React from 'react';
-import { Plus, X } from 'lucide-react';
 import { EnvVar } from '../../types';
+import { AsidePanel,AsidePanelContent } from '../ui/aside-panel';
 import { Button } from '../ui/button';
-import { Input } from '../ui/input';
 import { Card } from '../ui/card';
-import { AsidePanel, AsidePanelContent } from '../ui/aside-panel';
+import { Input } from '../ui/input';
 
 export interface EnvVarsPanelProps {
     hostLabel: string;

components/host-details/ProxyPanel.tsx

@@ -2,15 +2,15 @@
  * Proxy Configuration Sub-Panel
  * Panel for configuring HTTP/SOCKS5 proxy settings
  */
+import { Check,Trash2 } from 'lucide-react';
 import React from 'react';
-import { Trash2, Check } from 'lucide-react';
-import { ProxyConfig } from '../../types';
-import { Button } from '../ui/button';
-import { Input } from '../ui/input';
-import { Badge } from '../ui/badge';
-import { Card } from '../ui/card';
-import { AsidePanel, AsidePanelContent } from '../ui/aside-panel';
 import { cn } from '../../lib/utils';
+import { ProxyConfig } from '../../types';
+import { AsidePanel,AsidePanelContent } from '../ui/aside-panel';
+import { Badge } from '../ui/badge';
+import { Button } from '../ui/button';
+import { Card } from '../ui/card';
+import { Input } from '../ui/input';
 
 export interface ProxyPanelProps {
     proxyConfig?: ProxyConfig;

components/keychain/EditKeyPanel.tsx

@@ -2,13 +2,13 @@
  * Edit Key Panel - Edit existing SSH key
  */
 
+import { Info } from 'lucide-react';
 import React from 'react';
 import { SSHKey } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
 import { Button } from '../ui/button';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
 import { Textarea } from '../ui/textarea';
-import { Info } from 'lucide-react';
 
 interface EditKeyPanelProps {
     draftKey: Partial<SSHKey>;

components/keychain/ExportKeyPanel.tsx

@@ -2,17 +2,17 @@
  * Export Key Panel - Export SSH key to remote host
  */
 
-import React, { useState } from 'react';
-import { SSHKey, Host } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
-import { Button } from '../ui/button';
-import { Textarea } from '../ui/textarea';
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../ui/collapsible';
-import { ChevronRight, Info } from 'lucide-react';
+import { ChevronRight,Info } from 'lucide-react';
+import React,{ useState } from 'react';
 import { cn } from '../../lib/utils';
-import { getKeyIcon, getKeyTypeDisplay, isMacOS } from './utils';
+import { Host,SSHKey } from '../../types';
+import { Button } from '../ui/button';
+import { Collapsible,CollapsibleContent,CollapsibleTrigger } from '../ui/collapsible';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
+import { Textarea } from '../ui/textarea';
 import { toast } from '../ui/toast';
+import { getKeyIcon,getKeyTypeDisplay,isMacOS } from './utils';
 
 interface ExportKeyPanelProps {
     keyItem: SSHKey;

components/keychain/GenerateBiometricPanel.tsx

@@ -2,12 +2,12 @@
  * Generate Biometric Key Panel - Windows Hello / Touch ID
  */
 
+import { Fingerprint } from 'lucide-react';
 import React from 'react';
 import { SSHKey } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
 import { Button } from '../ui/button';
-import { Fingerprint } from 'lucide-react';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
 import { isMacOS } from './utils';
 
 interface GenerateBiometricPanelProps {

components/keychain/GenerateFido2Panel.tsx

@@ -2,12 +2,12 @@
  * Generate FIDO2 Key Panel - Hardware security key (YubiKey, etc.)
  */
 
+import { Shield } from 'lucide-react';
 import React from 'react';
 import { SSHKey } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
 import { Button } from '../ui/button';
-import { Shield } from 'lucide-react';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
 
 interface GenerateFido2PanelProps {
     draftKey: Partial<SSHKey>;

components/keychain/GenerateStandardPanel.tsx

@@ -2,13 +2,13 @@
  * Generate Key Panel - Standard SSH Key generation form
  */
 
+import { Eye,EyeOff } from 'lucide-react';
 import React from 'react';
-import { SSHKey, KeyType } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
-import { Button } from '../ui/button';
 import { cn } from '../../lib/utils';
-import { Eye, EyeOff } from 'lucide-react';
+import { KeyType,SSHKey } from '../../types';
+import { Button } from '../ui/button';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
 
 interface GenerateStandardPanelProps {
     draftKey: Partial<SSHKey>;

components/keychain/IdentityCard.tsx

@@ -2,11 +2,11 @@
  * Identity Card component for displaying saved identities
  */
 
+import { Pencil,User } from 'lucide-react';
 import React from 'react';
-import { Identity } from '../../types';
 import { cn } from '../../lib/utils';
+import { Identity } from '../../types';
 import { Button } from '../ui/button';
-import { Pencil, User } from 'lucide-react';
 
 interface IdentityCardProps {
     identity: Identity;

components/keychain/IdentityPanel.tsx

@@ -2,13 +2,13 @@
  * Identity Panel - Create/Edit identity
  */
 
+import { BadgeCheck,ChevronDown,Eye,EyeOff,Key,Shield,User } from 'lucide-react';
 import React from 'react';
-import { Identity, SSHKey } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
+import { Identity,SSHKey } from '../../types';
 import { Button } from '../ui/button';
-import { Dropdown, DropdownTrigger, DropdownContent } from '../ui/dropdown';
-import { User, Key, BadgeCheck, Shield, ChevronDown, Eye, EyeOff } from 'lucide-react';
+import { Dropdown,DropdownContent,DropdownTrigger } from '../ui/dropdown';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
 
 interface IdentityPanelProps {
     draftIdentity: Partial<Identity>;

components/keychain/ImportKeyPanel.tsx

@@ -2,13 +2,13 @@
  * Import Key Panel - Import existing SSH key
  */
 
-import React, { useRef, useCallback } from 'react';
-import { SSHKey, KeyType } from '../../types';
-import { Label } from '../ui/label';
-import { Input } from '../ui/input';
-import { Button } from '../ui/button';
-import { Textarea } from '../ui/textarea';
 import { Upload } from 'lucide-react';
+import React,{ useCallback,useRef } from 'react';
+import { SSHKey } from '../../types';
+import { Button } from '../ui/button';
+import { Input } from '../ui/input';
+import { Label } from '../ui/label';
+import { Textarea } from '../ui/textarea';
 import { detectKeyType } from './utils';
 
 interface ImportKeyPanelProps {

components/keychain/KeyCard.tsx

@@ -2,19 +2,19 @@
  * Key Card component for displaying SSH keys in grid/list view
  */
 
+import { Copy,ExternalLink,Pencil,Trash2 } from 'lucide-react';
 import React from 'react';
-import { SSHKey } from '../../types';
 import { cn } from '../../lib/utils';
+import { SSHKey } from '../../types';
 import { Button } from '../ui/button';
-import { Pencil, Copy, ExternalLink, Trash2 } from 'lucide-react';
 import {
-    ContextMenu,
-    ContextMenuContent,
-    ContextMenuItem,
-    ContextMenuSeparator,
-    ContextMenuTrigger,
+ContextMenu,
+ContextMenuContent,
+ContextMenuItem,
+ContextMenuSeparator,
+ContextMenuTrigger,
 } from '../ui/context-menu';
-import { getKeyIcon, getKeyTypeDisplay } from './utils';
+import { getKeyIcon,getKeyTypeDisplay } from './utils';
 
 interface KeyCardProps {
     keyItem: SSHKey;

components/keychain/ViewKeyPanel.tsx

@@ -2,11 +2,11 @@
  * View Key Panel - Display SSH key details
  */
 
+import { Copy,Info } from 'lucide-react';
 import React from 'react';
 import { SSHKey } from '../../types';
-import { Label } from '../ui/label';
 import { Button } from '../ui/button';
-import { Copy, Info } from 'lucide-react';
+import { Label } from '../ui/label';
 import { copyToClipboard } from './utils';
 
 interface ViewKeyPanelProps {

components/keychain/index.ts

@@ -6,28 +6,20 @@
 
 // Utilities and types
 export {
-    generateMockKeyPair,
-    createFido2Credential,
-    createBiometricCredential,
-    getKeyIcon,
-    getKeyTypeDisplay,
-    detectKeyType,
-    copyToClipboard,
-    isMacOS,
-    type PanelMode,
-    type FilterTab,
+copyToClipboard,createBiometricCredential,createFido2Credential,detectKeyType,generateMockKeyPair,getKeyIcon,
+getKeyTypeDisplay,isMacOS,type FilterTab,type PanelMode
 } from './utils';
 
 // Card components
-export { KeyCard } from './KeyCard';
 export { IdentityCard } from './IdentityCard';
+export { KeyCard } from './KeyCard';
 
 // Panel components
-export { GenerateStandardPanel } from './GenerateStandardPanel';
+export { EditKeyPanel } from './EditKeyPanel';
+export { ExportKeyPanel } from './ExportKeyPanel';
 export { GenerateBiometricPanel } from './GenerateBiometricPanel';
 export { GenerateFido2Panel } from './GenerateFido2Panel';
+export { GenerateStandardPanel } from './GenerateStandardPanel';
+export { IdentityPanel } from './IdentityPanel';
 export { ImportKeyPanel } from './ImportKeyPanel';
 export { ViewKeyPanel } from './ViewKeyPanel';
-export { EditKeyPanel } from './EditKeyPanel';
-export { IdentityPanel } from './IdentityPanel';
-export { ExportKeyPanel } from './ExportKeyPanel';

components/keychain/utils.ts

@@ -2,9 +2,9 @@
  * Keychain utility functions and WebAuthn/FIDO2 helpers
  */
 
-import { KeyType, SSHKey } from '../../types';
+import { BadgeCheck,Fingerprint,Key,Shield } from 'lucide-react';
 import React from 'react';
-import { Key, Fingerprint, Shield, BadgeCheck } from 'lucide-react';
+import { KeyType,SSHKey } from '../../types';
 
 /**
  * Generate mock key pair (for fallback when Electron backend is unavailable)

components/port-forwarding/EditPanel.tsx

@@ -2,15 +2,15 @@
  * Port Forwarding Edit Panel
  * Form for editing an existing port forwarding rule
  */
+import { ChevronDown,Copy,Trash2 } from 'lucide-react';
 import React from 'react';
-import { Copy, Trash2, ChevronDown } from 'lucide-react';
-import { PortForwardingRule, Host } from '../../domain/models';
+import { Host,PortForwardingRule } from '../../domain/models';
+import { DistroAvatar } from '../DistroAvatar';
+import { TrafficDiagram } from '../TrafficDiagram';
+import { AsideActionMenu,AsideActionMenuItem,AsidePanel,AsidePanelContent,AsidePanelFooter } from '../ui/aside-panel';
 import { Button } from '../ui/button';
 import { Input } from '../ui/input';
 import { Label } from '../ui/label';
-import { AsidePanel, AsidePanelContent, AsidePanelFooter, AsideActionMenu, AsideActionMenuItem } from '../ui/aside-panel';
-import { DistroAvatar } from '../DistroAvatar';
-import { TrafficDiagram } from '../TrafficDiagram';
 
 export interface EditPanelProps {
     rule: PortForwardingRule;

components/port-forwarding/NewFormPanel.tsx

@@ -2,16 +2,16 @@
  * Port Forwarding New Form Panel
  * All-in-one form for creating new port forwarding rules (skip wizard mode)
  */
+import { ChevronDown,Zap } from 'lucide-react';
 import React from 'react';
-import { ChevronDown, Zap } from 'lucide-react';
-import { PortForwardingRule, PortForwardingType, Host } from '../../domain/models';
+import { Host,PortForwardingRule,PortForwardingType } from '../../domain/models';
+import { cn } from '../../lib/utils';
+import { DistroAvatar } from '../DistroAvatar';
+import { TrafficDiagram } from '../TrafficDiagram';
+import { AsidePanel,AsidePanelContent,AsidePanelFooter } from '../ui/aside-panel';
 import { Button } from '../ui/button';
 import { Input } from '../ui/input';
 import { Label } from '../ui/label';
-import { AsidePanel, AsidePanelContent, AsidePanelFooter } from '../ui/aside-panel';
-import { DistroAvatar } from '../DistroAvatar';
-import { TrafficDiagram } from '../TrafficDiagram';
-import { cn } from '../../lib/utils';
 
 export interface NewFormPanelProps {
     draft: Partial<PortForwardingRule>;

components/port-forwarding/RuleCard.tsx

@@ -2,13 +2,13 @@
  * Port Forwarding Rule Card
  * Displays a single port forwarding rule in grid or list view
  */
+import { Copy,Loader2,Pencil,Play,Square,Trash2 } from 'lucide-react';
 import React from 'react';
-import { Play, Square, Loader2, Pencil, Copy, Trash2 } from 'lucide-react';
 import { PortForwardingRule } from '../../domain/models';
-import { Button } from '../ui/button';
-import { ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuTrigger, ContextMenuSeparator } from '../ui/context-menu';
 import { cn } from '../../lib/utils';
-import { getStatusColor, getTypeColor } from './utils';
+import { Button } from '../ui/button';
+import { ContextMenu,ContextMenuContent,ContextMenuItem,ContextMenuSeparator,ContextMenuTrigger } from '../ui/context-menu';
+import { getStatusColor,getTypeColor } from './utils';
 
 export type ViewMode = 'grid' | 'list';
 

components/port-forwarding/WizardContent.tsx

@@ -2,15 +2,15 @@
  * Port Forwarding Wizard Content
  * Renders step-by-step wizard content for creating port forwarding rules
  */
-import React from 'react';
 import { Check } from 'lucide-react';
-import { PortForwardingRule, PortForwardingType, Host } from '../../domain/models';
+import React from 'react';
+import { Host,PortForwardingRule,PortForwardingType } from '../../domain/models';
+import { cn } from '../../lib/utils';
+import { DistroAvatar } from '../DistroAvatar';
+import { TrafficDiagram } from '../TrafficDiagram';
 import { Button } from '../ui/button';
 import { Input } from '../ui/input';
 import { Label } from '../ui/label';
-import { DistroAvatar } from '../DistroAvatar';
-import { TrafficDiagram } from '../TrafficDiagram';
-import { cn } from '../../lib/utils';
 import { TYPE_DESCRIPTIONS } from './utils';
 
 export type WizardStep = 'type' | 'local-config' | 'remote-host-selection' | 'remote-config' | 'destination' | 'host-selection' | 'label';

components/port-forwarding/index.ts

@@ -4,19 +4,16 @@
  */
 
 export {
-  TYPE_LABELS,
-  TYPE_DESCRIPTIONS,
-  TYPE_ICONS,
-  getStatusColor,
-  getTypeColor,
-  generateRuleLabel,
+TYPE_DESCRIPTIONS,
+TYPE_ICONS,TYPE_LABELS,generateRuleLabel,getStatusColor,
+getTypeColor
 } from './utils';
 
 export { RuleCard } from './RuleCard';
-export type { RuleCardProps, ViewMode } from './RuleCard';
+export type { RuleCardProps,ViewMode } from './RuleCard';
 
 export { WizardContent } from './WizardContent';
-export type { WizardContentProps, WizardStep } from './WizardContent';
+export type { WizardContentProps,WizardStep } from './WizardContent';
 
 export { EditPanel } from './EditPanel';
 export type { EditPanelProps } from './EditPanel';

components/port-forwarding/utils.tsx

@@ -1,8 +1,8 @@
 /**
  * Port Forwarding utilities and constants
  */
+import { Globe,Server,Shuffle } from 'lucide-react';
 import React from 'react';
-import { Globe, Server, Shuffle } from 'lucide-react';
 import { PortForwardingType } from '../../domain/models';
 
 export const TYPE_LABELS: Record<PortForwardingType, string> = {

components/sftp/SftpBreadcrumb.tsx

@@ -2,9 +2,9 @@
  * SFTP Breadcrumb navigation component
  */
 
-import React, { memo } from 'react';
+import { ChevronRight,Home } from 'lucide-react';
+import React,{ memo } from 'react';
 import { cn } from '../../lib/utils';
-import { ChevronRight, Home } from 'lucide-react';
 
 interface SftpBreadcrumbProps {
     path: string;

components/sftp/SftpConflictDialog.tsx

@@ -2,10 +2,10 @@
  * SFTP Conflict Resolution Dialog
  */
 
-import React, { useState } from 'react';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogFooter } from '../ui/dialog';
-import { Button } from '../ui/button';
 import { AlertCircle } from 'lucide-react';
+import React,{ useState } from 'react';
+import { Button } from '../ui/button';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from '../ui/dialog';
 
 interface ConflictItem {
     transferId: string;

components/sftp/SftpFileRow.tsx

@@ -2,11 +2,11 @@
  * SFTP File row component for file list
  */
 
-import React, { memo } from 'react';
-import { cn } from '../../lib/utils';
 import { Folder } from 'lucide-react';
+import React,{ memo } from 'react';
+import { cn } from '../../lib/utils';
 import { SftpFileEntry } from '../../types';
-import { formatBytes, formatDate, getFileIcon, ColumnWidths } from './utils';
+import { ColumnWidths,formatBytes,formatDate,getFileIcon } from './utils';
 
 interface SftpFileRowProps {
     entry: SftpFileEntry;

components/sftp/SftpHostPicker.tsx

@@ -2,13 +2,13 @@
  * SFTP Host Picker Dialog
  */
 
-import React, { useMemo } from 'react';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '../ui/dialog';
-import { Badge } from '../ui/badge';
-import { Input } from '../ui/input';
+import { Monitor } from 'lucide-react';
+import React,{ useMemo } from 'react';
 import { Host } from '../../types';
 import { DistroAvatar } from '../DistroAvatar';
-import { Monitor } from 'lucide-react';
+import { Badge } from '../ui/badge';
+import { Dialog,DialogContent,DialogDescription,DialogHeader,DialogTitle } from '../ui/dialog';
+import { Input } from '../ui/input';
 
 interface SftpHostPickerProps {
     open: boolean;

components/sftp/SftpPermissionsDialog.tsx

@@ -2,10 +2,10 @@
  * SFTP Permissions Editor Dialog
  */
 
-import React, { useState, useEffect } from 'react';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, DialogFooter } from '../ui/dialog';
-import { Button } from '../ui/button';
+import React,{ useEffect,useState } from 'react';
 import { SftpFileEntry } from '../../types';
+import { Button } from '../ui/button';
+import { Dialog,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogTitle } from '../ui/dialog';
 
 interface SftpPermissionsDialogProps {
     open: boolean;

components/sftp/SftpTransferItem.tsx

@@ -2,19 +2,19 @@
  * SFTP Transfer item component for transfer queue
  */
 
-import React, { memo } from 'react';
-import { cn } from '../../lib/utils';
-import { Button } from '../ui/button';
-import { TransferTask } from '../../types';
-import { formatTransferBytes, formatSpeed } from './utils';
 import {
-    ArrowDown,
-    Loader2,
-    CheckCircle2,
-    XCircle,
-    RefreshCw,
-    X,
+ArrowDown,
+CheckCircle2,
+Loader2,
+RefreshCw,
+X,
+XCircle,
 } from 'lucide-react';
+import React,{ memo } from 'react';
+import { cn } from '../../lib/utils';
+import { TransferTask } from '../../types';
+import { Button } from '../ui/button';
+import { formatSpeed,formatTransferBytes } from './utils';
 
 interface SftpTransferItemProps {
     task: TransferTask;

components/sftp/index.ts

@@ -6,20 +6,15 @@
 
 // Utilities
 export {
-    formatBytes,
-    formatTransferBytes,
-    formatDate,
-    formatSpeed,
-    getFileIcon,
-    type SortField,
-    type SortOrder,
-    type ColumnWidths,
+formatBytes,formatDate,
+formatSpeed,formatTransferBytes,getFileIcon,type ColumnWidths,type SortField,
+type SortOrder
 } from './utils';
 
 // Components
 export { SftpBreadcrumb } from './SftpBreadcrumb';
-export { SftpFileRow } from './SftpFileRow';
-export { SftpTransferItem } from './SftpTransferItem';
 export { SftpConflictDialog } from './SftpConflictDialog';
-export { SftpPermissionsDialog } from './SftpPermissionsDialog';
+export { SftpFileRow } from './SftpFileRow';
 export { SftpHostPicker } from './SftpHostPicker';
+export { SftpPermissionsDialog } from './SftpPermissionsDialog';
+export { SftpTransferItem } from './SftpTransferItem';

components/sftp/utils.ts

@@ -2,26 +2,26 @@
  * SFTP utility functions for formatting and file type detection
  */
 
+import {
+Database,
+File,
+FileArchive,
+FileAudio,
+FileCode,
+FileImage,
+FileSpreadsheet,
+FileText,
+FileType,
+FileVideo,
+Folder,
+Globe,
+Key,
+Lock,
+Settings,
+Terminal,
+} from 'lucide-react';
 import React from 'react';
 import { SftpFileEntry } from '../../types';
-import {
-    FileCode,
-    Folder,
-    FileText,
-    FileImage,
-    FileVideo,
-    FileAudio,
-    FileArchive,
-    FileSpreadsheet,
-    FileType,
-    File,
-    Terminal,
-    Settings,
-    Database,
-    Globe,
-    Lock,
-    Key,
-} from 'lucide-react';
 
 /**
  * Format bytes with appropriate unit (B, KB, MB, GB)

components/terminal/TerminalAuthDialog.tsx

@@ -2,14 +2,14 @@
  * Terminal Authentication Dialog
  * Displays auth form with password/key selection for SSH connection
  */
+import { AlertCircle,ChevronDown,Eye,EyeOff,Key,Lock } from 'lucide-react';
 import React from 'react';
-import { Lock, Key, Eye, EyeOff, ChevronDown, AlertCircle } from 'lucide-react';
+import { cn } from '../../lib/utils';
 import { SSHKey } from '../../types';
 import { Button } from '../ui/button';
 import { Input } from '../ui/input';
 import { Label } from '../ui/label';
-import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';
-import { cn } from '../../lib/utils';
+import { Popover,PopoverContent,PopoverTrigger } from '../ui/popover';
 
 export interface TerminalAuthDialogProps {
     authMethod: 'password' | 'key';

components/terminal/TerminalConnectionDialog.tsx

@@ -2,14 +2,14 @@
  * Terminal Connection Dialog
  * Full connection overlay with host info, progress indicator, and auth/progress content
  */
-import React from 'react';
 import { User } from 'lucide-react';
-import { Host, SSHKey } from '../../types';
-import { Button } from '../ui/button';
-import { DistroAvatar } from '../DistroAvatar';
+import React from 'react';
 import { cn } from '../../lib/utils';
-import { TerminalAuthDialog, TerminalAuthDialogProps } from './TerminalAuthDialog';
-import { TerminalConnectionProgress, TerminalConnectionProgressProps } from './TerminalConnectionProgress';
+import { Host,SSHKey } from '../../types';
+import { DistroAvatar } from '../DistroAvatar';
+import { Button } from '../ui/button';
+import { TerminalAuthDialog,TerminalAuthDialogProps } from './TerminalAuthDialog';
+import { TerminalConnectionProgress,TerminalConnectionProgressProps } from './TerminalConnectionProgress';
 
 export interface ChainProgress {
     currentHop: number;

components/terminal/TerminalConnectionProgress.tsx

@@ -2,8 +2,8 @@
  * Terminal Connection Progress
  * Displays connection progress with logs and timeout
  */
+import { AlertCircle,Clock,Play,ShieldCheck } from 'lucide-react';
 import React from 'react';
-import { Clock, Play, ShieldCheck, AlertCircle } from 'lucide-react';
 import { Button } from '../ui/button';
 import { ScrollArea } from '../ui/scroll-area';
 

components/terminal/TerminalToolbar.tsx

@@ -2,11 +2,11 @@
  * Terminal Toolbar
  * Displays SFTP, Scripts buttons and close button in terminal status bar
  */
+import { FolderInput,X,Zap } from 'lucide-react';
 import React from 'react';
-import { Zap, FolderInput, X } from 'lucide-react';
 import { Snippet } from '../../types';
 import { Button } from '../ui/button';
-import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover';
+import { Popover,PopoverContent,PopoverTrigger } from '../ui/popover';
 import { ScrollArea } from '../ui/scroll-area';
 
 export interface TerminalToolbarProps {

components/terminal/index.ts

@@ -13,4 +13,4 @@ export { TerminalToolbar } from './TerminalToolbar';
 export type { TerminalToolbarProps } from './TerminalToolbar';
 
 export { TerminalConnectionDialog } from './TerminalConnectionDialog';
-export type { TerminalConnectionDialogProps, ChainProgress } from './TerminalConnectionDialog';
+export type { ChainProgress,TerminalConnectionDialogProps } from './TerminalConnectionDialog';

components/ui/aside-panel.tsx

@@ -1,9 +1,8 @@
-import React, { createContext, useContext, useState, useCallback, ReactNode } from 'react';
-import { ArrowLeft, X, MoreVertical } from 'lucide-react';
-import { Button } from './button';
-import { ScrollArea } from './scroll-area';
-import { Popover, PopoverContent, PopoverTrigger } from './popover';
+import { ArrowLeft,MoreVertical,X } from 'lucide-react';
+import React,{ createContext,ReactNode,useCallback,useContext,useState } from 'react';
 import { cn } from '../../lib/utils';
+import { Popover,PopoverContent,PopoverTrigger } from './popover';
+import { ScrollArea } from './scroll-area';
 
 // Types
 interface AsideContentItem {

components/ui/button.tsx

@@ -35,4 +35,4 @@ const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
 )
 Button.displayName = "Button"
 
-export { Button }
+export { Button }

components/ui/card.tsx

@@ -75,4 +75,4 @@ const CardFooter = React.forwardRef<
 ))
 CardFooter.displayName = "CardFooter"
 
-export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
+export { Card,CardContent,CardDescription,CardFooter,CardHeader,CardTitle }

components/ui/collapsible.tsx

@@ -1,4 +1,3 @@
-import * as React from "react"
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible"
 
 const Collapsible = CollapsiblePrimitive.Root
@@ -7,4 +6,4 @@ const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger
 
 const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent
 
-export { Collapsible, CollapsibleTrigger, CollapsibleContent }
+export { Collapsible,CollapsibleContent,CollapsibleTrigger }

components/ui/combobox.tsx

@@ -1,7 +1,7 @@
+import { Check,ChevronDown,Plus,X } from "lucide-react"
 import * as React from "react"
-import { Check, ChevronDown, Plus, X } from "lucide-react"
 import { cn } from "../../lib/utils"
-import { Popover, PopoverContent, PopoverTrigger } from "./popover"
+import { Popover,PopoverContent,PopoverTrigger } from "./popover"
 import { ScrollArea } from "./scroll-area"
 
 export interface ComboboxOption {

components/ui/context-menu.tsx

@@ -1,6 +1,6 @@
-import * as React from "react"
 import * as ContextMenuPrimitive from "@radix-ui/react-context-menu"
-import { Check, ChevronRight, Circle } from "lucide-react"
+import { Check,ChevronRight,Circle } from "lucide-react"
+import * as React from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -213,19 +213,8 @@ const ContextMenuShortcut = ({
 ContextMenuShortcut.displayName = "ContextMenuShortcut"
 
 export {
-  ContextMenu,
-  ContextMenuTrigger,
-  ContextMenuContent,
-  ContextMenuItem,
-  ContextMenuCheckboxItem,
-  ContextMenuRadioItem,
-  ContextMenuLabel,
-  ContextMenuSeparator,
-  ContextMenuShortcut,
-  ContextMenuGroup,
-  ContextMenuPortal,
-  ContextMenuSub,
-  ContextMenuSubContent,
-  ContextMenuSubTrigger,
-  ContextMenuRadioGroup,
+ContextMenu,ContextMenuCheckboxItem,ContextMenuContent,ContextMenuGroup,ContextMenuItem,ContextMenuLabel,ContextMenuPortal,ContextMenuRadioGroup,ContextMenuRadioItem,ContextMenuSeparator,
+ContextMenuShortcut,ContextMenuSub,
+ContextMenuSubContent,
+ContextMenuSubTrigger,ContextMenuTrigger
 }

components/ui/dialog.tsx

@@ -1,6 +1,6 @@
-import * as React from "react"
 import * as DialogPrimitive from "@radix-ui/react-dialog"
 import { X } from "lucide-react"
+import * as React from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -108,14 +108,5 @@ const DialogDescription = React.forwardRef<
 DialogDescription.displayName = DialogPrimitive.Description.displayName
 
 export {
-  Dialog,
-  DialogPortal,
-  DialogOverlay,
-  DialogClose,
-  DialogTrigger,
-  DialogContent,
-  DialogHeader,
-  DialogFooter,
-  DialogTitle,
-  DialogDescription,
-}
+Dialog,DialogClose,DialogContent,DialogDescription,DialogFooter,DialogHeader,DialogOverlay,DialogPortal,DialogTitle,DialogTrigger
+}

components/ui/dropdown.tsx

@@ -1,5 +1,5 @@
 import * as React from "react"
-import { useEffect, useLayoutEffect, useRef, useState, useCallback } from "react"
+import { useCallback,useEffect,useLayoutEffect,useRef,useState } from "react"
 import { createPortal } from "react-dom"
 import { cn } from "../../lib/utils"
 
@@ -227,4 +227,4 @@ const DropdownContent: React.FC<DropdownContentProps> = ({
     )
 }
 
-export { Dropdown, DropdownTrigger, DropdownContent }
+export { Dropdown,DropdownContent,DropdownTrigger }

components/ui/input.tsx

@@ -21,4 +21,4 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
 )
 Input.displayName = "Input"
 
-export { Input }
+export { Input }

components/ui/label.tsx

@@ -16,4 +16,4 @@ const Label = React.forwardRef<
 ))
 Label.displayName = "Label"
 
-export { Label }
+export { Label }

components/ui/popover.tsx

@@ -1,6 +1,6 @@
-import * as React from "react"
-import { useLayoutEffect, useState, useRef, useCallback } from "react"
 import * as PopoverPrimitive from "@radix-ui/react-popover"
+import * as React from "react"
+import { useCallback,useLayoutEffect,useState } from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -68,4 +68,4 @@ const PopoverContent = React.forwardRef<
 })
 PopoverContent.displayName = PopoverPrimitive.Content.displayName
 
-export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor }
+export { Popover,PopoverAnchor,PopoverContent,PopoverTrigger }

components/ui/scroll-area.tsx

@@ -1,5 +1,5 @@
-import * as React from "react"
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area"
+import * as React from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -43,4 +43,4 @@ const ScrollBar = React.forwardRef<
 ))
 ScrollBar.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName
 
-export { ScrollArea, ScrollBar }
+export { ScrollArea,ScrollBar }

components/ui/select.tsx

@@ -1,6 +1,6 @@
-import * as React from "react"
 import * as SelectPrimitive from "@radix-ui/react-select"
-import { Check, ChevronDown, ChevronUp } from "lucide-react"
+import { Check,ChevronDown,ChevronUp } from "lucide-react"
+import * as React from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -146,14 +146,5 @@ const SelectSeparator = React.forwardRef<
 SelectSeparator.displayName = SelectPrimitive.Separator.displayName
 
 export {
-  Select,
-  SelectGroup,
-  SelectValue,
-  SelectTrigger,
-  SelectContent,
-  SelectLabel,
-  SelectItem,
-  SelectSeparator,
-  SelectScrollUpButton,
-  SelectScrollDownButton,
-}
+Select,SelectContent,SelectGroup,SelectItem,SelectLabel,SelectScrollDownButton,SelectScrollUpButton,SelectSeparator,SelectTrigger,SelectValue
+}

components/ui/sort-dropdown.tsx

@@ -1,7 +1,7 @@
+import { Calendar,CalendarClock,Check,ChevronDown,ChevronUp,SortAsc,SortDesc } from 'lucide-react';
 import React from 'react';
-import { Check, ChevronDown, ChevronUp, SortAsc, SortDesc, Calendar, CalendarClock } from 'lucide-react';
 import { Button } from './button';
-import { Dropdown, DropdownContent, DropdownTrigger } from './dropdown';
+import { Dropdown,DropdownContent,DropdownTrigger } from './dropdown';
 
 export type SortMode = 'az' | 'za' | 'newest' | 'oldest';
 

components/ui/tabs.tsx

@@ -1,5 +1,5 @@
-import * as React from "react"
 import * as TabsPrimitive from "@radix-ui/react-tabs"
+import * as React from "react"
 
 import { cn } from "../../lib/utils"
 
@@ -50,4 +50,4 @@ const TabsContent = React.forwardRef<
 ))
 TabsContent.displayName = TabsPrimitive.Content.displayName
 
-export { Tabs, TabsList, TabsTrigger, TabsContent }
+export { Tabs,TabsContent,TabsList,TabsTrigger }

components/ui/tag-filter-dropdown.tsx

@@ -1,10 +1,10 @@
+import { Check,ChevronDown,ChevronUp,Pencil,Search,Tag,Trash2,X } from 'lucide-react';
 import React from 'react';
-import { Check, ChevronDown, ChevronUp, Tag, Search, Pencil, Trash2, X } from 'lucide-react';
-import { Button } from './button';
-import { Input } from './input';
-import { Dropdown, DropdownContent, DropdownTrigger } from './dropdown';
-import { ScrollArea } from './scroll-area';
 import { cn } from '../../lib/utils';
+import { Button } from './button';
+import { Dropdown,DropdownContent,DropdownTrigger } from './dropdown';
+import { Input } from './input';
+import { ScrollArea } from './scroll-area';
 
 interface TagFilterDropdownProps {
     allTags: string[];

components/ui/textarea.tsx

@@ -20,4 +20,4 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
 )
 Textarea.displayName = "Textarea"
 
-export { Textarea }
+export { Textarea }

components/ui/toast.tsx

@@ -1,6 +1,6 @@
-import React, { createContext, useContext, useState, useCallback, useEffect } from 'react';
+import { AlertCircle,AlertTriangle,CheckCircle,Info,X } from 'lucide-react';
+import React,{ createContext,useCallback,useContext,useEffect,useState } from 'react';
 import { cn } from '../../lib/utils';
-import { X, AlertCircle, CheckCircle, Info, AlertTriangle } from 'lucide-react';
 
 export type ToastType = 'success' | 'error' | 'warning' | 'info';
 

domain/workspace.ts

@@ -1,4 +1,4 @@
-import { Workspace, WorkspaceNode, WorkspaceViewMode } from './models';
+import { Workspace,WorkspaceNode,WorkspaceViewMode } from './models';
 
 export type SplitDirection = 'horizontal' | 'vertical';
 export type SplitPosition = 'left' | 'right' | 'top' | 'bottom';

global.d.ts

@@ -1,4 +1,4 @@
-import type { TerminalSession, RemoteFile } from "./types";
+import type { RemoteFile } from "./types";
 
 // Proxy configuration for SSH connections
 interface NebulaProxyConfig {
@@ -236,4 +236,4 @@ declare global {
   }
 }
 
-export {};
+export { };

index.tsx

@@ -1,4 +1,3 @@
-import React from 'react';
 import ReactDOM from 'react-dom/client';
 import App from './App';
 

infrastructure/config/defaultData.ts

@@ -1,4 +1,4 @@
-import { Host, Snippet } from '../../domain/models';
+import { Host,Snippet } from '../../domain/models';
 
 export const INITIAL_HOSTS: Host[] = [
   { id: '1', label: 'Production Web', hostname: '10.0.0.12', port: 22, username: 'ubuntu', group: 'AWS/Production', tags: ['prod', 'web'], os: 'linux' },

infrastructure/services/portForwardingService.ts

@@ -4,7 +4,7 @@
  * for establishing and managing SSH port forwarding tunnels.
  */
 
-import { PortForwardingRule, PortForwardingType, Host } from '../../domain/models';
+import { Host,PortForwardingRule } from '../../domain/models';
 
 export interface PortForwardingConnection {
   ruleId: string;

infrastructure/services/syncService.ts

@@ -1,4 +1,4 @@
-import { Host, SSHKey, Snippet } from '../../domain/models';
+import { Host,SSHKey,Snippet } from '../../domain/models';
 
 interface BackupData {
   hosts: Host[];

lib/utils.ts

@@ -1,4 +1,4 @@
-import { type ClassValue, clsx } from "clsx"
+import { type ClassValue,clsx } from "clsx"
 import { twMerge } from "tailwind-merge"
 
 export function cn(...inputs: ClassValue[]) {

package.json

@@ -11,7 +11,9 @@
     "preview": "vite preview",
     "start": "node electron/launch.cjs",
     "postinstall": "npx @electron/rebuild",
-    "rebuild": "npx @electron/rebuild"
+    "rebuild": "npx @electron/rebuild",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix"
   },
   "dependencies": {
     "@google/genai": "1.31.0",
@@ -37,11 +39,17 @@
   },
   "devDependencies": {
     "@electron/rebuild": "^4.0.1",
+    "@eslint/js": "^9.39.1",
     "@types/node": "^22.14.0",
+    "@typescript-eslint/eslint-plugin": "^8.49.0",
+    "@typescript-eslint/parser": "^8.49.0",
     "@vitejs/plugin-react": "^5.0.0",
     "concurrently": "^9.1.0",
     "cross-env": "^7.0.3",
     "electron": "^31.7.7",
+    "eslint": "^9.39.1",
+    "eslint-plugin-react-hooks": "^7.0.1",
+    "eslint-plugin-unused-imports": "^4.3.0",
     "typescript": "~5.8.2",
     "vite": "^6.2.0",
     "wait-on": "^7.2.0"

vite.config.ts

@@ -1,6 +1,6 @@
-import path from 'path';
-import { defineConfig, loadEnv } from 'vite';
 import react from '@vitejs/plugin-react';
+import path from 'path';
+import { defineConfig,loadEnv } from 'vite';
 
 export default defineConfig(({ mode }) => {
     const env = loadEnv(mode, '.', '');