Update readme, move frontend build to build phase in dockerfile

2026-06-02 10:50:30 -07:00
parent 430f33383b
commit b331a806ca
16 changed files with 371 additions and 38 deletions
@@ -0,0 +1,55 @@
+import { A } from "@solidjs/router"
+import { Show } from "solid-js"
+import { getProfilePicture } from "applesauce-core/helpers/profile"
+import { invoiceStatus, type Invoice } from "@/lib/api"
+import { useProfileMetadata } from "@/lib/hooks"
+import { formatPeriod, formatUsd } from "@/lib/format"
+import { shortenPubkey } from "@/lib/pubkey"
+
+const invoiceStatusStyles: Record<string, string> = {
+  open: "bg-yellow-50 text-yellow-700 border-yellow-200",
+  paid: "bg-green-50 text-green-700 border-green-200",
+  void: "bg-gray-100 text-gray-500 border-gray-200",
+}
+
+type AdminInvoiceListItemProps = {
+  invoice: Invoice
+  href: string
+}
+
+export default function AdminInvoiceListItem(props: AdminInvoiceListItemProps) {
+  // Resolve the owning tenant's profile from the event store. AdminInvoiceList
+  // primes these profiles in one batch, so this subscription does not prime.
+  const metadata = useProfileMetadata(() => props.invoice.tenant_pubkey, { prime: false })
+
+  const status = () => invoiceStatus(props.invoice)
+
+  return (
+    <li>
+      <A href={props.href} class="block rounded-lg border border-gray-200 bg-white p-4 hover:border-gray-300">
+        <div class="flex items-center justify-between gap-3">
+          <div class="min-w-0">
+            <p class="font-medium text-gray-900">{formatUsd(props.invoice.amount)}</p>
+            <p class="text-xs text-gray-500">{formatPeriod(props.invoice.period_start, props.invoice.period_end)}</p>
+            <div class="mt-1.5 flex items-center gap-2">
+              <Show
+                when={getProfilePicture(metadata())}
+                fallback={
+                  <div class="h-5 w-5 flex-shrink-0 rounded-full bg-gray-200 flex items-center justify-center text-[10px] text-gray-500">
+                    {((metadata()?.name || metadata()?.display_name) || props.invoice.tenant_pubkey).slice(0, 1).toUpperCase()}
+                  </div>
+                }
+              >
+                <img src={getProfilePicture(metadata())} alt="" class="h-5 w-5 flex-shrink-0 rounded-full object-cover" />
+              </Show>
+              <span class="text-xs text-gray-500 truncate">{(metadata()?.name || metadata()?.display_name) || shortenPubkey(props.invoice.tenant_pubkey)}</span>
+            </div>
+          </div>
+          <span class={`inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-medium capitalize ${invoiceStatusStyles[status()] ?? "bg-gray-100 text-gray-500 border-gray-200"}`}>
+            {status()}
+          </span>
+        </div>
+      </A>
+    </li>
+  )
+}