mirror of
https://github.com/Psychotoxical/psysonic.git
synced 2026-07-21 23:05:46 +00:00
d3e5a6b704
* feat(albums): restore scroll position when returning from album detail Save in-page scroll and grid depth when opening an album from All Albums, then on browser back restore filters, preload enough rows, and apply scroll before revealing the grid to avoid a visible jump from the top. * feat(albums): smart back navigation and restore browse session on return Remember the originating route when opening album detail, restore All Albums filters/scroll on back (including explicit returnTo navigation), hide the grid until scroll is applied, and fix filters being cleared after albumBrowseRestore state is stripped from the location. * feat(search): restore Advanced Search session when returning from album Stash filters and results when leaving /search/advanced for album detail, then restore them on back navigation (POP or returnTo with advancedSearchRestore). * feat(search): restore Advanced Search album row scroll on return from album Save horizontal scrollLeft when opening an album from Advanced Search and reapply it via AlbumRow on return; keep main viewport at top. Add snapshot helpers and session stash fields; extend AlbumRow with restoreScrollLeft. * feat(search): restore Advanced Search session scroll and artist return path Save filters, main scroll, and album-row scroll when leaving to album or artist; restore without flash via hidden-until-ready. Add useNavigateToArtist, restoreMainViewportScroll helper, and AppShell scroll reset only on pathname change. * feat(search): speed up Advanced Search back restore and year-only queries Reveal the page right after sync scroll instead of blocking on full viewport and album-row restore. Retry local index without the ready gate during sync; use open-ended byYear params on network fallback, matching All Albums browse. * feat(search): restore Advanced Search artist row scroll on back Save leave snapshot when opening artist from ArtistCardLocal, persist artistRowScrollLeft in session stash, and keep row restore targets in refs so horizontal scroll survives finishLeaveRestoreUi like vertical scrollTop. * feat(nav): route mouse back on album/artist detail like UI back Trap history popstate when returnTo is set and call navigateAlbumDetailBack so browser/mouse back restores browse/search session the same way as the header button. * feat(artists): restore browse filters and scroll on back from artist detail Persist Artists page filters, view settings, and vertical scroll when opening an artist and returning via UI or mouse back, matching All Albums behavior. * feat(search): unify quick and advanced search; fix LiveSearch dismiss on Enter Serve /search and /search/advanced from one page with shared session restore and scroll snapshot. Reset live search overlay state when navigating to full search so the dropdown does not linger or reopen. * feat(tracks): unify with search session and restore scroll on back Route /tracks through AdvancedSearch with shared leave snapshot, song browse stash, and main-viewport scroll restore when returning from album or artist detail. Wait for hero/rails layout before applying scroll. * refactor(search): rename AdvancedSearch page to SearchBrowsePage The shared route shell serves /search, /search/advanced, and /tracks; rename the page component and refresh stale file references in comments. * feat(albums): restore New Releases and Random Albums on back from detail Unify album grid leave-restore with surface-scoped session stash, live scroll snapshot sync, and in-page scroll for Random Albums. Keep the same random batch when returning from album detail; Refresh fetches anew and scrolls up. * docs: add CHANGELOG and credits for PR #936
258 lines
9.7 KiB
TypeScript
258 lines
9.7 KiB
TypeScript
import { useEffect, useMemo, useRef, useState } from 'react';
|
|
import { useLocation, useNavigate } from 'react-router-dom';
|
|
import { useTranslation } from 'react-i18next';
|
|
import { useAuthStore } from '../store/authStore';
|
|
import type { EntitySharePayloadV1 } from '../utils/share/shareLink';
|
|
import { decodeSharePayloadFromText } from '../utils/share/shareLink';
|
|
import { decodeServerMagicStringFromText } from '../utils/server/serverMagicString';
|
|
import { applySharePastePayload, applySharePasteQueue } from '../utils/share/applySharePaste';
|
|
import { shareQueueServerContext } from '../utils/share/shareServerOriginLabel';
|
|
import { showToast } from '../utils/ui/toast';
|
|
import { useShareQueuePreview } from '../hooks/useShareQueuePreview';
|
|
import ShareQueuePreviewModal from './search/ShareQueuePreviewModal';
|
|
import {
|
|
parseOrbitShareLink,
|
|
joinOrbitSession,
|
|
findSessionPlaylistId,
|
|
readOrbitState,
|
|
OrbitJoinError,
|
|
} from '../utils/orbit';
|
|
import { switchActiveServer } from '../utils/server/switchActiveServer';
|
|
import { useOrbitAccountPickerStore } from '../store/orbitAccountPickerStore';
|
|
import ConfirmModal from './ConfirmModal';
|
|
|
|
const ORBIT_JOIN_ERROR_KEYS: Record<string, string> = {
|
|
'not-found': 'orbit.joinErrNotFound',
|
|
'ended': 'orbit.joinErrEnded',
|
|
'full': 'orbit.joinErrFull',
|
|
'kicked': 'orbit.joinErrKicked',
|
|
'no-user': 'orbit.joinErrNoUser',
|
|
'server-error': 'orbit.joinErrServerError',
|
|
};
|
|
|
|
/**
|
|
* Global paste: library share links (`psysonic2-`) and server invites (`psysonic1-`)
|
|
* outside text fields. Shares require login; invites open add-server (settings or login).
|
|
*/
|
|
type QueuePastePayload = Extract<EntitySharePayloadV1, { k: 'queue' }>;
|
|
|
|
export default function PasteClipboardHandler() {
|
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
const { t } = useTranslation();
|
|
const isLoggedIn = useAuthStore(s => s.isLoggedIn);
|
|
const servers = useAuthStore(s => s.servers);
|
|
const activeServerId = useAuthStore(s => s.activeServerId);
|
|
const busy = useRef(false);
|
|
const [orbitConfirm, setOrbitConfirm] = useState<{ sid: string; host: string; name: string } | null>(null);
|
|
const [orbitInvalid, setOrbitInvalid] = useState(false);
|
|
const [queuePaste, setQueuePaste] = useState<QueuePastePayload | null>(null);
|
|
const [queuePasteBusy, setQueuePasteBusy] = useState(false);
|
|
const queuePreview = useShareQueuePreview(queuePaste, !!queuePaste);
|
|
const { label: queuePasteServerLabel, coverServer: queuePasteCoverServer } = useMemo(
|
|
() =>
|
|
queuePaste
|
|
? shareQueueServerContext(queuePaste.srv, servers, activeServerId)
|
|
: { label: null, coverServer: null },
|
|
[queuePaste, servers, activeServerId],
|
|
);
|
|
|
|
// `not-found` and `ended` collapse into a single "link no longer valid"
|
|
// dialog — from the guest's POV both mean the same thing: the invite
|
|
// doesn't lead anywhere any more. Other reasons stay as toasts because
|
|
// they're actionable (full → wait, kicked → talk to host, etc.).
|
|
const handleJoinError = (reason: string | null, fallback?: string) => {
|
|
if (reason === 'not-found' || reason === 'ended') {
|
|
setOrbitInvalid(true);
|
|
return;
|
|
}
|
|
const i18nKey = reason ? ORBIT_JOIN_ERROR_KEYS[reason] : null;
|
|
showToast(i18nKey ? t(i18nKey) : (fallback ?? t('orbit.toastJoinFail')), 4000, 'error');
|
|
};
|
|
|
|
const runOrbitJoin = (sid: string) => {
|
|
if (busy.current) return;
|
|
busy.current = true;
|
|
joinOrbitSession(sid)
|
|
.then(() => showToast(t('orbit.toastJoined'), 2500, 'info'))
|
|
.catch(err => {
|
|
if (err instanceof OrbitJoinError) handleJoinError(err.reason, err.message);
|
|
else handleJoinError(null);
|
|
})
|
|
.finally(() => { busy.current = false; });
|
|
};
|
|
|
|
useEffect(() => {
|
|
const onPaste = (e: ClipboardEvent) => {
|
|
const target = e.target as HTMLElement | null;
|
|
if (!target) return;
|
|
if (
|
|
target.tagName === 'INPUT' ||
|
|
target.tagName === 'TEXTAREA' ||
|
|
target.tagName === 'SELECT' ||
|
|
target.isContentEditable
|
|
) {
|
|
return;
|
|
}
|
|
const text = e.clipboardData?.getData('text/plain') ?? '';
|
|
|
|
// Orbit share link — handled before library shares.
|
|
const orbit = parseOrbitShareLink(text.trim());
|
|
if (orbit) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
if (!isLoggedIn) { showToast(t('orbit.toastLoginFirst'), 4000, 'info'); return; }
|
|
if (busy.current) return;
|
|
busy.current = true;
|
|
|
|
(async () => {
|
|
const active = useAuthStore.getState().getActiveServer();
|
|
const activeUrl = (active?.url ?? '').replace(/\/+$/, '');
|
|
const wantUrl = orbit.serverBase.replace(/\/+$/, '');
|
|
|
|
// Auto-switch to the link's target server if the user has an
|
|
// account registered for it. No account → clear error. Multiple
|
|
// accounts for the same URL → picker lets the user choose. The
|
|
// switch itself tears down any lingering orbit session (see
|
|
// switchActiveServer) so the join below starts clean.
|
|
if (activeUrl !== wantUrl) {
|
|
const candidates = useAuthStore.getState().servers
|
|
.filter(s => s.url.replace(/\/+$/, '') === wantUrl);
|
|
if (candidates.length === 0) {
|
|
showToast(t('orbit.toastNoAccountForServer', { url: wantUrl }), 5000, 'warning');
|
|
return;
|
|
}
|
|
const target = candidates.length === 1
|
|
? candidates[0]
|
|
: await useOrbitAccountPickerStore.getState().request(candidates);
|
|
if (!target) return; // cancelled
|
|
const switched = await switchActiveServer(target);
|
|
if (!switched) {
|
|
showToast(t('orbit.toastSwitchFailed', { url: wantUrl }), 5000, 'error');
|
|
return;
|
|
}
|
|
}
|
|
|
|
// Preview the session state so the confirm dialog can show the
|
|
// host and session name. Failures surface the same error toasts
|
|
// the join would, without ever showing the confirm.
|
|
const playlistId = await findSessionPlaylistId(orbit.sid);
|
|
if (!playlistId) { handleJoinError('not-found'); return; }
|
|
const state = await readOrbitState(playlistId);
|
|
if (!state) { handleJoinError('not-found'); return; }
|
|
if (state.ended) { handleJoinError('ended'); return; }
|
|
setOrbitConfirm({ sid: orbit.sid, host: state.host, name: state.name });
|
|
})()
|
|
.catch(() => handleJoinError(null))
|
|
.finally(() => { busy.current = false; });
|
|
return;
|
|
}
|
|
|
|
const share = decodeSharePayloadFromText(text);
|
|
if (share) {
|
|
if (!isLoggedIn) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
showToast(t('sharePaste.notLoggedIn'), 4000, 'info');
|
|
return;
|
|
}
|
|
if (busy.current || queuePaste) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
return;
|
|
}
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
if (share.k === 'queue') {
|
|
if (share.ids.length === 0) {
|
|
showToast(t('sharePaste.genericError'), 5000, 'error');
|
|
return;
|
|
}
|
|
setQueuePaste(share);
|
|
return;
|
|
}
|
|
busy.current = true;
|
|
void applySharePastePayload(share, navigate, t, location).finally(() => {
|
|
busy.current = false;
|
|
});
|
|
return;
|
|
}
|
|
const invite = decodeServerMagicStringFromText(text);
|
|
if (!invite) return;
|
|
if (busy.current) {
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
return;
|
|
}
|
|
e.preventDefault();
|
|
e.stopPropagation();
|
|
busy.current = true;
|
|
if (isLoggedIn) {
|
|
navigate('/settings', { state: { tab: 'server' as const, openAddServerInvite: invite } });
|
|
} else {
|
|
navigate('/login', { state: { openAddServerInvite: invite } });
|
|
}
|
|
queueMicrotask(() => {
|
|
busy.current = false;
|
|
});
|
|
};
|
|
document.addEventListener('paste', onPaste, true);
|
|
return () => document.removeEventListener('paste', onPaste, true);
|
|
}, [navigate, t, isLoggedIn, queuePaste]);
|
|
|
|
const closeQueuePaste = () => {
|
|
if (queuePasteBusy) return;
|
|
setQueuePaste(null);
|
|
};
|
|
|
|
const confirmQueuePaste = async () => {
|
|
if (!queuePaste || queuePasteBusy) return;
|
|
setQueuePasteBusy(true);
|
|
const ok = await applySharePasteQueue(queuePaste, t);
|
|
setQueuePasteBusy(false);
|
|
if (ok) setQueuePaste(null);
|
|
};
|
|
|
|
return (
|
|
<>
|
|
{queuePaste && (
|
|
<ShareQueuePreviewModal
|
|
open
|
|
onClose={closeQueuePaste}
|
|
payload={queuePaste}
|
|
preview={queuePreview}
|
|
shareServerLabel={queuePasteServerLabel}
|
|
coverServer={queuePasteCoverServer}
|
|
onEnqueue={() => void confirmQueuePaste()}
|
|
enqueueBusy={queuePasteBusy}
|
|
confirmLabel={t('sharePaste.playQueue')}
|
|
confirmBusyLabel={t('sharePaste.playQueueing')}
|
|
/>
|
|
)}
|
|
<ConfirmModal
|
|
open={!!orbitConfirm}
|
|
title={t('orbit.confirmJoinTitle')}
|
|
message={t('orbit.confirmJoinBody', {
|
|
host: orbitConfirm?.host ?? '',
|
|
name: orbitConfirm?.name ?? '',
|
|
})}
|
|
confirmLabel={t('orbit.confirmJoinConfirm')}
|
|
cancelLabel={t('orbit.confirmCancel')}
|
|
onConfirm={() => {
|
|
const sid = orbitConfirm?.sid;
|
|
setOrbitConfirm(null);
|
|
if (sid) runOrbitJoin(sid);
|
|
}}
|
|
onCancel={() => setOrbitConfirm(null)}
|
|
/>
|
|
<ConfirmModal
|
|
open={orbitInvalid}
|
|
title={t('orbit.invalidLinkTitle')}
|
|
message={t('orbit.invalidLinkBody')}
|
|
confirmLabel={t('orbit.exitOk')}
|
|
onConfirm={() => setOrbitInvalid(false)}
|
|
/>
|
|
</>
|
|
);
|
|
}
|