peter/siftlode
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(nav): tabs, list views and name searches are named in the address

Browse Source 
Settings, Configuration and Users name their tab (stab/cfgtab/utab); a link's tab wins and a tab pre-selected
while its page is on screen now switches it. A playlist's sort, filters and grouping (plsort/plf/plgroup), the
Files sort (fsort, always written) and the name searches of Channels, Files, Playlists and Plex (cq/fq/plq/pq+pqf)
reopen from the address; the searches are written once the typing pauses.
This commit is contained in:
peter
2026-10-26 01:13:39 +01:00
parent 91d36b3357
commit d4f24de4ba
34 changed files with 728 additions and 130 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/lib/channelsUrlState.ts
+12 -36
View File
@@ -3,10 +3,11 @@
// urlState and Plex's plexUrlState. Keys are NAMESPACED (`ctab`/`csort`/`cf`) so they're
// channels-unique (like `?v=`/`?pl`/`pscope`): no other provider ever reads or clears them, and the
// feed's URL-stripping can't delete them out from under the manager. Only non-default values are
// emitted, so URLs stay clean. The manager's name search is deliberately EPHEMERAL (like the feed/plex
// rail search) and stays OUT of the shared contract.
// emitted, so URLs stay clean. The name search (`cq`) is part of the view like the rest: a bookmark of a
// searched list opens searched.
import { decodeSortParam, encodeSortParam, type SortState } from "./columnSort";
import { type FilterMap } from "./tableColumns";
import { decodeFilterMap, encodeFilterMap } from "./filterMapParam";
// The content state this mirrors. `view` is the raw tab string (the provider clamps it); `sort` is the
// raw provider SortState (healed against live columns only at the point of use), so the user's real
@@ -15,43 +16,16 @@ export interface ChannelsUrlState {
view: string;
sort: SortState;
filters: FilterMap;
search: string;
}
export const CHANNELS_KEYS = ["ctab", "csort", "cf"] as const;
export const CHANNELS_KEYS = ["ctab", "csort", "cf", "cq"] as const;
const KEYS = CHANNELS_KEYS;
const VIEWS = ["subscribed", "discovery", "hidden", "blocked"];
// Sort ⇄ `key:dir` (e.g. `subscribers:desc`) via the shared codec in columnSort. There is no default
// sort here (fallback null), so any sort emits — no default short-circuit needed.
// The FilterMap mixes scalar column filters (priority=select, name=text, the sync chip) with array ones
// (tags=multi), so it's carried as a compact JSON blob rather than a nested query string — JSON round-
// trips both shapes exactly (and future multi columns for free), and the values are opaque enum/id
// tokens where a readable querystring buys little. Empty entries are dropped so a cleared funnel emits
// no `cf`.
function encodeFilters(map: FilterMap): string | null {
const clean: FilterMap = {};
for (const [k, v] of Object.entries(map)) {
if (Array.isArray(v) ? v.length : v) clean[k] = v;
}
return Object.keys(clean).length ? JSON.stringify(clean) : null;
}
// A URL blob is untrusted input: accept only a plain object of string / string[] entries, anything else
// heals to empty (same discipline as useFilterState's storage hydrate).
function decodeFilters(raw: string): FilterMap {
try {
const v = JSON.parse(raw);
if (!v || typeof v !== "object" || Array.isArray(v)) return {};
const out: FilterMap = {};
for (const [k, val] of Object.entries(v)) {
if (typeof val === "string") out[k] = val;
else if (Array.isArray(val) && val.every((x) => typeof x === "string"))
out[k] = val as string[];
}
return out;
} catch {
return {};
}
}
// sort here (fallback null), so any sort emits — no default short-circuit needed. The filter map rides
// as one JSON value (lib/filterMapParam).
/** The address-bar delta for the manager content state: each namespaced key mapped to its emitted
* value, or null to delete it (so a control back at its default clears the key). Pass `null` to clear
@@ -60,11 +34,12 @@ function decodeFilters(raw: string): FilterMap {
export function channelsParamUpdates(
state: ChannelsUrlState | null,
): Record<string, string | null> {
if (!state) return { ctab: null, csort: null, cf: null };
if (!state) return { ctab: null, csort: null, cf: null, cq: null };
return {
ctab: state.view && state.view !== "subscribed" ? state.view : null,
csort: encodeSortParam(state.sort),
cf: encodeFilters(state.filters),
cf: encodeFilterMap(state.filters),
cq: state.search.trim() || null,
};
}
@@ -84,6 +59,7 @@ export function channelsParamsToState(
return {
view: tab && VIEWS.includes(tab) ? tab : base.view,
sort: csort != null ? (decodeSortParam(csort) ?? base.sort) : base.sort,
filters: params.has("cf") ? decodeFilters(params.get("cf") ?? "") : base.filters,
filters: params.has("cf") ? decodeFilterMap(params.get("cf") ?? "") : base.filters,
search: params.get("cq") ?? base.search,
};
}