pastilhasandClaude Opus 5
176fb19950
The reference plugin — deliberately the smallest thing that is still a real plugin, and what EXTRACTING-A-PLUGIN.md sends people to read. It leaves the platform tree with music and offscale, so that `plugins/` in the platform repository holds documentation and nothing else. That is the point of the move: a directory that contains both tracked source and untracked installs is one where "is this mine or is this installed" has no answer you can see. Same extraction as the two before it: source only, no history. The platform's history still holds every commit that shaped this. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
28 lines
1.2 KiB
TypeScript
28 lines
1.2 KiB
TypeScript
import { useClient } from 'hooks/useClient';
|
|
import { useQuery } from '@tanstack/react-query';
|
|
|
|
// A panel, not a screen. It gets whatever space the layout gives it and knows nothing about routing.
|
|
//
|
|
// `useClient` comes from the platform's workspace packages, resolved because a plugin lives inside the
|
|
// repository — no publishing, no version negotiation. This is the whole plugin↔host API in one line.
|
|
export const ExampleOverview = () => {
|
|
const client = useClient();
|
|
const { data, isLoading } = useQuery({
|
|
queryKey: ['example', 'ping'],
|
|
queryFn: () => client.get<{ plugin: string; ok: boolean }>('/example/ping'),
|
|
});
|
|
|
|
return (
|
|
<div className="h-full overflow-auto p-6">
|
|
<h2 className="text-lg font-semibold text-duck-dark">Example</h2>
|
|
<p className="mt-1 text-sm text-duck-dark/60">
|
|
A panel from <code>plugins/example/web/</code>, rendered by the shell's <code>WorkspaceView</code>.
|
|
</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/example/ping</div>
|
|
{isLoading ? <span className="text-duck-dark/40">…</span> : <span>{JSON.stringify(data)}</span>}
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|