chore: Svelte 5 migration & lint & type fixes (#24)
* fix formatting * apply svelte-5 migration script * use derived.by * format again * fix lint errors * fix check errors * fix unnecessary use of dismissedVersion * add frontend CI * set working dir to frontend * fix working dir? * and fix script names * revert debug change * add concurrency block & adjust pnpm cache-dependency-path
This commit is contained in:
@@ -17,7 +17,10 @@
|
||||
import { eqStore } from '$lib/stores/eq.svelte';
|
||||
import Player from '$lib/components/Player.svelte';
|
||||
import CacheSyncIndicator from '$lib/components/CacheSyncIndicator.svelte';
|
||||
import AddToPlaylistModal, { registerPlaylistModal, unregisterPlaylistModal } from '$lib/components/AddToPlaylistModal.svelte';
|
||||
import AddToPlaylistModal, {
|
||||
registerPlaylistModal,
|
||||
unregisterPlaylistModal
|
||||
} from '$lib/components/AddToPlaylistModal.svelte';
|
||||
import { syncStatus } from '$lib/stores/syncStatus.svelte';
|
||||
import YouTubeIcon from '$lib/components/YouTubeIcon.svelte';
|
||||
import NavidromeIcon from '$lib/components/NavidromeIcon.svelte';
|
||||
@@ -32,7 +35,21 @@
|
||||
import { requestCountStore } from '$lib/stores/requestCountStore.svelte';
|
||||
import { createNavigationProgressController } from '$lib/utils/navigationProgress';
|
||||
import { fromStore } from 'svelte/store';
|
||||
import { Settings, Search, House, Compass, Menu, Headphones, Download, PanelLeft, TriangleAlert, Info, X, UserRound, Check, ListMusic } from 'lucide-svelte';
|
||||
import {
|
||||
Settings,
|
||||
Search,
|
||||
House,
|
||||
Compass,
|
||||
Menu,
|
||||
Headphones,
|
||||
Download,
|
||||
PanelLeft,
|
||||
TriangleAlert,
|
||||
Info,
|
||||
X,
|
||||
UserRound,
|
||||
ListMusic
|
||||
} from 'lucide-svelte';
|
||||
import type { Snippet } from 'svelte';
|
||||
|
||||
let { children }: { children: Snippet } = $props();
|
||||
@@ -73,8 +90,6 @@
|
||||
libraryStore.refreshIfStale(10_000);
|
||||
});
|
||||
|
||||
|
||||
|
||||
let cleanupResumeListeners: (() => void) | null = null;
|
||||
|
||||
onMount(() => {
|
||||
@@ -180,7 +195,9 @@
|
||||
} else {
|
||||
playerStore.resumeSession();
|
||||
}
|
||||
} catch {}
|
||||
} catch {
|
||||
// Ignore errors
|
||||
}
|
||||
}
|
||||
|
||||
function handleSearch() {
|
||||
@@ -219,7 +236,7 @@
|
||||
|
||||
<div data-theme="musicseerr">
|
||||
{#if showNavigationProgress}
|
||||
<div class="fixed top-0 left-0 right-0 z-[120] pointer-events-none">
|
||||
<div class="fixed top-0 left-0 right-0 z-120 pointer-events-none">
|
||||
<progress class="progress progress-primary w-full h-1"></progress>
|
||||
</div>
|
||||
{/if}
|
||||
@@ -236,20 +253,20 @@
|
||||
<img src="/logo_wide.png" alt="Musicseerr" class="h-8" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="navbar-center grow px-4 justify-center">
|
||||
<div class="navbar-center grow px-4 justify-center">
|
||||
<div class="w-full max-w-2xl">
|
||||
<SearchSuggestions
|
||||
bind:query
|
||||
onSearch={handleSearch}
|
||||
onSelect={handleSuggestionSelect}
|
||||
id="navbar-suggest"
|
||||
/>
|
||||
</div>
|
||||
<SearchSuggestions
|
||||
bind:query
|
||||
onSearch={handleSearch}
|
||||
onSelect={handleSuggestionSelect}
|
||||
id="navbar-suggest"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="navbar-end w-auto pr-2">
|
||||
<a href="/profile" class="btn btn-ghost btn-circle btn-md" aria-label="Profile">
|
||||
<UserRound class="h-6 w-6" />
|
||||
</a>
|
||||
<a href="/profile" class="btn btn-ghost btn-circle btn-md" aria-label="Profile">
|
||||
<UserRound class="h-6 w-6" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -265,18 +282,18 @@
|
||||
>
|
||||
<ul class="menu w-full grow p-2 [&_li>*]:py-3">
|
||||
<li>
|
||||
<button
|
||||
onclick={() =>
|
||||
(document.getElementById('search_modal') as HTMLDialogElement)?.showModal()}
|
||||
class="is-drawer-close:tooltip is-drawer-close:tooltip-right"
|
||||
data-tip="Search"
|
||||
>
|
||||
<Search class="h-6 w-6" />
|
||||
<span class="is-drawer-close:hidden">Search</span>
|
||||
</button>
|
||||
</li>
|
||||
<button
|
||||
onclick={() =>
|
||||
(document.getElementById('search_modal') as HTMLDialogElement)?.showModal()}
|
||||
class="is-drawer-close:tooltip is-drawer-close:tooltip-right"
|
||||
data-tip="Search"
|
||||
>
|
||||
<Search class="h-6 w-6" />
|
||||
<span class="is-drawer-close:hidden">Search</span>
|
||||
</button>
|
||||
</li>
|
||||
|
||||
<div class="divider my-0"></div>
|
||||
<div class="divider my-0"></div>
|
||||
|
||||
<li>
|
||||
<a
|
||||
@@ -310,7 +327,10 @@
|
||||
<div class="relative">
|
||||
<Menu class="h-6 w-6" />
|
||||
{#if syncStatus.isActive}
|
||||
<span class="absolute -top-1 -right-1 badge badge-primary badge-xs w-2.5 h-2.5 p-0 animate-pulse" aria-label="Library sync in progress"></span>
|
||||
<span
|
||||
class="absolute -top-1 -right-1 badge badge-primary badge-xs w-2.5 h-2.5 p-0 animate-pulse"
|
||||
aria-label="Library sync in progress"
|
||||
></span>
|
||||
{/if}
|
||||
</div>
|
||||
<span class="is-drawer-close:hidden">Library</span>
|
||||
@@ -427,11 +447,7 @@
|
||||
</ul>
|
||||
<div class="w-full p-2 flex flex-col gap-1" class:pb-24={playerStore.isPlayerVisible}>
|
||||
<div class="is-drawer-close:tooltip is-drawer-close:tooltip-right" data-tip="Settings">
|
||||
<a
|
||||
href="/settings"
|
||||
class="btn btn-ghost btn-circle"
|
||||
aria-label="Settings"
|
||||
>
|
||||
<a href="/settings" class="btn btn-ghost btn-circle" aria-label="Settings">
|
||||
<Settings class="h-6 w-6" />
|
||||
</a>
|
||||
</div>
|
||||
@@ -498,7 +514,7 @@
|
||||
{#if $errorModal.details}
|
||||
<div class="mt-4 rounded-box bg-base-300/60 border border-base-300 p-4">
|
||||
<div class="flex gap-3 items-start">
|
||||
<Info class="h-5 w-5 text-info flex-shrink-0 mt-0.5" />
|
||||
<Info class="h-5 w-5 text-info shrink-0 mt-0.5" />
|
||||
<p class="text-sm text-base-content/80 leading-relaxed text-left">
|
||||
{$errorModal.details}
|
||||
</p>
|
||||
@@ -512,6 +528,8 @@
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- svelte-ignore a11y_no_noninteractive_element_interactions -->
|
||||
<!-- svelte-ignore a11y_click_events_have_key_events -->
|
||||
<form method="dialog" class="modal-backdrop" onclick={() => errorModal.hide()}>
|
||||
<button>close</button>
|
||||
</form>
|
||||
@@ -531,11 +549,11 @@
|
||||
: 'alert-info'} shadow-lg px-4 py-2 min-w-64 max-w-md"
|
||||
>
|
||||
{#if playbackToast.type === 'error'}
|
||||
<X class="h-5 w-5 flex-shrink-0" />
|
||||
<X class="h-5 w-5 shrink-0" />
|
||||
{:else if playbackToast.type === 'warning'}
|
||||
<TriangleAlert class="h-5 w-5 flex-shrink-0" />
|
||||
<TriangleAlert class="h-5 w-5 shrink-0" />
|
||||
{:else}
|
||||
<Info class="h-5 w-5 flex-shrink-0" />
|
||||
<Info class="h-5 w-5 shrink-0" />
|
||||
{/if}
|
||||
<span class="text-sm">{playbackToast.message}</span>
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user