fix: imports

frontend/src/app/canvas/CanvasRoute.tsx

@@ -5,7 +5,7 @@
 import React, { useEffect } from 'react'
 import { useParams } from 'react-router-dom'
 import { CanvasPage } from './CanvasPage'
-import { usePlatform } from '../kosmos/KosmosContext'
+import { usePlatform } from '@/app/kosmos/KosmosContext'
 
 export function CanvasRoute() {
   const { projectId } = useParams<{ projectId: string }>()

frontend/src/app/kosmos/KosmosContext.tsx

@@ -5,8 +5,8 @@
 
 import React, { createContext, useCallback, useContext, useMemo, useState } from 'react'
 import type { Project } from './types'
-import { saveGraphToStorage } from '../pleroma/projectGraphStorage'
+import { saveGraphToStorage } from '@/app/pleroma/projectGraphStorage'
-import { PROJECT_VERSION } from '../pleroma/projectGraphStorage'
+import { PROJECT_VERSION } from '@/app/pleroma/projectGraphStorage'
 
 const STORAGE_KEY = 'zui_platform_projects'
 const ORDER_STORAGE_KEY = 'zui_platform_project_order'

frontend/src/app/kosmos/KosmosSidebar.tsx

@@ -21,7 +21,7 @@ import { Plus, Settings, Triangle } from 'lucide-react'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
 import { useSidebar } from '@/components/ui/sidebar'
 import { usePlatform } from './KosmosContext'
-import { getProjectIcon } from '../../lib/iconMap'
+import { getProjectIcon } from '@/lib/iconMap'
 import { NewProjectDialog } from './NewProjectDialog'
 import { SettingsDialog } from './SettingsDialog'
 import type { Project } from './types'

frontend/src/app/kosmos/NewProjectDialog.tsx

@@ -17,7 +17,7 @@ import { Input } from '@/components/ui/input'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
 import { Plus } from 'lucide-react'
 import { PROJECT_ICON_IDS, type Project, type ProjectIconId } from './types'
-import { getProjectIcon } from '../../lib/iconMap'
+import { getProjectIcon } from '@/lib/iconMap'
 
 type NewProjectDialogProps = {
   onCreate: (project: Project) => void

frontend/src/app/pleroma/PleromaPage.tsx

@@ -55,8 +55,8 @@ import {
   Copy,
 } from 'lucide-react'
 import { Checkbox } from '@/components/ui/checkbox'
-import { usePlatform } from '../kosmos/KosmosContext'
+import { usePlatform } from '@/app/kosmos/KosmosContext'
-import { getProjectIcon } from '../../lib/iconMap'
+import { getProjectIcon } from '@/lib/iconMap'
 import {
   loadGraphFromStorage,
   saveGraphToStorage,
@@ -65,9 +65,9 @@ import {
   PROJECT_VERSION,
 } from './projectGraphStorage'
 import { toast } from 'sonner'
-import { NewProjectDialog } from '../kosmos/NewProjectDialog'
+import { NewProjectDialog } from '@/app/kosmos/NewProjectDialog'
 import { ProjectsPageBackground } from './ProjectsPageBackground'
-import type { Project } from '../kosmos/types'
+import type { Project } from '@/app/kosmos/types'
 
 const PAGE_SIZE_OPTIONS = [10, 25, 50] as const
 type SortKey = 'lastEdited' | 'name' | 'created'

frontend/src/components/graph/AnimatedEdge.tsx

@@ -4,9 +4,9 @@ import {
   getBezierPath,
   type EdgeProps,
 } from '@xyflow/react'
-import FlowContext from '../../lib/graph/flowContext'
+import FlowContext from '@/lib/graph/flowContext'
-import { getConnectionStatus, CONNECTION_STATUS_CLASS } from '../../lib/connectionStatus'
+import { getConnectionStatus, CONNECTION_STATUS_CLASS } from '@/lib/graph/connectionStatus'
-import { getConnectionLabelForTarget } from '../../lib/graph/nodeRegistry'
+import { getConnectionLabelForTarget } from '@/lib/graph/nodeRegistry'
 
 const EDGE_STROKE_WIDTH = 2
 const DOT_MARKER_R = 1.5

frontend/src/components/graph/NodeFooterEdgeIndicators.tsx

@@ -1,8 +1,8 @@
 import React, { useContext, useMemo } from 'react'
-import FlowContext from '../../lib/graph/flowContext'
+import FlowContext from '@/lib/graph/flowContext'
 import { ArrowDownLeft, ArrowUpRight } from 'lucide-react'
-import { NodeHelpPopover } from './NodeHelpPopover'
+import { NodeHelpPopover } from '@/components/graph/NodeHelpPopover'
-import { getNodeType, getNodeClassificationLabel } from '../../lib/graph/nodeRegistry'
+import { getNodeType, getNodeClassificationLabel } from '@/lib/graph/nodeRegistry'
 
 type Props = {
     nodeId: string

frontend/src/components/graph/NodeHeaderTitle.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useContext, useEffect, useRef, useState } from 'react'
-import FlowContext from '../../lib/graph/flowContext'
+import FlowContext from '@/lib/graph/flowContext'
-import type { AppNode } from '../../lib/graph/nodeTypes'
+import type { AppNode } from '@/lib/graph/nodeTypes'
-import { replaceNodeIdInGraph } from '../../lib/graph/flowUtils'
+import { replaceNodeIdInGraph } from '@/lib/graph/flowUtils'
 
 type Props = {
     nodeId: string

frontend/src/components/graph/NodeHelpPopover.tsx

@@ -1,8 +1,8 @@
 import React from 'react'
 import { HelpCircle } from 'lucide-react'
-import { Popover, PopoverContent, PopoverTrigger } from '../ui/popover'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
-import { getNodeHelp } from '../../lib/graph/nodeRegistry'
+import { getNodeHelp } from '@/lib/graph/nodeRegistry'
-import { cn } from '../../lib/utils'
+import { cn } from '@/lib/utils'
 
 type Props = {
     nodeType: string

frontend/src/components/graph/NodeMenubar.tsx

@@ -1,5 +1,5 @@
 import React, { useCallback, useContext } from 'react'
-import FlowContext from '../../lib/graph/flowContext'
+import FlowContext from '@/lib/graph/flowContext'
 import {
     Menubar,
     MenubarContent,
@@ -11,8 +11,8 @@ import {
     MenubarSubContent,
     MenubarSubTrigger,
     MenubarTrigger,
-} from '../ui/menubar'
+} from '@/components/ui/menubar'
-import { Kbd } from '../ui/kbd'
+import { Kbd } from '@/components/ui/kbd'
 type Props = {
     nodeId: string
     nodeType: string

frontend/src/components/nodes/config/ConfigNode.tsx

@@ -20,6 +20,8 @@ import {
     getConfigTypeId,
     isGroup,
     type ConfigTypeId,
+    type InsertBlockGroup,
+    type InsertBlock,
 } from '@/lib/graph/configTypes'
 import {
     BaseNode,
@@ -192,13 +194,13 @@ function ConfigNodeComponent({ id, data, width, height, selected }: Props) {
 
     const insertBlocksContent = useMemo(() => {
         const templatingGroup = configType.insertBlocks.find(
-            (b): b is import('../../lib/configTypes').InsertBlockGroup => isGroup(b) && b.label === 'Templating'
+            (b): b is InsertBlockGroup => isGroup(b) && b.label === 'Templating'
         )
         const typeBlocks = configType.insertBlocks.filter((b) => !(isGroup(b) && b.label === 'Templating'))
         const insertShortcut = <MenubarShortcut className="opacity-0 group-hover:opacity-100 transition-opacity"><Kbd>Insert</Kbd></MenubarShortcut>
         const typeItems = typeBlocks.flatMap((block) =>
             isGroup(block)
-                ? block.items.map(({ label, snippet }) => (
+                ? block.items.map(({ label, snippet }: InsertBlock) => (
                     <MenubarItem
                         key={label}
                         className="text-xs flex items-center group"
@@ -220,7 +222,7 @@ function ConfigNodeComponent({ id, data, width, height, selected }: Props) {
                 ]
         )
         const templatingItems =
-            templatingGroup?.items.map(({ label, snippet }) => (
+            templatingGroup?.items.map(({ label, snippet }: InsertBlock) => (
                 <MenubarItem
                     key={label}
                     className="text-xs flex items-center group"

frontend/src/lib/iconMap.tsx

@@ -18,7 +18,7 @@ import {
   Turtle,
   type LucideIcon,
 } from 'lucide-react'
-import type { ProjectIconId } from '../app/kosmos/types'
+import type { ProjectIconId } from '@/app/kosmos/types'
 
 export const PROJECT_ICON_MAP: Record<ProjectIconId, LucideIcon> = {
   bird: Bird,