Published empty on purpose: identity is the expensive part to change later, the feature is the cheap part to add. One route, two placeholder panels, no tables and no sidecar.
30 lines
1.0 KiB
TypeScript
30 lines
1.0 KiB
TypeScript
import { useClient } from "hooks/useClient";
|
|
import { useQuery } from "@tanstack/react-query";
|
|
|
|
// Placeholder. It proves the route mounts and the panel renders, and nothing else.
|
|
export const FinancesOverview = () => {
|
|
const client = useClient();
|
|
const { data, isLoading } = useQuery({
|
|
queryKey: ["finances", "ping"],
|
|
queryFn: () =>
|
|
client.get<{ plugin: string; ok: boolean }>("/finances/ping"),
|
|
});
|
|
|
|
return (
|
|
<div className="h-full overflow-auto p-6">
|
|
<h2 className="text-lg font-semibold text-duck-dark">Finances</h2>
|
|
<p className="mt-1 text-sm text-duck-dark/60">
|
|
Nothing here yet — the skeleton is up and mounted.
|
|
</p>
|
|
<div className="mt-4 rounded-md border border-duck-dark/10 bg-duck-dark/[0.02] p-3 font-mono text-xs">
|
|
<div className="mb-1 text-duck-dark/50">GET /api/finances/ping</div>
|
|
{isLoading ? (
|
|
<span className="text-duck-dark/40">…</span>
|
|
) : (
|
|
<span>{JSON.stringify(data)}</span>
|
|
)}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|