Files
manage/frontend/src/pages/service-tabs/stubs.tsx
T
Developer dd48214987 Frontend: Jellyfin Media + Requests tabs (Slice 5)
Replace the MediaTab and RequestsTab stubs with real implementations on
the Jellyfin service page.

MediaTab (pages/service-tabs/MediaTab.tsx): lifts the operational content
from the top-level Media page into an instance-scoped tab. Build controls,
status display, library counts, media DataTable, and pagination all read
the Jellyfin service id directly from the instance prop (replacing the old
URL-search-param service selector + dropdown). Row-click navigation to
the file browser is preserved (note: target /files is a cross-slice
dependency on slice 6's FilesTab).

RequestsTab (pages/service-tabs/RequestsTab.tsx): reads the absorbed
jellyseerr_url + jellyseerr_api_key from the Jellyfin instance config.
When unconfigured, renders a CTA to add the fields via the Config tab.
When configured, shows the Jellyseerr URL + an honest placeholder (no
requests backend endpoint exists yet -- out of scope for this slice).

service-tabs/index.ts updated to wire the new components; the
MediaTabStub/RequestsTabStub removed from stubs.tsx.

Note: this branch is based on main, not on mobile-responsive-parity, so
MediaTab lifts main's DataTable + TanStack column-visibility mobile
hiding (no MobileCardRow -- that lands when the branches reconcile).

Tests: MediaTab (instance-scoped hooks + build controls + table render)
+ RequestsTab (configured URL vs empty-state CTA). 90 tests pass (+6);
lint/build green.

Cross-slice flag: MediaTab row-click -> /files will 404 until slice 6
re-routes it to the ssh_tasks FilesTab.

Refs openspec/changes/services-as-hub-ia/ (spec R2.4, tasks slice 5).
2026-06-26 19:12:25 +00:00

62 lines
1.8 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
/**
* Service-page content tab stubs.
*
* Each stub renders a "coming soon" placeholder. Slices 59 replace these with
* real operational content lifted from the old top-level pages. All stubs accept
* an `instance` prop so the real implementations can scope queries by instance.
*/
import type { ServiceInstance } from "../../types";
import { Alert, AlertDescription } from "@/components/ui/alert";
function Stub({
label,
instance,
}: {
label: string;
instance: ServiceInstance;
}) {
return (
<Alert>
<AlertDescription>
{label} for {instance.name} coming soon.
</AlertDescription>
</Alert>
);
}
export function OverviewTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Service overview" instance={instance} />;
}
export function FilesTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Files" instance={instance} />;
}
export function ActionsTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Actions" instance={instance} />;
}
export function JobsTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Backup jobs" instance={instance} />;
}
export function UsersTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Users" instance={instance} />;
}
export function MessagingTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Messaging" instance={instance} />;
}
export function AlertsTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Alerts" instance={instance} />;
}
export function LinksTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Links" instance={instance} />;
}
export function MetricsTab({ instance }: { instance: ServiceInstance }) {
return <Stub label="Metrics" instance={instance} />;
}