fix: standardize icons on phosphor

src/components/AddPropertyForm.tsx

@@ -1,10 +1,10 @@
+import { CalendarBlank as CalendarIcon, Check, X } from '@phosphor-icons/react'
 import { useState } from 'react'
 import { Button } from '@/components/ui/button'
 import { Calendar } from '@/components/ui/calendar'
 import { Input } from '@/components/ui/input'
 import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from '@/components/ui/select'
-import { CalendarIcon, Check, X } from 'lucide-react'
 import {
   type PropertyDisplayMode,
   formatDateValue,

src/components/AiAgentsOnboardingPrompt.tsx

@@ -1,4 +1,4 @@
-import { ArrowUpRight, Bot, CheckCircle2, Cloud, HardDrive, Loader2, Terminal } from 'lucide-react'
+import { ArrowUpRight, CheckCircle as CheckCircle2, CircleNotch as Loader2, Cloud, HardDrive, Robot as Bot, Terminal } from '@phosphor-icons/react'
 import {
   AI_AGENT_DEFINITIONS,
   getAiAgentDefinition,

src/components/ClaudeCodeOnboardingPrompt.tsx

@@ -1,4 +1,4 @@
-import { ArrowUpRight, Bot, CheckCircle2, Loader2 } from 'lucide-react'
+import { ArrowUpRight, CheckCircle as CheckCircle2, CircleNotch as Loader2, Robot as Bot } from '@phosphor-icons/react'
 import type { ClaudeCodeStatus } from '../hooks/useClaudeCodeStatus'
 import { openExternalUrl } from '../utils/url'
 import { Button } from './ui/button'

src/components/ConflictNoteBanner.tsx

@@ -1,4 +1,4 @@
-import { AlertTriangle } from 'lucide-react'
+import { Warning as AlertTriangle } from '@phosphor-icons/react'
 import { translate, type AppLocale } from '../lib/i18n'
 
 interface ConflictNoteBannerProps {

src/components/ConflictResolverModal.tsx

@@ -1,7 +1,7 @@
+import { Check, CircleNotch as Loader2, FileText, Warning as AlertTriangle } from '@phosphor-icons/react'
 import { useCallback, useEffect, useRef, useState, type KeyboardEvent } from 'react'
-import { Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, DialogDescription } from '@/components/ui/dialog'
 import { Button } from '@/components/ui/button'
-import { AlertTriangle, FileText, Check, Loader2 } from 'lucide-react'
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from '@/components/ui/dialog'
 import type { ConflictFileState } from '../hooks/useConflictResolver'
 import { cn } from '@/lib/utils'
 

src/components/DeleteProgressNotice.tsx

@@ -1,5 +1,5 @@
+import { CircleNotch as Loader2 } from '@phosphor-icons/react'
 import { memo } from 'react'
-import { Loader2 } from 'lucide-react'
 import { cn } from '@/lib/utils'
 
 interface DeleteProgressNoticeProps {

src/components/FeedbackDialog.tsx

@@ -1,6 +1,5 @@
+import { ArrowUpRight, Bug, Chats as MessagesSquare, Check, Copy, GitPullRequest, Lightbulb, Megaphone, Newspaper } from '@phosphor-icons/react'
 import { type ReactNode, useEffect, useLayoutEffect, useMemo, useRef, useState } from 'react'
-import { Megaphone } from '@phosphor-icons/react'
-import { ArrowUpRight, Bug, Check, Copy, GitPullRequest, Lightbulb, MessagesSquare, Newspaper } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import {
   Card,

src/components/GitRequiredModal.tsx

@@ -1,5 +1,5 @@
+import { GitBranch } from '@phosphor-icons/react'
 import { useState } from 'react'
-import { GitBranch } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import {
   Dialog,

src/components/McpSetupDialog.tsx

@@ -1,5 +1,5 @@
+import { Copy, ShieldCheck } from '@phosphor-icons/react'
 import { useEffect } from 'react'
-import { Copy, ShieldCheck } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import {
   Dialog,

src/components/MermaidDiagram.tsx

@@ -1,5 +1,5 @@
+import { ArrowsOut as Maximize2 } from '@phosphor-icons/react'
 import { useEffect, useId, useMemo, useState } from 'react'
-import { Maximize2 } from 'lucide-react'
 import { Button } from '@/components/ui/button'
 import {
   Dialog,

src/components/PropertyValueCells.tsx

@@ -1,17 +1,14 @@
+import { ArrowUpRight, X as XIcon } from '@phosphor-icons/react'
 import { useState, useCallback, useRef, type ReactNode } from 'react'
 import { createPortal } from 'react-dom'
-import { ArrowUpRight } from '@phosphor-icons/react'
-import type { FrontmatterValue } from './Inspector'
-import { EditableValue, TagPillList, UrlValue } from './EditableValue'
-import { isUrlValue } from '../utils/url'
 import { Button } from '@/components/ui/button'
 import { Calendar } from '@/components/ui/calendar'
 import { Input } from '@/components/ui/input'
 import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
-import { XIcon } from 'lucide-react'
 import { trackDatePropertyDirectEntrySaved } from '../lib/productAnalytics'
 import { translate, type AppLocale } from '../lib/i18n'
 import { isValidCssColor } from '../utils/colorUtils'
+import { isUrlValue } from '../utils/url'
 import {
   type PropertyDisplayMode,
   formatDateValue,
@@ -20,6 +17,8 @@ import {
   DISPLAY_MODE_ICONS,
 } from '../utils/propertyTypes'
 import { StatusDropdown } from './StatusDropdown'
+import type { FrontmatterValue } from './Inspector'
+import { EditableValue, TagPillList, UrlValue } from './EditableValue'
 import { getStatusStyle } from '../utils/statusStyles'
 import { TagsDropdown } from './TagsDropdown'
 import { getTagStyle } from '../utils/tagStyles'

src/components/RawEditorFindBar.tsx

@@ -1,5 +1,5 @@
+import { CaretDown as ChevronDown, CaretRight as ChevronRight, CaretUp as ChevronUp, X } from '@phosphor-icons/react'
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
-import { ChevronDown, ChevronRight, ChevronUp, X } from 'lucide-react'
 import { EditorView } from '@codemirror/view'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/components/ui/input'

src/components/SettingsBodyNav.tsx

@@ -1,4 +1,5 @@
-import { Bot, Folder, GitBranch, ListChecks, Palette, RefreshCw, ShieldCheck } from 'lucide-react'
+import { Article, ArrowsClockwise as RefreshCw, Cube, GitBranch, ListChecks, Palette, Robot as Bot, ShieldCheck, type IconProps } from '@phosphor-icons/react'
+import type { ComponentType } from 'react'
 import type { TranslationKey } from '../lib/i18n'
 import { Button } from './ui/button'
 import { SETTINGS_SECTION_IDS } from './settingsSectionIds'
@@ -7,13 +8,19 @@ interface SettingsBodyNavProps {
   t: (key: TranslationKey) => string
 }
 
+interface SettingsNavItem {
+  id: string
+  label: string
+  Icon: ComponentType<IconProps>
+}
+
 export function SettingsBodyNav({ t }: SettingsBodyNavProps) {
-  const items = [
+  const items: SettingsNavItem[] = [
     { id: SETTINGS_SECTION_IDS.sync, label: t('settings.sync.title'), Icon: RefreshCw },
-    { id: SETTINGS_SECTION_IDS.workspaces, label: t('settings.workspaces.title'), Icon: Folder },
+    { id: SETTINGS_SECTION_IDS.workspaces, label: t('settings.workspaces.title'), Icon: Cube },
     { id: SETTINGS_SECTION_IDS.autogit, label: t('settings.autogit.title'), Icon: GitBranch },
     { id: SETTINGS_SECTION_IDS.appearance, label: t('settings.appearance.title'), Icon: Palette },
-    { id: SETTINGS_SECTION_IDS.content, label: t('settings.vaultContent.title'), Icon: Folder },
+    { id: SETTINGS_SECTION_IDS.content, label: t('settings.vaultContent.title'), Icon: Article },
     { id: SETTINGS_SECTION_IDS.ai, label: t('settings.aiAgents.title'), Icon: Bot },
     { id: SETTINGS_SECTION_IDS.workflow, label: t('settings.workflow.title'), Icon: ListChecks },
     { id: SETTINGS_SECTION_IDS.privacy, label: t('settings.privacy.title'), Icon: ShieldCheck },
@@ -31,7 +38,7 @@ export function SettingsBodyNav({ t }: SettingsBodyNavProps) {
             className="h-10 w-full justify-start gap-2.5 px-2.5 text-sm font-medium text-muted-foreground hover:text-foreground"
             onClick={() => document.getElementById(item.id)?.scrollIntoView({ block: 'start', behavior: 'smooth' })}
           >
-            <item.Icon size={16} className="shrink-0" />
+            <item.Icon size={16} weight="regular" className="shrink-0" />
             <span className="truncate">{item.label}</span>
           </Button>
         ))}

src/components/SettingsControls.tsx

@@ -35,13 +35,16 @@ export function SettingsSection({
 }
 
 export function SectionHeading({
+  icon,
   title,
 }: {
+  icon?: ReactNode
   title: string
   description?: string
 }) {
   return (
-    <div>
+    <div className="flex items-center gap-2">
+      {icon ? <span className="flex size-5 items-center justify-center text-muted-foreground">{icon}</span> : null}
       <div
         style={{
           fontSize: 14,

src/components/SettingsPanel.tsx

@@ -1,3 +1,4 @@
+import { Copy, Cube, Monitor, Moon, Sun, X } from '@phosphor-icons/react'
 import {
   AI_AGENT_DEFINITIONS,
   createMissingAiAgentsStatus,
@@ -14,16 +15,14 @@ import {
   type AiModelProvider,
 } from '../lib/aiTargets'
 import {
-  useState,
-  useRef,
   useCallback,
   useEffect,
+  useRef,
+  useState,
   type KeyboardEvent as ReactKeyboardEvent,
   type MouseEvent as ReactMouseEvent,
   type ReactNode,
 } from 'react'
-import { Moon, Sun, X } from '@phosphor-icons/react'
-import { Copy, Monitor } from 'lucide-react'
 import type { Settings } from '../types'
 import {
   APP_LOCALES,
@@ -638,7 +637,10 @@ function SettingsSyncAndAppearanceSections({
         />
       </SettingsSection>
       <SettingsSection id={SETTINGS_SECTION_IDS.workspaces}>
-        <SectionHeading title={t('settings.workspaces.title')} />
+        <SectionHeading
+          icon={<Cube size={16} aria-hidden="true" />}
+          title={t('settings.workspaces.title')}
+        />
         <WorkspaceSettingsSection
           defaultWorkspacePath={defaultWorkspacePath}
           enabled={multiWorkspaceEnabled}

src/components/SingleEditorView.tsx

@@ -1,9 +1,7 @@
-import { Component, useEffect, useCallback, useMemo, useRef, useContext, useState, type ReactNode } from 'react'
+import { ArrowSquareOut as ExternalLink, Copy } from '@phosphor-icons/react'
+import { Component, useCallback, useContext, useEffect, useMemo, useRef, useState, type ReactNode } from 'react'
 import { invoke } from '@tauri-apps/api/core'
-import { trackEvent } from '../lib/telemetry'
 import {
-  useCreateBlockNote,
-  SuggestionMenuController,
   BlockNoteViewRaw,
   ComponentsContext,
   DeleteLinkButton,
@@ -11,14 +9,15 @@ import {
   LinkToolbar,
   LinkToolbarController,
   SideMenuController,
+  SuggestionMenuController,
   useComponentsContext,
+  useCreateBlockNote,
   useDictionary,
   type LinkToolbarProps,
 } from '@blocknote/react'
 import { components } from '@blocknote/mantine'
 import { MantineContext, MantineProvider } from '@mantine/core'
-import { Copy } from '@phosphor-icons/react'
-import { ExternalLink } from 'lucide-react'
+import { trackEvent } from '../lib/telemetry'
 import { useDocumentThemeMode } from '../hooks/useDocumentThemeMode'
 import { repairMalformedEditorBlocks } from '../hooks/editorBlockRepair'
 import { useEditorTheme } from '../hooks/useTheme'

src/components/UpdateBanner.tsx

@@ -1,5 +1,5 @@
 import type { CSSProperties } from 'react'
-import { Download, ExternalLink, RefreshCw, X } from 'lucide-react'
+import { ArrowSquareOut as ExternalLink, ArrowsClockwise as RefreshCw, Download, X } from '@phosphor-icons/react'
 import type { UpdateStatus, UpdateActions } from '../hooks/useUpdater'
 import { restartApp } from '../hooks/useUpdater'
 import { Button } from './ui/button'

src/components/VaultContentSettingsSection.tsx

@@ -1,3 +1,4 @@
+import { Article } from '@phosphor-icons/react'
 import type { TranslationKey, TranslationValues } from '../lib/i18n'
 import type { NoteWidthMode } from '../types'
 import type { AllNotesFileVisibility } from '../utils/allNotesFileVisibility'
@@ -76,6 +77,7 @@ export function VaultContentSettingsSection({
   return (
     <>
       <SectionHeading
+        icon={<Article size={16} aria-hidden="true" />}
         title={t('settings.vaultContent.title')}
       />
 

src/components/WelcomeScreen.tsx

@@ -1,6 +1,6 @@
+import { CircleNotch as Loader2, FolderOpen, Plus, Rocket, Warning as AlertTriangle } from '@phosphor-icons/react'
 import { useEffect, useMemo, useRef, useState } from 'react'
 import type { ReactNode } from 'react'
-import { FolderOpen, Plus, AlertTriangle, Loader2, Rocket } from 'lucide-react'
 import { OnboardingShell } from './OnboardingShell'
 import { Button } from '@/components/ui/button'
 import tolariaIcon from '@/assets/tolaria-icon.svg'

src/components/WorkspaceSelector.tsx

@@ -1,4 +1,4 @@
-import { CaretUpDown, Check } from '@phosphor-icons/react'
+import { CaretUpDown, Check, Cube } from '@phosphor-icons/react'
 import { useEffect, useId, useMemo, useRef, useState, type KeyboardEvent, type PointerEvent } from 'react'
 import type { WorkspaceIdentity } from '../types'
 import { Button } from '@/components/ui/button'
@@ -9,6 +9,7 @@ import { translate, type AppLocale } from '../lib/i18n'
 import { PROPERTY_CHIP_STYLE } from './propertyChipStyles'
 import {
   PROPERTY_PANEL_LABEL_CLASS_NAME,
+  PROPERTY_PANEL_LABEL_ICON_SLOT_CLASS_NAME,
   PROPERTY_PANEL_ROW_STYLE,
 } from './propertyPanelLayout'
 
@@ -95,6 +96,12 @@ function reportWorkspaceChangeFailure(error: unknown) {
 function WorkspaceRowLabel({ locale }: { locale: AppLocale }) {
   return (
     <span className={PROPERTY_PANEL_LABEL_CLASS_NAME}>
+      <span
+        className={PROPERTY_PANEL_LABEL_ICON_SLOT_CLASS_NAME}
+        data-testid="workspace-row-icon-slot"
+      >
+        <Cube size={14} className="shrink-0" data-testid="workspace-row-icon" />
+      </span>
       <span className="min-w-0 truncate">{translate(locale, 'inspector.properties.workspace')}</span>
     </span>
   )

src/components/WorkspaceSettingsSection.tsx

@@ -1,5 +1,4 @@
-import { Info } from '@phosphor-icons/react'
-import { Trash2 } from 'lucide-react'
+import { Info, Trash as Trash2 } from '@phosphor-icons/react'
 import { type KeyboardEvent, useState } from 'react'
 import { Button } from './ui/button'
 import { Input } from './ui/input'

src/components/note-list/NoteListHeader.tsx

@@ -1,5 +1,4 @@
-import { MagnifyingGlass, Plus, SidebarSimple } from '@phosphor-icons/react'
-import { Loader2 } from 'lucide-react'
+import { CircleNotch as Loader2, MagnifyingGlass, Plus, SidebarSimple } from '@phosphor-icons/react'
 import type { VaultEntry } from '../../types'
 import type { SortOption, SortDirection } from '../../utils/noteListHelpers'
 import { translate, type AppLocale } from '../../lib/i18n'

src/components/propertyPanelLayout.test.tsx

@@ -39,6 +39,32 @@ const entry: VaultEntry = {
   sidebarLabel: null,
 }
 
+const personalWorkspace = {
+  id: 'personal',
+  label: 'Personal',
+  alias: 'personal',
+  path: '/personal',
+  shortLabel: 'PE',
+  color: 'green',
+  icon: null,
+  mounted: true,
+  available: true,
+  defaultForNewNotes: true,
+}
+
+const teamWorkspace = {
+  id: 'team',
+  label: 'Team',
+  alias: 'team',
+  path: '/team',
+  shortLabel: 'TE',
+  color: 'purple',
+  icon: null,
+  mounted: true,
+  available: true,
+  defaultForNewNotes: false,
+}
+
 function renderPropertiesPanel(props: ComponentProps<typeof DynamicPropertiesPanel>) {
   return render(
     <TooltipProvider>
@@ -86,14 +112,17 @@ describe('property panel shared grid layout', () => {
     expect(row.style.gridColumn).toBe('1 / -1')
   })
 
-  it('uses the same fixed icon slot size for type, suggested, and add-property rows', () => {
+  it('uses the same fixed icon slot size for metadata, suggested, and add-property rows', () => {
     renderPropertiesPanel({
-      entry,
+      entry: { ...entry, workspace: personalWorkspace },
       frontmatter: {},
       onAddProperty: vi.fn(),
       onUpdateProperty: vi.fn(),
+      onChangeWorkspace: vi.fn(),
+      workspaces: [personalWorkspace, teamWorkspace],
     })
 
+    expect(screen.getByTestId('workspace-row-icon-slot')).toHaveClass('size-5')
     expect(screen.getByTestId('type-row-icon-slot')).toHaveClass('size-5')
     screen.getAllByTestId('suggested-property-icon-slot').forEach((slot) => {
       expect(slot).toHaveClass('size-5')

src/components/sidebar/SidebarLoadingSections.tsx

@@ -1,6 +1,5 @@
 import type { MouseEvent, ReactNode } from 'react'
-import { Folder, Funnel, Plus } from '@phosphor-icons/react'
-import { SlidersHorizontal } from 'lucide-react'
+import { Folder, Funnel, Plus, SlidersHorizontal } from '@phosphor-icons/react'
 import { Button } from '@/components/ui/button'
 import { translate, type AppLocale } from '../../lib/i18n'
 import { SidebarGroupHeader } from './SidebarGroupHeader'

src/components/sidebar/SidebarSections.tsx

@@ -11,9 +11,8 @@ import {
   SortableContext, useSortable, verticalListSortingStrategy,
 } from '@dnd-kit/sortable'
 import { CSS } from '@dnd-kit/utilities'
-import { SlidersHorizontal } from 'lucide-react'
 import {
-  ArrowLeft, ArrowRight, Palette, PencilSimple, Plus, SidebarSimple, Trash,
+  ArrowLeft, ArrowRight, Palette, PencilSimple, Plus, SidebarSimple, SlidersHorizontal, Trash,
 } from '@phosphor-icons/react'
 import { APP_COMMAND_IDS, getAppCommandShortcutDisplay } from '../../hooks/appCommandCatalog'
 import { Button } from '@/components/ui/button'

src/components/status-bar/AiAgentsBadge.tsx

@@ -1,5 +1,4 @@
-import { AlertTriangle, ChevronsUpDown } from 'lucide-react'
-import { Sparkle } from '@phosphor-icons/react'
+import { CaretUpDown as ChevronsUpDown, Sparkle, Warning as AlertTriangle } from '@phosphor-icons/react'
 import { Button } from '@/components/ui/button'
 import {
   AI_AGENT_DEFINITIONS,
@@ -327,7 +326,7 @@ export function AiAgentsBadge({
             data-testid="status-ai-agents"
           >
             <span style={{ ...ICON_STYLE, color: showWarning ? 'var(--accent-orange)' : 'var(--muted-foreground)' }}>
-              <Sparkle size={13} weight="fill" />
+              <Sparkle size={13} weight="regular" />
               {!compact && (selectedTarget.kind === 'api_model' ? selectedTarget.shortLabel : triggerLabel(defaultAgent))}
               <TriggerStateIcon showWarning={showWarning} showSwitcherCue={showSwitcherCue} />
             </span>

src/components/status-bar/StatusBarBadges.tsx

@@ -1,15 +1,5 @@
+import { ArrowDown, ArrowsClockwise as RefreshCw, CircleNotch as Loader2, Cpu, GitBranch, GitCommit as GitCommitHorizontal, GitDiff, Pulse, Terminal, Warning as AlertTriangle } from '@phosphor-icons/react'
 import { useRef, useState, type CSSProperties, type KeyboardEvent as ReactKeyboardEvent, type ReactNode } from 'react'
-import {
-  AlertTriangle,
-  ArrowDown,
-  Cpu,
-  GitBranch,
-  GitCommitHorizontal,
-  Loader2,
-  RefreshCw,
-  Terminal,
-} from 'lucide-react'
-import { GitDiff, Pulse } from '@phosphor-icons/react'
 import { ActionTooltip, type ActionTooltipCopy } from '@/components/ui/action-tooltip'
 import { Button } from '@/components/ui/button'
 import { cn } from '@/lib/utils'

src/components/status-bar/StatusBarSections.tsx

@@ -1,5 +1,4 @@
-import { BookOpen, Moon, Package, Settings, Sun } from 'lucide-react'
-import { Megaphone } from '@phosphor-icons/react'
+import { BookOpen, GearSix as Settings, Megaphone, Moon, Package, Sun, type IconProps } from '@phosphor-icons/react'
 import type { ComponentType, MouseEventHandler } from 'react'
 import type { AiAgentId, AiAgentsStatus } from '../../lib/aiAgents'
 import type { AiModelProvider } from '../../lib/aiTargets'
@@ -132,7 +131,7 @@ function BuildNumberButton({
         data-testid="status-build-number"
       >
         <span style={ICON_STYLE}>
-          <Package size={13} />
+          <Package size={13} weight="regular" />
           {compact ? null : buildNumber ?? translate(locale, 'status.build.unknown')}
         </span>
       </Button>
@@ -301,7 +300,7 @@ function StatusBarPrimaryBadges({
 
 type StatusLinkButtonProps = {
   compact: boolean
-  icon: ComponentType<{ size?: number }>
+  icon: ComponentType<IconProps>
   labelKey: TranslationKey
   locale: AppLocale
   onClick: MouseEventHandler<HTMLButtonElement>
@@ -333,7 +332,7 @@ function StatusLinkButton({
         aria-label={translate(locale, tooltipKey)}
         data-testid={testId}
       >
-        <Icon size={14} />
+        <Icon size={14} weight="regular" />
         {compact ? null : translate(locale, labelKey)}
       </Button>
     </ActionTooltip>
@@ -584,7 +583,7 @@ export function StatusBarSecondarySection({
           aria-label={themeTooltip.label}
           data-testid="status-theme-mode"
         >
-          <ThemeIcon size={14} />
+          <ThemeIcon size={14} weight="regular" />
         </Button>
       </ActionTooltip>
       <ActionTooltip copy={{ label: translate(locale, 'status.settings.open'), ...SETTINGS_SHORTCUT }} side="top" align="end">
@@ -597,7 +596,7 @@ export function StatusBarSecondarySection({
           aria-label={translate(locale, 'status.settings.open')}
           data-testid="status-settings"
         >
-          <Settings size={14} />
+          <Settings size={14} weight="regular" />
         </Button>
       </ActionTooltip>
     </div>

src/components/status-bar/VaultMenu.tsx

@@ -1,6 +1,6 @@
+import { Check, Cube, FolderOpen, GitBranch, Plus, Rocket, Warning as AlertTriangle, X } from '@phosphor-icons/react'
 import { useMemo, useRef, useState } from 'react'
 import type { ReactNode } from 'react'
-import { AlertTriangle, Check, FolderOpen, GitBranch, Plus, Rocket, X } from 'lucide-react'
 import { ActionTooltip } from '@/components/ui/action-tooltip'
 import { Button } from '@/components/ui/button'
 import { Checkbox } from '@/components/ui/checkbox'
@@ -416,7 +416,7 @@ export function VaultMenu(props: VaultMenuProps) {
           aria-label={translate(locale, 'status.vault.switch')}
           data-testid="status-vault-trigger"
         >
-          <FolderOpen size={13} />
+          <Cube size={13} weight="regular" />
           {compact ? null : <span className="max-w-32 truncate">{activeVaultLabel}</span>}
         </Button>
       </ActionTooltip>

src/components/tolariaBlockNoteSideMenu.tsx

@@ -1,3 +1,4 @@
+import { DotsSixVertical as GripVertical, Plus } from '@phosphor-icons/react'
 import { SideMenuExtension, SuggestionMenu } from '@blocknote/core/extensions'
 import type {
   BlockNoteEditor,
@@ -15,7 +16,6 @@ import {
   useExtensionState,
   type SideMenuProps,
 } from '@blocknote/react'
-import { GripVertical, Plus } from 'lucide-react'
 import {
   useCallback,
   useLayoutEffect,

src/components/tolariaEditorFormatting.behavior.test.tsx

@@ -100,13 +100,13 @@ vi.mock('@mantine/core', () => ({
   ),
 }))
 
-vi.mock('lucide-react', () => ({
-  Bold: MockIcon,
-  ChevronDown: MockIcon,
-  Code2: MockIcon,
-  ExternalLink: MockIcon,
-  Italic: MockIcon,
-  Strikethrough: MockIcon,
+vi.mock('@phosphor-icons/react', () => ({
+  ArrowSquareOut: MockIcon,
+  CaretDown: MockIcon,
+  Code: MockIcon,
+  TextB: MockIcon,
+  TextItalic: MockIcon,
+  TextStrikethrough: MockIcon,
 }))
 
 vi.mock('./tolariaEditorFormattingConfig', () => ({

src/components/tolariaEditorFormatting.tsx

@@ -45,14 +45,14 @@ import {
   Menu as MantineMenu,
 } from '@mantine/core'
 import {
-  Bold,
-  ChevronDown,
-  Code2,
-  ExternalLink,
-  Italic,
-  Strikethrough,
-  type LucideIcon,
-} from 'lucide-react'
+  ArrowSquareOut as ExternalLink,
+  CaretDown as ChevronDown,
+  Code as Code2,
+  TextB as Bold,
+  TextItalic as Italic,
+  TextStrikethrough as Strikethrough,
+  type Icon as PhosphorIcon,
+} from '@phosphor-icons/react'
 import {
   filterTolariaFormattingToolbarItems,
   getTolariaBlockTypeSelectItems,
@@ -186,7 +186,7 @@ const TOLARIA_BASIC_TEXT_STYLE_ICONS = {
   italic: Italic,
   strike: Strikethrough,
   code: Code2,
-} satisfies Record<TolariaBasicTextStyle, LucideIcon>
+} satisfies Record<TolariaBasicTextStyle, PhosphorIcon>
 
 type TolariaSelectedBlock = ReturnType<
   BlockNoteEditor<BlockSchema, InlineContentSchema, StyleSchema>['getTextCursorPosition']
@@ -417,7 +417,7 @@ function TolariaBasicTextStyleButton({
 
   if (buttonState === undefined) return null
 
-  const Icon = Reflect.get(TOLARIA_BASIC_TEXT_STYLE_ICONS, basicTextStyle) as LucideIcon
+  const Icon = Reflect.get(TOLARIA_BASIC_TEXT_STYLE_ICONS, basicTextStyle) as PhosphorIcon
   const copy = Reflect.get(TOLARIA_BASIC_TEXT_STYLE_TOOLTIPS, basicTextStyle) as {
     label: string
     mainTooltip: string

src/components/ui/calendar.tsx

@@ -2,10 +2,10 @@
 
 import * as React from "react"
 import {
-  ChevronDownIcon,
-  ChevronLeftIcon,
-  ChevronRightIcon,
-} from "lucide-react"
+  CaretDown as ChevronDownIcon,
+  CaretLeft as ChevronLeftIcon,
+  CaretRight as ChevronRightIcon,
+} from '@phosphor-icons/react'
 import {
   DayPicker,
   getDefaultClassNames,

src/components/ui/checkbox.tsx

@@ -1,5 +1,5 @@
 import * as React from 'react'
-import { Check } from 'lucide-react'
+import { Check } from '@phosphor-icons/react'
 
 import { cn } from '@/lib/utils'
 

src/components/ui/dialog.tsx

@@ -1,5 +1,5 @@
 import * as React from "react"
-import { XIcon } from "lucide-react"
+import { X as XIcon } from '@phosphor-icons/react'
 import { Dialog as DialogPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"

src/components/ui/dropdown-menu.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import * as React from "react"
-import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react"
+import { CaretRight as ChevronRightIcon, Check as CheckIcon, Circle as CircleIcon } from '@phosphor-icons/react'
 import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"

src/components/ui/select.tsx

@@ -1,5 +1,5 @@
 import * as React from "react"
-import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react"
+import { CaretDown as ChevronDownIcon, CaretUp as ChevronUpIcon, Check as CheckIcon } from '@phosphor-icons/react'
 import { Select as SelectPrimitive } from "radix-ui"
 
 import { cn } from "@/lib/utils"