File size: 3,099 Bytes
251a574 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 | import { For, Show } from "solid-js"
import type { LookupResult, WorkspaceSection } from "~/lib/lookup"
export function Result(props: { data: LookupResult }) {
return (
<>
<Show when={props.data.auth}>
{(auth) => (
<section data-component="section">
<h2>Auth</h2>
<DataTable rows={auth()} />
</section>
)}
</Show>
<Show when={props.data.accountWorkspaces}>
{(workspaces) => (
<section data-component="section">
<h2>Workspaces</h2>
<DataTable rows={workspaces()} />
</section>
)}
</Show>
<For each={props.data.workspaces}>{(ws) => <WorkspaceView section={ws} />}</For>
</>
)
}
function WorkspaceView(props: { section: WorkspaceSection }) {
return (
<section data-component="section" id={`workspace-${props.section.workspaceID}`}>
<h2>{props.section.title}</h2>
<h3>Users</h3>
<DataTable rows={props.section.users} />
<h3>Billing</h3>
<DataTable rows={props.section.billing ? [props.section.billing] : []} />
<h3>GO</h3>
<DataTable rows={props.section.go} />
<h3>Payments</h3>
<DataTable rows={props.section.payments} />
<h3>28-Day Usage</h3>
<DataTable rows={props.section.usage} />
<h3>Disabled Models</h3>
<DataTable rows={props.section.disabledModels} />
</section>
)
}
function DataTable(props: { rows: Record<string, unknown>[] }) {
const columns = () => {
const cols = new Set<string>()
for (const row of props.rows) {
for (const key of Object.keys(row)) cols.add(key)
}
return [...cols]
}
return (
<Show when={props.rows.length > 0} fallback={<div data-empty>(no data)</div>}>
<table>
<thead>
<tr>
<For each={columns()}>{(col) => <th>{col}</th>}</For>
</tr>
</thead>
<tbody>
<For each={props.rows}>
{(row) => (
<tr>
<For each={columns()}>{(col) => <td>{renderCell(row[col])}</td>}</For>
</tr>
)}
</For>
</tbody>
</table>
</Show>
)
}
function renderCell(value: unknown) {
if (value === null || value === undefined) return ""
if (typeof value === "string" && value.startsWith("https://")) {
return (
<a href={value} target="_blank" rel="noopener noreferrer">
{value}
</a>
)
}
if (isLinkCell(value)) {
const external = value.__link.startsWith("http")
return (
<a
href={value.__link}
target={external ? "_blank" : undefined}
rel={external ? "noopener noreferrer" : undefined}
>
{value.label}
</a>
)
}
if (typeof value === "object") return JSON.stringify(value)
return String(value)
}
function isLinkCell(value: unknown): value is { __link: string; label: string } {
return (
typeof value === "object" &&
value !== null &&
"__link" in value &&
typeof (value as { __link: unknown }).__link === "string"
)
}
|