enricobuehler
ae51276a03
Web console - Pairing/Library/Stats refactored into self-contained subsections that each own their own queries + mutations; a shared slot-based layout (view.tsx) is filled by the live page (containers) and Storybook (pure cards + fixtures) so the layout can't drift. - All paired devices in one list on Pairing with a protocol column (punktfunk/1 + Moonlight), routing each unpair to the right endpoint; the redundant Clients page is removed. - Library: overview grid split from the add/edit form into separate files. - Login screen links out to the docs. Docs - "Console login password" section on every host page (apt/RPM/Bazzite/SteamOS/Windows) plus a new "Forgot your Password?" troubleshooting page, linked from the login screen. - Console served as HTTP/1.1 over TLS (drop the unusable HTTP/3 advertising) across the Bun entry, launchers, systemd units, and packaging. Tooling - Biome now respects .gitignore (stops linting generated code), config migrated to 2.5.1; all lint issues fixed cleanly. Also includes this branch's in-progress host, Apple client, packaging, and CI changes. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
85 lines
2.2 KiB
TypeScript
85 lines
2.2 KiB
TypeScript
import type { Meta, StoryObj } from "@storybook/react-vite";
|
|
import { MoonlightPairing } from "@/sections/Pairing/MoonlightPairingCard";
|
|
import { NativePairingCard } from "@/sections/Pairing/NativePairingCard";
|
|
import { PairedDevices } from "@/sections/Pairing/PairedDevices";
|
|
import { PendingDevices } from "@/sections/Pairing/PendingDevices";
|
|
import { PairingView } from "@/sections/Pairing/view";
|
|
import {
|
|
nativeClients,
|
|
nativePairArmed,
|
|
pairedClients,
|
|
pairingIdle,
|
|
pendingDevices,
|
|
} from "./lib/fixtures";
|
|
|
|
const noop = () => {};
|
|
const idle = { isLoading: false, error: null, refetch: noop };
|
|
|
|
// Renders the REAL page layout (PairingView) — the same component index.tsx uses. The live page
|
|
// fills its slots with the self-contained containers; here we fill them with the pure cards + mock
|
|
// state, so there's no duplicated composition to drift.
|
|
const meta = {
|
|
title: "Pages/Pairing",
|
|
component: PairingView,
|
|
parameters: { layout: "padded" },
|
|
} satisfies Meta<typeof PairingView>;
|
|
|
|
export default meta;
|
|
type Story = StoryObj<typeof meta>;
|
|
|
|
// The marketing state: one device knocking for delegated approval, a PIN armed for a phone, the
|
|
// consolidated paired-devices list (native + Moonlight), idle Moonlight pairing.
|
|
export const Armed: Story = {
|
|
args: {
|
|
pending: (
|
|
<PendingDevices
|
|
pending={{ data: pendingDevices, ...idle }}
|
|
onApprove={noop}
|
|
onDeny={noop}
|
|
busy={false}
|
|
/>
|
|
),
|
|
native: (
|
|
<NativePairingCard
|
|
status={{ data: nativePairArmed, ...idle }}
|
|
onArm={noop}
|
|
onDisarm={noop}
|
|
isArming={false}
|
|
isDisarming={false}
|
|
/>
|
|
),
|
|
moonlight: (
|
|
<MoonlightPairing
|
|
pairing={{ data: pairingIdle, ...idle }}
|
|
pin=""
|
|
onPinChange={noop}
|
|
onSubmit={noop}
|
|
isSubmitting={false}
|
|
isSuccess={false}
|
|
isError={false}
|
|
/>
|
|
),
|
|
paired: (
|
|
<PairedDevices
|
|
rows={[
|
|
...nativeClients.map((c) => ({
|
|
protocol: "native" as const,
|
|
fingerprint: c.fingerprint,
|
|
name: c.name,
|
|
})),
|
|
...pairedClients.map((c) => ({
|
|
protocol: "moonlight" as const,
|
|
fingerprint: c.fingerprint,
|
|
name: c.subject ?? "",
|
|
})),
|
|
]}
|
|
isLoading={false}
|
|
error={null}
|
|
refetch={noop}
|
|
onUnpair={noop}
|
|
isUnpairing={false}
|
|
/>
|
|
),
|
|
},
|
|
};
|