Something went wrong. Try again.
Starship Simulator Controls thoriumsim.com
Something went wrong. Try again.
2.6 kB · 85 lines
TSX
at develop
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586import { DocViewer } from "@thorium/cards/Documents/DocViewer";import { q } from "@thorium/context/AppContext";import { useStation } from "@thorium/routes/station/useStation";import { usePrompt } from "@thorium/ui/AlertDialog";import Button from "@thorium/ui/Button";import { FilesMenu } from "@thorium/ui/FilesMenu";import { Icon } from "@thorium/ui/Icon";import { cn } from "@thorium/utils/cn";import { useState } from "react";import { Button as RAButton } from "react-aria-components";
export function DocumentsCore() { const { shipId } = useStation(); const [documents] = q.documents.get.useNetRequest({ shipId }); const [selectedDoc, setSelectedDoc] = useState<number | null>(null); const [selectedFile, setSelectedFile] = useState<string | undefined>(); const doc = documents.find((d) => d.id === selectedDoc);
const prompt = usePrompt(); return ( <div className="grid h-full grid-cols-3 overflow-hidden"> <div className="flex h-full min-h-0 flex-col"> <ul className="overflow-y flex-1"> {documents.map((doc) => ( <li key={doc.id} className={cn( "list-group-item list-group-item-small flex justify-between items-center", { selected: selectedDoc === doc.id, }, )} onClick={() => setSelectedDoc(doc.id)} > {doc.name} <Button className="btn-ghost btn-xs" onClick={(event) => { event.stopPropagation(); q.documents.removeDocument.netSend({ documentId: doc.id }); }} > <Icon name="ban" className="text-red-500" /> </Button> </li> ))} </ul> <div className="flex gap-2"> <FilesMenu types={["images", "pdf", "sounds", "videos"]} setValue={setSelectedFile} value={selectedFile} root="Documents" canUpload > <RAButton className="btn btn-xs flex-1 justify-start text-left"> {selectedFile?.split("/").at(-1) || "Pick File"} </RAButton> </FilesMenu> <Button className="btn-xs btn-success flex-1" disabled={!selectedFile} onClick={async () => { if (!selectedFile) return; const name = await prompt("What is the name of the document?"); if (!name) return; const { id } = await q.documents.addDocument.netSend({ shipId, name, file: selectedFile, }); setSelectedFile(undefined); setSelectedDoc(id); }} > Add Document </Button> </div> </div> <div className="relative col-span-2 overflow-hidden"> {doc ? <DocViewer {...doc} /> : null} </div> </div> );}