empty like the one below it, and for the same reason: the block settles the shape and says what is coming, while what goes in it is not decided. the order is the order things are needed in — where the site is on this machine, then how to read its data. this is the block list paying for itself. adding the second setting was one entry and moved nothing, which is what the previous commit chose it for. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
63 lines
2.5 KiB
TypeScript
63 lines
2.5 KiB
TypeScript
import { Database, FolderRoot } from 'lucide-react';
|
|
|
|
/**
|
|
* Administration — this plugin's own machinery, not the client's site.
|
|
*
|
|
* ── It is a list of blocks ──
|
|
*
|
|
* Not one form. Administration holds several unrelated settings, and giving each its own titled block
|
|
* means adding the next one moves nothing — as against a single form that has to be broken up the
|
|
* first time anything joins it. The second block cost one entry, which is the point.
|
|
*
|
|
* The order is the order things are needed in: where the site is on disk, then how to read its data.
|
|
*
|
|
* ── What used to be here ──
|
|
*
|
|
* An address and a token: where fofos is, over HTTP. That is gone. It has NOT been replaced yet, so
|
|
* nothing can currently configure this plugin — which is why `useReady` stays hardcoded false and
|
|
* every other section stays locked. The two are the same change and neither is finished.
|
|
*
|
|
* The server half is untouched: `/_config` still stores a URL and a token, and the proxy in
|
|
* `api/router.ts` still reads them. Only the way in from the screen is gone.
|
|
*/
|
|
|
|
/** One titled block. The shape every Administration setting gets, so the second one costs nothing. */
|
|
const Block = ({
|
|
icon: Icon,
|
|
title,
|
|
hint,
|
|
children,
|
|
}: {
|
|
icon: typeof Database;
|
|
title: string;
|
|
hint: string;
|
|
children?: React.ReactNode;
|
|
}) => (
|
|
<section className="flex flex-col gap-3 rounded-lg border border-border p-4">
|
|
<div className="space-y-1">
|
|
<h3 className="flex items-center gap-2 text-sm font-medium">
|
|
<Icon className="size-4" />
|
|
{title}
|
|
</h3>
|
|
<p className="text-xs text-muted-foreground">{hint}</p>
|
|
</div>
|
|
{children}
|
|
</section>
|
|
);
|
|
|
|
export const AdministrationPanel = () => (
|
|
<div className="flex size-full flex-col gap-4 overflow-auto p-5">
|
|
<Block icon={FolderRoot} title="Root location" hint="Where the fofos site is on this machine.">
|
|
{/* Empty for the same reason as Database, below. */}
|
|
<p className="text-xs text-muted-foreground/70">Nothing to set yet.</p>
|
|
</Block>
|
|
|
|
<Block icon={Database} title="Database" hint="Where the fofos site's own data lives.">
|
|
{/* Deliberately empty. The block exists so the shape is settled and so the screen says what is
|
|
coming rather than looking like a section nobody finished — but nothing is decided about what
|
|
goes in it, and guessing at fields would be a decision made in the wrong place. */}
|
|
<p className="text-xs text-muted-foreground/70">Nothing to set yet.</p>
|
|
</Block>
|
|
</div>
|
|
);
|