refactor: restructure codebase for monorepo layout

.gitignore

@@ -2,6 +2,10 @@
 node_modules
 /build
 /.svelte-kit
+apps/desktop/.svelte-kit/
+apps/desktop/build/
+apps/mobile/.svelte-kit/
+apps/mobile/build/
 /package
 .env
 .env.*

.prettierrc

@@ -16,5 +16,5 @@
       }
     }
   ],
-  "tailwindStylesheet": "./src/style.css"
+  "tailwindStylesheet": "./apps/desktop/src/style.css"
 }

CHANGELOG.md

@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/).
 
 ## [Unreleased]
 
+### Changed
+
+- Restructured codebase into monorepo layout with shared code (`shared/`) and platform-specific frontends (`apps/desktop/`, `apps/mobile/`)
+
 ## [0.2.8] - 2026-03-15
 
 ### Added

src/lib/components/common/AlbumArt.svelte → apps/desktop/src/lib/components/common/AlbumArt.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
-	import { getArtworkUrl } from '$lib/utils'
+	import { getArtworkUrl } from '$shared/utils'
+	import { appDataDir } from '$lib/stores/app'
 	import Icon from './Icon.svelte'
 
 	type Size = 'xs' | 'sm' | 'md' | 'lg'
@@ -28,7 +29,7 @@
 		lg: 'h-16 w-16',
 	}
 
-	let localUrl = $derived(getArtworkUrl(artworkPath))
+	let localUrl = $derived(getArtworkUrl(artworkPath, $appDataDir))
 	let localError = $state(false)
 	let externalError = $state(false)
 

src/lib/components/common/AlbumArtModal.svelte → apps/desktop/src/lib/components/common/AlbumArtModal.svelte

@@ -2,7 +2,7 @@
 	import Modal from './Modal.svelte'
 	import AlbumArt from './AlbumArt.svelte'
 	import Button from './Button.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 
 	type Props = {
 		open: boolean

src/lib/components/common/Breadcrumbs.svelte → apps/desktop/src/lib/components/common/Breadcrumbs.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { BreadcrumbItem } from '$lib/types'
+	import type { BreadcrumbItem } from '$shared/types'
 	import type { Snippet } from 'svelte'
 	import Icon from './Icon.svelte'
 

src/lib/components/common/ConfirmModal.svelte → apps/desktop/src/lib/components/common/ConfirmModal.svelte

@@ -3,7 +3,7 @@
 	import Button from './Button.svelte'
 	import Text from './Text.svelte'
 	import Icon from './Icon.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 
 	type Props = {
 		open: boolean

src/lib/components/common/ContextMenu.svelte → apps/desktop/src/lib/components/common/ContextMenu.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
 	import { scale } from 'svelte/transition'
-	import type { ContextMenuItem } from '$lib/types'
+	import type { ContextMenuItem } from '$shared/types'
 	import Icon from '$lib/components/common/Icon.svelte'
 	import {
 		calculateBoundedPosition,
 		calculateSubmenuPosition,
 		getOriginClass,
 		type AnchorOrigin,
-	} from '$lib/utils/position'
+	} from '$shared/utils/position'
 
 	type Props = {
 		open: boolean

src/lib/components/common/ContextMenuOrchestrator.svelte → apps/desktop/src/lib/components/common/ContextMenuOrchestrator.svelte

@@ -1,5 +1,5 @@
 <script lang="ts" module>
-	import type { Track, Playlist, Tag, TagCategory, UsbDevice, TrackColor, DiscoveryRelease } from '$lib/types'
+	import type { Track, Playlist, Tag, TagCategory, UsbDevice, TrackColor, DiscoveryRelease } from '$shared/types'
 
 	// Tag context target discriminated union
 	export type TagContextTarget =
@@ -31,7 +31,7 @@
 	import DiscoveryContextMenu from '$lib/components/discovery/DiscoveryContextMenu.svelte'
 	import ContextMenu from '$lib/components/common/ContextMenu.svelte'
 	import { get } from 'svelte/store'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { devices, reformattingDeviceId } from '$lib/stores/devices'
 	import { activeDeviceId } from '$lib/stores/export'
 	import { syncingDeviceIds } from '$lib/stores/sync'

src/lib/components/common/CrashScreen.svelte → apps/desktop/src/lib/components/common/CrashScreen.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
 	import { crashStore, hasCrashed, crashError } from '$lib/stores/crash'
-	import { resolvedTheme, accentColor } from '$lib/stores/settings'
+	import { resolvedTheme, accentColor } from '$shared/stores/settings'
 	import Icon from './Icon.svelte'
 	import IconButton from './IconButton.svelte'
 	import Button from './Button.svelte'
 	import Text from './Text.svelte'
 	import Tooltip from './Tooltip.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { get } from 'svelte/store'
 
 	let copySuccess = $state(false)

src/lib/components/common/DragPreview.svelte → apps/desktop/src/lib/components/common/DragPreview.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-	import type { Track, Playlist, DiscoveryRelease, TagCategory } from '$lib/types'
+	import type { Track, Playlist, DiscoveryRelease, TagCategory } from '$shared/types'
 	import type { DragData } from '$lib/stores/drag'
-	import { getTrackDisplayName, getTrackDisplayArtist, formatDurationCompact, getPlaylistById } from '$lib/utils'
+	import { getTrackDisplayName, getTrackDisplayArtist, formatDurationCompact, getPlaylistById } from '$shared/utils'
 	import AlbumArt from './AlbumArt.svelte'
 	import Icon from './Icon.svelte'
 	import Text from './Text.svelte'

src/lib/components/common/DuplicateTrackModal.svelte → apps/desktop/src/lib/components/common/DuplicateTrackModal.svelte

@@ -3,8 +3,8 @@
 	import Button from './Button.svelte'
 	import Icon from './Icon.svelte'
 	import Text from './Text.svelte'
-	import { translate } from '$lib/i18n'
-	import type { DuplicateTrack, DuplicateResolutionAction } from '$lib/types'
+	import { translate } from '$shared/i18n'
+	import type { DuplicateTrack, DuplicateResolutionAction } from '$shared/types'
 
 	type Props = {
 		open: boolean

src/lib/components/common/InputModal.svelte → apps/desktop/src/lib/components/common/InputModal.svelte

@@ -2,7 +2,7 @@
 	import Modal from './Modal.svelte'
 	import Input from './Input.svelte'
 	import Button from './Button.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 
 	type Props = {
 		open: boolean

src/lib/components/common/ModalOrchestrator.svelte → apps/desktop/src/lib/components/common/ModalOrchestrator.svelte

@@ -12,7 +12,7 @@
 		ExportRequest,
 		SettingsPage,
 		ActiveView,
-	} from '$lib/types'
+	} from '$shared/types'
 
 	// Discriminated union for all modal states
 	export type ActiveModal =
@@ -91,10 +91,10 @@
 	import { RelocateTrackModal } from '$lib/components/library'
 	import { SmartPlaylistModal } from '$lib/components/playlists'
 	import { ExportModal, ExportFailureModal, QuickExportModal } from '$lib/components/export'
-	import { toastStore } from '$lib/stores/toast'
-	import { resolveDuplicate } from '$lib/api/library'
-	import { parseSmartRules } from '$lib/utils/smartRules'
-	import { translate } from '$lib/i18n'
+	import { toastStore } from '$shared/stores/toast'
+	import { resolveDuplicate } from '$shared/api/library'
+	import { parseSmartRules } from '$shared/utils/smartRules'
+	import { translate } from '$shared/i18n'
 	import { get } from 'svelte/store'
 
 	// =========================================================================

src/lib/components/common/MoveConflictModal.svelte → apps/desktop/src/lib/components/common/MoveConflictModal.svelte

@@ -3,8 +3,8 @@
 	import Button from './Button.svelte'
 	import Icon from './Icon.svelte'
 	import Text from './Text.svelte'
-	import { translate } from '$lib/i18n'
-	import type { Playlist } from '$lib/types'
+	import { translate } from '$shared/i18n'
+	import type { Playlist } from '$shared/types'
 
 	type Props = {
 		open: boolean

src/lib/components/common/Toast.svelte → apps/desktop/src/lib/components/common/Toast.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { Toast, ToastType } from '$lib/stores/toast'
+	import type { Toast, ToastType } from '$shared/stores/toast'
 	import { fly } from 'svelte/transition'
 	import Icon from './Icon.svelte'
 	import IconButton from './IconButton.svelte'

src/lib/components/common/ToastContainer.svelte → apps/desktop/src/lib/components/common/ToastContainer.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { toasts, toastStore } from '$lib/stores/toast'
+	import { toasts, toastStore } from '$shared/stores/toast'
 	import Toast from './Toast.svelte'
 </script>
 

src/lib/components/common/UpdateModal.svelte → apps/desktop/src/lib/components/common/UpdateModal.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { updaterStore } from '$lib/stores/updater'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import Modal from './Modal.svelte'
 	import Button from './Button.svelte'
 	import Text from './Text.svelte'

src/lib/components/devices/DeviceContextMenu.svelte → apps/desktop/src/lib/components/devices/DeviceContextMenu.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-	import type { UsbDevice, ContextMenuItem } from '$lib/types'
+	import type { UsbDevice, ContextMenuItem } from '$shared/types'
 	import ContextMenu from '$lib/components/common/ContextMenu.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { get } from 'svelte/store'
 
 	type Props = {

src/lib/components/devices/DeviceInfoModal.svelte → apps/desktop/src/lib/components/devices/DeviceInfoModal.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
-	import type { UsbDevice } from '$lib/types'
-	import { formatFileSize } from '$lib/utils'
-	import { translate } from '$lib/i18n'
+	import type { UsbDevice } from '$shared/types'
+	import { formatFileSize } from '$shared/utils'
+	import { translate } from '$shared/i18n'
 	import Modal from '$lib/components/common/Modal.svelte'
 	import Button from '$lib/components/common/Button.svelte'
 	import Text from '$lib/components/common/Text.svelte'

src/lib/components/devices/DeviceItem.svelte → apps/desktop/src/lib/components/devices/DeviceItem.svelte

@@ -1,8 +1,8 @@
 <script lang="ts">
 	import { slide, fade } from 'svelte/transition'
-	import type { UsbDevice } from '$lib/types'
-	import { translate } from '$lib/i18n'
-	import { formatFileSize } from '$lib/utils'
+	import type { UsbDevice } from '$shared/types'
+	import { translate } from '$shared/i18n'
+	import { formatFileSize } from '$shared/utils'
 	import Icon from '$lib/components/common/Icon.svelte'
 	import IconButton from '$lib/components/common/IconButton.svelte'
 	import Text from '$lib/components/common/Text.svelte'

src/lib/components/devices/DeviceList.svelte → apps/desktop/src/lib/components/devices/DeviceList.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
 	import { fade } from 'svelte/transition'
-	import type { UsbDevice } from '$lib/types'
+	import type { UsbDevice } from '$shared/types'
 	import DeviceItem from './DeviceItem.svelte'
 	import { Text } from '$lib/components/common'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { reformattingDeviceId } from '$lib/stores/devices'
 	import { activeDeviceId } from '$lib/stores/export'
 	import { syncingDeviceIds } from '$lib/stores/sync'

src/lib/components/devices/DeviceStatusIndicator.svelte → apps/desktop/src/lib/components/devices/DeviceStatusIndicator.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import Tooltip from '$lib/components/common/Tooltip.svelte'
 
 	type Props = {

src/lib/components/devices/ReformatDeviceModal.svelte → apps/desktop/src/lib/components/devices/ReformatDeviceModal.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import type { UsbDevice } from '$lib/types'
-	import { translate } from '$lib/i18n'
+	import type { UsbDevice } from '$shared/types'
+	import { translate } from '$shared/i18n'
 	import Modal from '$lib/components/common/Modal.svelte'
 	import Button from '$lib/components/common/Button.svelte'
 	import Text from '$lib/components/common/Text.svelte'

src/lib/components/discovery/AddReleaseModal.svelte → apps/desktop/src/lib/components/discovery/AddReleaseModal.svelte

@@ -8,14 +8,14 @@
 		ScannedPage,
 		ScanPageProgress,
 		BulkImportResult,
-	} from '$lib/types'
+	} from '$shared/types'
 	import { Modal, Input, Select, Button, Text, Spinner } from '$lib/components/common'
 	import { BulkImportView } from '$lib/components/discovery'
-	import { translate } from '$lib/i18n'
-	import { autoFetchMetadata } from '$lib/stores/settings'
+	import { translate } from '$shared/i18n'
+	import { autoFetchMetadata } from '$shared/stores/settings'
 	import { listen } from '@tauri-apps/api/event'
 	import { onMount } from 'svelte'
-	import * as discoveryApi from '$lib/api/discovery'
+	import * as discoveryApi from '$shared/api/discovery'
 
 	type Props = {
 		open: boolean

src/lib/components/discovery/BulkImportView.svelte → apps/desktop/src/lib/components/discovery/BulkImportView.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import type { ScannedPage, BulkImportProgress, BulkImportResult } from '$lib/types'
+	import type { ScannedPage, BulkImportProgress, BulkImportResult } from '$shared/types'
 	import { Button, Checkbox, Text, Spinner } from '$lib/components/common'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { listen } from '@tauri-apps/api/event'
 	import { onMount } from 'svelte'
-	import * as discoveryApi from '$lib/api/discovery'
+	import * as discoveryApi from '$shared/api/discovery'
 	import { SvelteSet } from 'svelte/reactivity'
 
 	type Props = {

src/lib/components/discovery/DiscoveryContextMenu.svelte → apps/desktop/src/lib/components/discovery/DiscoveryContextMenu.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import type { DiscoveryRelease, Playlist, ContextMenuItem } from '$lib/types'
+	import type { DiscoveryRelease, Playlist, ContextMenuItem } from '$shared/types'
 	import ContextMenu from '$lib/components/common/ContextMenu.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { get } from 'svelte/store'
 	import { writeText } from '@tauri-apps/plugin-clipboard-manager'
-	import { toastStore } from '$lib/stores/toast'
+	import { toastStore } from '$shared/stores/toast'
 
 	type Props = {
 		open: boolean

src/lib/components/discovery/DiscoveryEditor.svelte → apps/desktop/src/lib/components/discovery/DiscoveryEditor.svelte

@@ -1,15 +1,15 @@
 <script lang="ts">
-	import { discoveryStore, refreshingReleaseIds } from '$lib/stores/discovery'
-	import { uiStore } from '$lib/stores/ui'
-	import { toastStore } from '$lib/stores/toast'
-	import type { DiscoveryRelease, DiscoveryReleaseUpdate } from '$lib/types'
+	import { discoveryStore, refreshingReleaseIds } from '$shared/stores/discovery'
+	import { uiStore } from '$shared/stores/ui'
+	import { toastStore } from '$shared/stores/toast'
+	import type { DiscoveryRelease, DiscoveryReleaseUpdate } from '$shared/types'
 	import Button from '$lib/components/common/Button.svelte'
 	import IconButton from '$lib/components/common/IconButton.svelte'
 	import Text from '$lib/components/common/Text.svelte'
 	import Tooltip from '$lib/components/common/Tooltip.svelte'
 	import EditorField from '$lib/components/editor/EditorField.svelte'
 	import { EditorDateField, EditorTextArea, EditorArtwork } from '$lib/components/editor'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { get } from 'svelte/store'
 
 	type Props = {

src/lib/components/discovery/DiscoveryList.svelte → apps/desktop/src/lib/components/discovery/DiscoveryList.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
-	import type { DiscoveryRelease, DiscoverySortConfig, DiscoverySourceType } from '$lib/types'
+	import type { DiscoveryRelease, DiscoverySortConfig, DiscoverySourceType } from '$shared/types'
 	import { tick } from 'svelte'
-	import { handleSelection } from '$lib/utils'
-	import { createVirtualList } from '$lib/utils/virtualizer.svelte'
+	import { handleSelection } from '$shared/utils'
+	import { createVirtualList } from '$shared/utils/virtualizer.svelte'
 	import { pendingScrollReleaseId, locateStore } from '$lib/stores'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import DiscoveryListHeader from './DiscoveryListHeader.svelte'
 	import DiscoveryRow from './DiscoveryRow.svelte'
 	import Icon from '$lib/components/common/Icon.svelte'

src/lib/components/discovery/DiscoveryListHeader.svelte → apps/desktop/src/lib/components/discovery/DiscoveryListHeader.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">
-	import type { DiscoverySortConfig, DiscoverySortField } from '$lib/types'
-	import { translate } from '$lib/i18n'
+	import type { DiscoverySortConfig, DiscoverySortField } from '$shared/types'
+	import { translate } from '$shared/i18n'
 	import Icon from '$lib/components/common/Icon.svelte'
 	import { fade } from 'svelte/transition'
 

src/lib/components/discovery/DiscoveryRow.svelte → apps/desktop/src/lib/components/discovery/DiscoveryRow.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
-	import type { DiscoveryRelease } from '$lib/types'
-	import { formatDate, formatDuration, formatRelativeDate } from '$lib/utils'
+	import type { DiscoveryRelease } from '$shared/types'
+	import { formatDate, formatDuration, formatRelativeDate } from '$shared/utils'
 	import { TagChip } from '$lib/components/tags'
 	import { AlbumArt, AlbumArtModal, Icon, IconButton, Spinner, Text, Tooltip } from '$lib/components/common'
 	import { language, dateFormat, dragStore, isDraggingTag, refreshingReleaseIds, discoveryStore } from '$lib/stores'
-	import { playbackSource, previewInfo, previewLoadingReleaseId } from '$lib/stores/player'
-	import { DRAG_THRESHOLD, getDistance } from '$lib/utils/drag'
-	import { translate } from '$lib/i18n'
-	import * as discoveryApi from '$lib/api/discovery'
+	import { playbackSource, previewInfo, previewLoadingReleaseId } from '$shared/stores/player'
+	import { DRAG_THRESHOLD, getDistance } from '$shared/utils/drag'
+	import { translate } from '$shared/i18n'
+	import * as discoveryApi from '$shared/api/discovery'
 
 	type Props = {
 		release: DiscoveryRelease

src/lib/components/discovery/DiscoveryView.svelte → apps/desktop/src/lib/components/discovery/DiscoveryView.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
-	import type { DiscoveryRelease, DiscoverySortConfig, Tag, TagCategory, TagFilterMode } from '$lib/types'
+	import type { DiscoveryRelease, DiscoverySortConfig, Tag, TagCategory, TagFilterMode } from '$shared/types'
 	import DiscoveryList from './DiscoveryList.svelte'
 	import { SearchBar, FilterDropdown } from '$lib/components/library'
 	import { IconButton } from '$lib/components/common'
 	import Icon from '$lib/components/common/Icon.svelte'
 	import Text from '$lib/components/common/Text.svelte'
 	import Tooltip from '$lib/components/common/Tooltip.svelte'
-	import { translate } from '$lib/i18n'
+	import { translate } from '$shared/i18n'
 	import { expandedReleaseIds } from '$lib/stores'
 
 	type Props = {