NotS1mp/Musify
0
0
Fork 0
Code Issues 23 Pull Requests Actions Packages Projects Releases Wiki Activity

Categorize components/ui into primitives, overlay, media, forms and layout

Browse Source 
Splits the flat 38-component ui/ folder into primitives/ (generic
controls), overlay/ (menus/modals), media/ (music-domain display
components), forms/ (composite entity forms) and layout/ (page
scaffolding), and updates every import path accordingly.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Admin
2026-09-22 14:16:25 +02:00
co-authored by Claude Sonnet 5
parent 8a76fbb78e
commit 705f23c78f
61 changed files with 131 additions and 131 deletions
Download Patch File Download Diff File Expand all files Collapse all files
web-player/src/lib/components/layout/MobileHeader.svelte
+5 -5
View File
@@ -3,11 +3,11 @@
import Upload from '@lucide/svelte/icons/upload'; import Upload from '@lucide/svelte/icons/upload';
import Folder from '@lucide/svelte/icons/folder'; import Folder from '@lucide/svelte/icons/folder';
import LogIn from '@lucide/svelte/icons/log-in'; import LogIn from '@lucide/svelte/icons/log-in';
import MenuItem from '../ui/MenuItem.svelte'; import MenuItem from '../ui/overlay/MenuItem.svelte';
import AccountMenu from '../ui/AccountMenu.svelte'; import AccountMenu from '../ui/overlay/AccountMenu.svelte';
import Avatar from '../ui/Avatar.svelte'; import Avatar from '../ui/media/Avatar.svelte';
import IconButton from '../ui/IconButton.svelte'; import IconButton from '../ui/primitives/IconButton.svelte';
import Logo from '../ui/Logo.svelte'; import Logo from '../ui/primitives/Logo.svelte';
interface Props { interface Props {
user: SessionUser | null; user: SessionUser | null;
web-player/src/lib/components/layout/Sidebar.svelte
+3 -3
View File
@@ -4,9 +4,9 @@
import { liked } from '$lib/player/liked.svelte'; import { liked } from '$lib/player/liked.svelte';
import { createPlaylistModal } from '$lib/state/playlists.svelte'; import { createPlaylistModal } from '$lib/state/playlists.svelte';
import type { SessionUser } from '$lib/types'; import type { SessionUser } from '$lib/types';
import ListRow from '../ui/ListRow.svelte'; import ListRow from '../ui/media/ListRow.svelte';
import IconButton from '../ui/IconButton.svelte'; import IconButton from '../ui/primitives/IconButton.svelte';
import Logo from '../ui/Logo.svelte'; import Logo from '../ui/primitives/Logo.svelte';
import Plus from '@lucide/svelte/icons/plus'; import Plus from '@lucide/svelte/icons/plus';
interface SidebarPlaylist { interface SidebarPlaylist {
web-player/src/lib/components/layout/TopBar.svelte
+4 -4
View File
@@ -7,10 +7,10 @@
import Search from '@lucide/svelte/icons/search'; import Search from '@lucide/svelte/icons/search';
import X from '@lucide/svelte/icons/x'; import X from '@lucide/svelte/icons/x';
import ChevronLeft from '@lucide/svelte/icons/chevron-left'; import ChevronLeft from '@lucide/svelte/icons/chevron-left';
import AccountMenu from '../ui/AccountMenu.svelte'; import AccountMenu from '../ui/overlay/AccountMenu.svelte';
import Avatar from '../ui/Avatar.svelte'; import Avatar from '../ui/media/Avatar.svelte';
import IconButton from '../ui/IconButton.svelte'; import IconButton from '../ui/primitives/IconButton.svelte';
import Button from '../ui/Button.svelte'; import Button from '../ui/primitives/Button.svelte';
interface Props { interface Props {
user: SessionUser | null; user: SessionUser | null;
web-player/src/lib/components/player/PlayerBar.svelte
+2 -2
View File
@@ -1,8 +1,8 @@
<script lang="ts"> <script lang="ts">
import TrackInfo from './TrackInfo.svelte'; import TrackInfo from './TrackInfo.svelte';
import TransportControls from './TransportControls.svelte'; import TransportControls from './TransportControls.svelte';
import Slider from '$lib/components/ui/Slider.svelte'; import Slider from '$lib/components/ui/primitives/Slider.svelte';
import IconButton from '$lib/components/ui/IconButton.svelte'; import IconButton from '$lib/components/ui/primitives/IconButton.svelte';
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import { queuePanel } from '$lib/player/queuePanel.svelte'; import { queuePanel } from '$lib/player/queuePanel.svelte';
import { fmtTime } from '$lib/utils/format'; import { fmtTime } from '$lib/utils/format';
web-player/src/lib/components/player/PlayerDock.svelte
+1 -1
View File
@@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import PlayerBar from './PlayerBar.svelte'; import PlayerBar from './PlayerBar.svelte';
import TabsBar from '../layout/TabsBar.svelte'; import TabsBar from '../layout/TabsBar.svelte';
import Alert from '$lib/components/ui/Alert.svelte'; import Alert from '$lib/components/ui/primitives/Alert.svelte';
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import type { SessionUser } from '$lib/types'; import type { SessionUser } from '$lib/types';
web-player/src/lib/components/player/Queue.svelte
+3 -3
View File
@@ -1,9 +1,9 @@
<script lang="ts"> <script lang="ts">
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import { queuePanel } from '$lib/player/queuePanel.svelte'; import { queuePanel } from '$lib/player/queuePanel.svelte';
import MediaIdentity from '$lib/components/ui/MediaIdentity.svelte'; import MediaIdentity from '$lib/components/ui/media/MediaIdentity.svelte';
import ListRow from '$lib/components/ui/ListRow.svelte'; import ListRow from '$lib/components/ui/media/ListRow.svelte';
import IconButton from '$lib/components/ui/IconButton.svelte'; import IconButton from '$lib/components/ui/primitives/IconButton.svelte';
import { fmtTime } from '$lib/utils/format'; import { fmtTime } from '$lib/utils/format';
import X from '@lucide/svelte/icons/x'; import X from '@lucide/svelte/icons/x';
import { fly } from 'svelte/transition'; import { fly } from 'svelte/transition';
web-player/src/lib/components/player/TrackInfo.svelte
+4 -4
View File
@@ -1,10 +1,10 @@
<script lang="ts"> <script lang="ts">
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import { liked } from '$lib/player/liked.svelte'; import { liked } from '$lib/player/liked.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import ExplicitBadge from '$lib/components/ui/ExplicitBadge.svelte'; import ExplicitBadge from '$lib/components/ui/media/ExplicitBadge.svelte';
import ArtistLink from '$lib/components/ui/ArtistLink.svelte'; import ArtistLink from '$lib/components/ui/media/ArtistLink.svelte';
import IconButton from '$lib/components/ui/IconButton.svelte'; import IconButton from '$lib/components/ui/primitives/IconButton.svelte';
import Heart from '@lucide/svelte/icons/heart'; import Heart from '@lucide/svelte/icons/heart';
interface Props { interface Props {
web-player/src/lib/components/player/TransportControls.svelte
+1 -1
View File
@@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import PlayButton from '$lib/components/ui/PlayButton.svelte'; import PlayButton from '$lib/components/ui/media/PlayButton.svelte';
import Shuffle from '@lucide/svelte/icons/shuffle'; import Shuffle from '@lucide/svelte/icons/shuffle';
import Repeat from '@lucide/svelte/icons/repeat'; import Repeat from '@lucide/svelte/icons/repeat';
web-player/src/lib/components/ui/AlbumForm.svelte → web-player/src/lib/components/ui/forms/AlbumForm.svelte
+3 -3
View File
@@ -2,9 +2,9 @@
import { untrack } from 'svelte'; import { untrack } from 'svelte';
import Disc3 from '@lucide/svelte/icons/disc-3'; import Disc3 from '@lucide/svelte/icons/disc-3';
import CoverForm from './CoverForm.svelte'; import CoverForm from './CoverForm.svelte';
import Field from './Field.svelte'; import Field from '../primitives/Field.svelte';
import Input from './Input.svelte'; import Input from '../primitives/Input.svelte';
import Textarea from './Textarea.svelte'; import Textarea from '../primitives/Textarea.svelte';
import { ALBUM_EARLIEST_YEAR } from '$lib/config'; import { ALBUM_EARLIEST_YEAR } from '$lib/config';
interface Props { interface Props {
web-player/src/lib/components/ui/CoverForm.svelte → web-player/src/lib/components/ui/forms/CoverForm.svelte
+3 -3
View File
@@ -3,9 +3,9 @@
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
import type { LucideIcon } from '@lucide/svelte'; import type { LucideIcon } from '@lucide/svelte';
import ImageDropzone from './ImageDropzone.svelte'; import ImageDropzone from './ImageDropzone.svelte';
import Button from './Button.svelte'; import Button from '../primitives/Button.svelte';
import Field from './Field.svelte'; import Field from '../primitives/Field.svelte';
import Alert from './Alert.svelte'; import Alert from '../primitives/Alert.svelte';
interface Props { interface Props {
action: string; action: string;
web-player/src/lib/components/ui/ImageDropzone.svelte → web-player/src/lib/components/ui/forms/ImageDropzone.svelte
View File
web-player/src/lib/components/ui/PlaylistForm.svelte → web-player/src/lib/components/ui/forms/PlaylistForm.svelte
+4 -4
View File
@@ -2,10 +2,10 @@
import { untrack } from 'svelte'; import { untrack } from 'svelte';
import Music from '@lucide/svelte/icons/music'; import Music from '@lucide/svelte/icons/music';
import CoverForm from './CoverForm.svelte'; import CoverForm from './CoverForm.svelte';
import Field from './Field.svelte'; import Field from '../primitives/Field.svelte';
import Input from './Input.svelte'; import Input from '../primitives/Input.svelte';
import Textarea from './Textarea.svelte'; import Textarea from '../primitives/Textarea.svelte';
import SegmentedControl from './SegmentedControl.svelte'; import SegmentedControl from '../primitives/SegmentedControl.svelte';
const NAME_MAX_LENGTH = 60; const NAME_MAX_LENGTH = 60;
const DESCRIPTION_MAX_LENGTH = 300; const DESCRIPTION_MAX_LENGTH = 300;
web-player/src/lib/components/ui/Page.svelte → web-player/src/lib/components/ui/layout/Page.svelte
View File
web-player/src/lib/components/ui/PageHeader.svelte → web-player/src/lib/components/ui/layout/PageHeader.svelte
View File
web-player/src/lib/components/ui/SectionHeading.svelte → web-player/src/lib/components/ui/layout/SectionHeading.svelte
View File
web-player/src/lib/components/ui/ArtistLink.svelte → web-player/src/lib/components/ui/media/ArtistLink.svelte
View File
web-player/src/lib/components/ui/Artwork.svelte → web-player/src/lib/components/ui/media/Artwork.svelte
View File
web-player/src/lib/components/ui/Avatar.svelte → web-player/src/lib/components/ui/media/Avatar.svelte
View File
web-player/src/lib/components/ui/EqBars.svelte → web-player/src/lib/components/ui/media/EqBars.svelte
View File
web-player/src/lib/components/ui/ExplicitBadge.svelte → web-player/src/lib/components/ui/media/ExplicitBadge.svelte
View File
web-player/src/lib/components/ui/ListRow.svelte → web-player/src/lib/components/ui/media/ListRow.svelte
View File
web-player/src/lib/components/ui/MediaCard.svelte → web-player/src/lib/components/ui/media/MediaCard.svelte
View File
web-player/src/lib/components/ui/MediaIdentity.svelte → web-player/src/lib/components/ui/media/MediaIdentity.svelte
View File
web-player/src/lib/components/ui/PlayButton.svelte → web-player/src/lib/components/ui/media/PlayButton.svelte
View File
web-player/src/lib/components/ui/TrackList.svelte → web-player/src/lib/components/ui/media/TrackList.svelte
+1 -1
View File
@@ -36,7 +36,7 @@
import { pressable } from '$lib/actions/pressable'; import { pressable } from '$lib/actions/pressable';
import MediaIdentity from './MediaIdentity.svelte'; import MediaIdentity from './MediaIdentity.svelte';
import EqBars from './EqBars.svelte'; import EqBars from './EqBars.svelte';
import IconButton from './IconButton.svelte'; import IconButton from '../primitives/IconButton.svelte';
interface RowAction { interface RowAction {
action?: string; action?: string;
web-player/src/lib/components/ui/AccountMenu.svelte → web-player/src/lib/components/ui/overlay/AccountMenu.svelte
View File
web-player/src/lib/components/ui/ConfirmDialog.svelte → web-player/src/lib/components/ui/overlay/ConfirmDialog.svelte
+1 -1
View File
@@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import Modal from './Modal.svelte'; import Modal from './Modal.svelte';
import Button from './Button.svelte'; import Button from '../primitives/Button.svelte';
interface Props { interface Props {
open: boolean; open: boolean;
web-player/src/lib/components/ui/ContextMenu.svelte → web-player/src/lib/components/ui/overlay/ContextMenu.svelte
+1 -1
View File
@@ -21,7 +21,7 @@
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
import type { LucideIcon } from '@lucide/svelte'; import type { LucideIcon } from '@lucide/svelte';
import ChevronRight from '@lucide/svelte/icons/chevron-right'; import ChevronRight from '@lucide/svelte/icons/chevron-right';
import MediaIdentity from './MediaIdentity.svelte'; import MediaIdentity from '../media/MediaIdentity.svelte';
import GlassMenu from './GlassMenu.svelte'; import GlassMenu from './GlassMenu.svelte';
import MenuItem from './MenuItem.svelte'; import MenuItem from './MenuItem.svelte';
web-player/src/lib/components/ui/GlassMenu.svelte → web-player/src/lib/components/ui/overlay/GlassMenu.svelte
View File
web-player/src/lib/components/ui/MenuItem.svelte → web-player/src/lib/components/ui/overlay/MenuItem.svelte
View File
web-player/src/lib/components/ui/Modal.svelte → web-player/src/lib/components/ui/overlay/Modal.svelte
+1 -1
View File
@@ -1,7 +1,7 @@
<script lang="ts"> <script lang="ts">
import type { Snippet } from 'svelte'; import type { Snippet } from 'svelte';
import X from '@lucide/svelte/icons/x'; import X from '@lucide/svelte/icons/x';
import IconButton from './IconButton.svelte'; import IconButton from '../primitives/IconButton.svelte';
interface Props { interface Props {
open: boolean; open: boolean;
web-player/src/lib/components/ui/Alert.svelte → web-player/src/lib/components/ui/primitives/Alert.svelte
View File
web-player/src/lib/components/ui/BackLink.svelte → web-player/src/lib/components/ui/primitives/BackLink.svelte
View File
web-player/src/lib/components/ui/Button.svelte → web-player/src/lib/components/ui/primitives/Button.svelte
View File
web-player/src/lib/components/ui/Checkbox.svelte → web-player/src/lib/components/ui/primitives/Checkbox.svelte
View File
web-player/src/lib/components/ui/Chip.svelte → web-player/src/lib/components/ui/primitives/Chip.svelte
View File
web-player/src/lib/components/ui/EmptyState.svelte → web-player/src/lib/components/ui/primitives/EmptyState.svelte
View File
web-player/src/lib/components/ui/Field.svelte → web-player/src/lib/components/ui/primitives/Field.svelte
View File
web-player/src/lib/components/ui/IconButton.svelte → web-player/src/lib/components/ui/primitives/IconButton.svelte
View File
web-player/src/lib/components/ui/InfiniteScroll.svelte → web-player/src/lib/components/ui/primitives/InfiniteScroll.svelte
View File
web-player/src/lib/components/ui/Input.svelte → web-player/src/lib/components/ui/primitives/Input.svelte
View File
web-player/src/lib/components/ui/Logo.svelte → web-player/src/lib/components/ui/primitives/Logo.svelte
View File
web-player/src/lib/components/ui/SegmentedControl.svelte → web-player/src/lib/components/ui/primitives/SegmentedControl.svelte
View File
web-player/src/lib/components/ui/Slider.svelte → web-player/src/lib/components/ui/primitives/Slider.svelte
View File
web-player/src/lib/components/ui/Surface.svelte → web-player/src/lib/components/ui/primitives/Surface.svelte
View File
web-player/src/lib/components/ui/Textarea.svelte → web-player/src/lib/components/ui/primitives/Textarea.svelte
View File
web-player/src/lib/state/menus.svelte.ts
+1 -1
View File
@@ -1,4 +1,4 @@
import { contextMenuPosition, type MenuPosition } from '$lib/components/ui/ContextMenu.svelte'; import { contextMenuPosition, type MenuPosition } from '$lib/components/ui/overlay/ContextMenu.svelte';
import { player, toQueueItem, type ApiTrackLike } from '../player/player.svelte'; import { player, toQueueItem, type ApiTrackLike } from '../player/player.svelte';
export type TrackMenuState = { track: ApiTrackLike } & MenuPosition; export type TrackMenuState = { track: ApiTrackLike } & MenuPosition;
web-player/src/routes/(app)/albums/+page.svelte
+7 -7
View File
@@ -1,13 +1,13 @@
<script lang="ts"> <script lang="ts">
import Plus from '@lucide/svelte/icons/plus'; import Plus from '@lucide/svelte/icons/plus';
import Disc from '@lucide/svelte/icons/disc-3'; import Disc from '@lucide/svelte/icons/disc-3';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import MediaCard from '$lib/components/ui/MediaCard.svelte'; import MediaCard from '$lib/components/ui/media/MediaCard.svelte';
import AlbumForm from '$lib/components/ui/AlbumForm.svelte'; import AlbumForm from '$lib/components/ui/forms/AlbumForm.svelte';
import Modal from '$lib/components/ui/Modal.svelte'; import Modal from '$lib/components/ui/overlay/Modal.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import { albumMeta } from '$lib/utils/format'; import { albumMeta } from '$lib/utils/format';
let { data, form } = $props(); let { data, form } = $props();
web-player/src/routes/(app)/albums/[id]/+page.svelte
+11 -11
View File
@@ -6,17 +6,17 @@
import Pause from '@lucide/svelte/icons/pause'; import Pause from '@lucide/svelte/icons/pause';
import SquarePencil from '@lucide/svelte/icons/square-pen'; import SquarePencil from '@lucide/svelte/icons/square-pen';
import Trash from '@lucide/svelte/icons/trash'; import Trash from '@lucide/svelte/icons/trash';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import Modal from '$lib/components/ui/Modal.svelte'; import Modal from '$lib/components/ui/overlay/Modal.svelte';
import ConfirmDialog from '$lib/components/ui/ConfirmDialog.svelte'; import ConfirmDialog from '$lib/components/ui/overlay/ConfirmDialog.svelte';
import Alert from '$lib/components/ui/Alert.svelte'; import Alert from '$lib/components/ui/primitives/Alert.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import AlbumForm from '$lib/components/ui/AlbumForm.svelte'; import AlbumForm from '$lib/components/ui/forms/AlbumForm.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import BackLink from '$lib/components/ui/BackLink.svelte'; import BackLink from '$lib/components/ui/primitives/BackLink.svelte';
import SectionHeading from '$lib/components/ui/SectionHeading.svelte'; import SectionHeading from '$lib/components/ui/layout/SectionHeading.svelte';
import TrackList from '$lib/components/ui/TrackList.svelte'; import TrackList from '$lib/components/ui/media/TrackList.svelte';
import { albumMeta } from '$lib/utils/format'; import { albumMeta } from '$lib/utils/format';
let { data, form } = $props(); let { data, form } = $props();
web-player/src/routes/(app)/explore/+page.svelte
+13 -13
View File
@@ -3,22 +3,22 @@
import { player, toQueueItem } from '$lib/player/player.svelte'; import { player, toQueueItem } from '$lib/player/player.svelte';
import { fetchAlbumQueueItems } from '$lib/data/albums'; import { fetchAlbumQueueItems } from '$lib/data/albums';
import { fmtTime, fmtPlays, plural } from '$lib/utils/format'; import { fmtTime, fmtPlays, plural } from '$lib/utils/format';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import Alert from '$lib/components/ui/Alert.svelte'; import Alert from '$lib/components/ui/primitives/Alert.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import InfiniteScroll from '$lib/components/ui/InfiniteScroll.svelte'; import InfiniteScroll from '$lib/components/ui/primitives/InfiniteScroll.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import Avatar from '$lib/components/ui/Avatar.svelte'; import Avatar from '$lib/components/ui/media/Avatar.svelte';
import PlayButton from '$lib/components/ui/PlayButton.svelte'; import PlayButton from '$lib/components/ui/media/PlayButton.svelte';
import EqBars from '$lib/components/ui/EqBars.svelte'; import EqBars from '$lib/components/ui/media/EqBars.svelte';
import ListRow from '$lib/components/ui/ListRow.svelte'; import ListRow from '$lib/components/ui/media/ListRow.svelte';
import Chip from '$lib/components/ui/Chip.svelte'; import Chip from '$lib/components/ui/primitives/Chip.svelte';
import SectionHeading from '$lib/components/ui/SectionHeading.svelte'; import SectionHeading from '$lib/components/ui/layout/SectionHeading.svelte';
import { EXPLORE_PAGE_SIZE } from '$lib/config'; import { EXPLORE_PAGE_SIZE } from '$lib/config';
import { searchHref } from '$lib/state/navigation.svelte'; import { searchHref } from '$lib/state/navigation.svelte';
import { createTrackMenu } from '$lib/state/menus.svelte'; import { createTrackMenu } from '$lib/state/menus.svelte';
import ContextMenu, { contextMenuPosition } from '$lib/components/ui/ContextMenu.svelte'; import ContextMenu, { contextMenuPosition } from '$lib/components/ui/overlay/ContextMenu.svelte';
import ListPlus from '@lucide/svelte/icons/list-plus'; import ListPlus from '@lucide/svelte/icons/list-plus';
import ListEnd from '@lucide/svelte/icons/list-end'; import ListEnd from '@lucide/svelte/icons/list-end';
import { appendUnique } from '$lib/data/collections'; import { appendUnique } from '$lib/data/collections';
web-player/src/routes/(app)/library/+page.svelte
+5 -5
View File
@@ -4,11 +4,11 @@
import Music from '@lucide/svelte/icons/music'; import Music from '@lucide/svelte/icons/music';
import { player, toQueueItems } from '$lib/player/player.svelte'; import { player, toQueueItems } from '$lib/player/player.svelte';
import { plural } from '$lib/utils/format'; import { plural } from '$lib/utils/format';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import TrackList from '$lib/components/ui/TrackList.svelte'; import TrackList from '$lib/components/ui/media/TrackList.svelte';
let { data } = $props(); let { data } = $props();
web-player/src/routes/(app)/liked/+page.svelte
+5 -5
View File
@@ -4,11 +4,11 @@
import { player, isQueueCurrent, playAllOrToggle } from '$lib/player/player.svelte'; import { player, isQueueCurrent, playAllOrToggle } from '$lib/player/player.svelte';
import { liked } from '$lib/player/liked.svelte'; import { liked } from '$lib/player/liked.svelte';
import { plural } from '$lib/utils/format'; import { plural } from '$lib/utils/format';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import TrackList from '$lib/components/ui/TrackList.svelte'; import TrackList from '$lib/components/ui/media/TrackList.svelte';
const tracks = $derived(liked.list); const tracks = $derived(liked.list);
const listTracks = $derived(tracks.map((track) => ({ ...track, addedAt: track.likedAt }))); const listTracks = $derived(tracks.map((track) => ({ ...track, addedAt: track.likedAt })));
web-player/src/routes/(app)/mixes/[id]/+page.svelte
+8 -8
View File
@@ -10,14 +10,14 @@
toQueueItem toQueueItem
} from '$lib/player/player.svelte'; } from '$lib/player/player.svelte';
import { fmtTime, plural } from '$lib/utils/format'; import { fmtTime, plural } from '$lib/utils/format';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import BackLink from '$lib/components/ui/BackLink.svelte'; import BackLink from '$lib/components/ui/primitives/BackLink.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import Alert from '$lib/components/ui/Alert.svelte'; import Alert from '$lib/components/ui/primitives/Alert.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import TrackList from '$lib/components/ui/TrackList.svelte'; import TrackList from '$lib/components/ui/media/TrackList.svelte';
import ContextMenu from '$lib/components/ui/ContextMenu.svelte'; import ContextMenu from '$lib/components/ui/overlay/ContextMenu.svelte';
import ListPlus from '@lucide/svelte/icons/list-plus'; import ListPlus from '@lucide/svelte/icons/list-plus';
import { createTrackMenu } from '$lib/state/menus.svelte'; import { createTrackMenu } from '$lib/state/menus.svelte';
import { mixItemTrack } from '$lib/data/mixes'; import { mixItemTrack } from '$lib/data/mixes';
web-player/src/routes/(app)/playlists/+page.svelte
+5 -5
View File
@@ -1,10 +1,10 @@
<script lang="ts"> <script lang="ts">
import ListMusic from '@lucide/svelte/icons/list-music'; import ListMusic from '@lucide/svelte/icons/list-music';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import MediaCard from '$lib/components/ui/MediaCard.svelte'; import MediaCard from '$lib/components/ui/media/MediaCard.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import { createPlaylistModal } from '$lib/state/playlists.svelte'; import { createPlaylistModal } from '$lib/state/playlists.svelte';
import { fmtDurationLong, plural, playlistMeta } from '$lib/utils/format'; import { fmtDurationLong, plural, playlistMeta } from '$lib/utils/format';
web-player/src/routes/(app)/playlists/[id]/+page.svelte
+9 -9
View File
@@ -6,15 +6,15 @@
import SquarePencil from '@lucide/svelte/icons/square-pen'; import SquarePencil from '@lucide/svelte/icons/square-pen';
import Trash from '@lucide/svelte/icons/trash'; import Trash from '@lucide/svelte/icons/trash';
import { player, toQueueItems, isQueueCurrent, playAllOrToggle } from '$lib/player/player.svelte'; import { player, toQueueItems, isQueueCurrent, playAllOrToggle } from '$lib/player/player.svelte';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import Modal from '$lib/components/ui/Modal.svelte'; import Modal from '$lib/components/ui/overlay/Modal.svelte';
import ConfirmDialog from '$lib/components/ui/ConfirmDialog.svelte'; import ConfirmDialog from '$lib/components/ui/overlay/ConfirmDialog.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import PlaylistForm from '$lib/components/ui/PlaylistForm.svelte'; import PlaylistForm from '$lib/components/ui/forms/PlaylistForm.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import TrackList from '$lib/components/ui/TrackList.svelte'; import TrackList from '$lib/components/ui/media/TrackList.svelte';
import { playlistMeta } from '$lib/utils/format'; import { playlistMeta } from '$lib/utils/format';
let { data, form } = $props(); let { data, form } = $props();
web-player/src/routes/(app)/u/[id]/+page.svelte
+7 -7
View File
@@ -2,13 +2,13 @@
import { untrack } from 'svelte'; import { untrack } from 'svelte';
import { enhance } from '$app/forms'; import { enhance } from '$app/forms';
import ListMusic from '@lucide/svelte/icons/list-music'; import ListMusic from '@lucide/svelte/icons/list-music';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import MediaCard from '$lib/components/ui/MediaCard.svelte'; import MediaCard from '$lib/components/ui/media/MediaCard.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import Avatar from '$lib/components/ui/Avatar.svelte'; import Avatar from '$lib/components/ui/media/Avatar.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import SectionHeading from '$lib/components/ui/SectionHeading.svelte'; import SectionHeading from '$lib/components/ui/layout/SectionHeading.svelte';
import { plural, playlistMeta } from '$lib/utils/format'; import { plural, playlistMeta } from '$lib/utils/format';
let { data, form } = $props(); let { data, form } = $props();
web-player/src/routes/(app)/upload/+page.svelte
+9 -9
View File
@@ -4,15 +4,15 @@
import Music from '@lucide/svelte/icons/music'; import Music from '@lucide/svelte/icons/music';
import ImageIcon from '@lucide/svelte/icons/image'; import ImageIcon from '@lucide/svelte/icons/image';
import Check from '@lucide/svelte/icons/check'; import Check from '@lucide/svelte/icons/check';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import PageHeader from '$lib/components/ui/PageHeader.svelte'; import PageHeader from '$lib/components/ui/layout/PageHeader.svelte';
import Surface from '$lib/components/ui/Surface.svelte'; import Surface from '$lib/components/ui/primitives/Surface.svelte';
import ImageDropzone from '$lib/components/ui/ImageDropzone.svelte'; import ImageDropzone from '$lib/components/ui/forms/ImageDropzone.svelte';
import Alert from '$lib/components/ui/Alert.svelte'; import Alert from '$lib/components/ui/primitives/Alert.svelte';
import Field from '$lib/components/ui/Field.svelte'; import Field from '$lib/components/ui/primitives/Field.svelte';
import Input from '$lib/components/ui/Input.svelte'; import Input from '$lib/components/ui/primitives/Input.svelte';
import Checkbox from '$lib/components/ui/Checkbox.svelte'; import Checkbox from '$lib/components/ui/primitives/Checkbox.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
type Status = 'idle' | 'uploading' | 'done' | 'error'; type Status = 'idle' | 'uploading' | 'done' | 'error';
type StepState = 'idle' | 'active' | 'done'; type StepState = 'idle' | 'active' | 'done';
web-player/src/routes/+error.svelte
+1 -1
View File
@@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import { page } from '$app/state'; import { page } from '$app/state';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
</script> </script>
<div class="animate-enter mx-auto my-[14vh] max-w-prose-sm text-center"> <div class="animate-enter mx-auto my-[14vh] max-w-prose-sm text-center">
web-player/src/routes/+layout.svelte
+2 -2
View File
@@ -9,8 +9,8 @@
import Sidebar from '$lib/components/layout/Sidebar.svelte'; import Sidebar from '$lib/components/layout/Sidebar.svelte';
import TopBar from '$lib/components/layout/TopBar.svelte'; import TopBar from '$lib/components/layout/TopBar.svelte';
import MobileHeader from '$lib/components/layout/MobileHeader.svelte'; import MobileHeader from '$lib/components/layout/MobileHeader.svelte';
import Modal from '$lib/components/ui/Modal.svelte'; import Modal from '$lib/components/ui/overlay/Modal.svelte';
import PlaylistForm from '$lib/components/ui/PlaylistForm.svelte'; import PlaylistForm from '$lib/components/ui/forms/PlaylistForm.svelte';
import { player } from '$lib/player/player.svelte'; import { player } from '$lib/player/player.svelte';
import { queuePanel } from '$lib/player/queuePanel.svelte'; import { queuePanel } from '$lib/player/queuePanel.svelte';
import { liked } from '$lib/player/liked.svelte'; import { liked } from '$lib/player/liked.svelte';
web-player/src/routes/+page.svelte
+9 -9
View File
@@ -16,15 +16,15 @@
import { mergeRecentlyPlayed } from '$lib/data/recentlyPlayed'; import { mergeRecentlyPlayed } from '$lib/data/recentlyPlayed';
import { mixItemTrack } from '$lib/data/mixes'; import { mixItemTrack } from '$lib/data/mixes';
import { fmtTime, fmtDurationLong, fmtPlays, plural } from '$lib/utils/format'; import { fmtTime, fmtDurationLong, fmtPlays, plural } from '$lib/utils/format';
import Page from '$lib/components/ui/Page.svelte'; import Page from '$lib/components/ui/layout/Page.svelte';
import Artwork from '$lib/components/ui/Artwork.svelte'; import Artwork from '$lib/components/ui/media/Artwork.svelte';
import MediaCard from '$lib/components/ui/MediaCard.svelte'; import MediaCard from '$lib/components/ui/media/MediaCard.svelte';
import EqBars from '$lib/components/ui/EqBars.svelte'; import EqBars from '$lib/components/ui/media/EqBars.svelte';
import ListRow from '$lib/components/ui/ListRow.svelte'; import ListRow from '$lib/components/ui/media/ListRow.svelte';
import SectionHeading from '$lib/components/ui/SectionHeading.svelte'; import SectionHeading from '$lib/components/ui/layout/SectionHeading.svelte';
import EmptyState from '$lib/components/ui/EmptyState.svelte'; import EmptyState from '$lib/components/ui/primitives/EmptyState.svelte';
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import ContextMenu from '$lib/components/ui/ContextMenu.svelte'; import ContextMenu from '$lib/components/ui/overlay/ContextMenu.svelte';
import ListPlus from '@lucide/svelte/icons/list-plus'; import ListPlus from '@lucide/svelte/icons/list-plus';
import { createTrackMenu } from '$lib/state/menus.svelte'; import { createTrackMenu } from '$lib/state/menus.svelte';
import { HOME_CONTINUE_LIMIT, HOME_POPULAR_MAX } from '$lib/config'; import { HOME_CONTINUE_LIMIT, HOME_POPULAR_MAX } from '$lib/config';
web-player/src/routes/login/+page.svelte
+2 -2
View File
@@ -1,6 +1,6 @@
<script lang="ts"> <script lang="ts">
import Button from '$lib/components/ui/Button.svelte'; import Button from '$lib/components/ui/primitives/Button.svelte';
import Logo from '$lib/components/ui/Logo.svelte'; import Logo from '$lib/components/ui/primitives/Logo.svelte';
let { data } = $props(); let { data } = $props();