Something went wrong. Try again.
Starship Simulator Controls thoriumsim.com
Something went wrong. Try again.
2.3 kB · 78 lines
TSX
at develop
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879import { q } from "@thorium/context/AppContext";import { toast } from "@thorium/context/ToastContext";import { usePrompt } from "@thorium/ui/AlertDialog";import Button from "@thorium/ui/Button";import { useMenubar } from "@thorium/ui/Menubar";import SearchableList from "@thorium/ui/SearchableList";import { Fragment } from "react";import { useNavigate, Outlet } from "react-router";
import type { Route } from "./+types/layout";
export default function TextPatternList({ params: { pluginId, textPatternId },}: Route.ComponentProps) { useMenubar({ backTo: `/config/${pluginId}/list` });
const navigate = useNavigate(); const prompt = usePrompt(); const [data] = q.plugin.textPattern.all.useNetRequest({ pluginId }); const textPattern = data.find((d) => d.name === textPatternId);
return ( <div className="h-[calc(100%-2rem)] p-8"> <h1 className="mb-4 text-3xl font-bold text-white">Text Pattern Config</h1> <div className="flex h-[calc(100%-3rem)] gap-8"> <div className="flex h-full w-80 flex-col"> <Button className="btn-success btn-sm w-full" onClick={async () => { const name = await prompt({ header: "Enter text pattern name", }); if (typeof name !== "string") return; try { const result = await q.plugin.textPattern.create.netSend({ name, pluginId, }); void navigate(`${result.textPatternId}`); } catch (err) { if (err instanceof Error) { toast({ title: "Error creating text pattern", body: err.message, color: "error", }); return; } } }} > New Text Pattern </Button>
<SearchableList items={data.map((d) => ({ id: d.name, name: d.name, description: d.description, category: d.category, }))} searchKeys={["name"]} selectedItem={textPatternId || null} setSelectedItem={({ id }) => navigate(`${id}`)} renderItem={(c) => ( <div className="flex items-center justify-between" key={c.id}> <div>{c.name}</div> </div> )} /> </div> <Fragment key={textPattern?.name}> <Outlet /> </Fragment> </div> </div> );}