chore: bump unkey

apps/server/package.json

@@ -28,7 +28,7 @@
     "@openstatus/utils": "workspace:*",
     "@scalar/hono-api-reference": "0.5.131",
     "@t3-oss/env-core": "0.7.1",
-    "@unkey/api": "0.23.0",
+    "@unkey/api": "0.26.1",
     "@upstash/qstash": "2.6.2",
     "hono": "4.5.3",
     "nanoid": "5.0.7",

apps/web/package.json

@@ -45,7 +45,7 @@
     "@trpc/next": "11.0.0-rc.666",
     "@trpc/react-query": "11.0.0-rc.666",
     "@trpc/server": "11.0.0-rc.666",
-    "@unkey/api": "0.23.0",
+    "@unkey/api": "0.26.1",
     "@upstash/qstash": "2.6.2",
     "@upstash/redis": "1.22.1",
     "@vercel/blob": "0.23.3",

apps/web/src/app/app/[workspaceSlug]/(dashboard)/settings/api-token/_components/actions.ts

@@ -7,6 +7,7 @@ import { user, usersToWorkspaces, workspace } from "@openstatus/db/src/schema";
 
 import { env } from "@/env";
 import { auth } from "@/lib/auth";
+import { revalidatePath } from "next/cache";
 
 const unkey = new Unkey({ token: env.UNKEY_TOKEN, cache: "no-cache" });
 
@@ -34,10 +35,16 @@ export async function create(ownerId: number) {
     ownerId: String(ownerId),
     prefix: "os",
   });
+
+  revalidatePath("/app/[workspaceSlug]/(dashboard)/settings/api-token");
+
   return key;
 }
 
 export async function revoke(keyId: string) {
   const res = await unkey.keys.delete({ keyId });
+
+  revalidatePath("/app/[workspaceSlug]/(dashboard)/settings/api-token");
+
   return res;
 }

apps/web/src/app/app/[workspaceSlug]/(dashboard)/settings/api-token/_components/card.tsx

@@ -1,60 +1,50 @@
-"use server";
-
-import { Unkey } from "@unkey/api";
-
 import { Container } from "@/components/dashboard/container";
-import { env } from "@/env";
 import { formatDate } from "@/lib/utils";
 import { CreateForm } from "./create-form";
 import { RevokeButton } from "./revoke-button";
 
-const unkey = new Unkey({ token: env.UNKEY_TOKEN });
-
-export async function ApiKeys({ ownerId }: { ownerId: number }) {
-  const data = await unkey.apis.listKeys({
-    apiId: env.UNKEY_API_ID,
-    ownerId: String(ownerId),
-  });
-
-  if (data.error) {
-    return <div>Something went wrong. Please contact us.</div>;
-  }
-
-  const key = data.result.keys?.[0] || undefined;
-
+export async function ApiKeys({
+  ownerId,
+  value,
+}: {
+  ownerId: number;
+  value?: { id: string; start: string; createdAt: number };
+}) {
   return (
     <>
       <Container
         title="API Token"
         description="Use our API endpoints to create your monitors programmatically."
         actions={
           <>
-            {key ? (
-              <RevokeButton keyId={key.id} />
+            {value ? (
+              <RevokeButton keyId={value.id} />
             ) : (
               <CreateForm ownerId={ownerId} />
             )}
           </>
         }
       >
-        {key ? (
+        {value ? (
           <dl className="grid gap-2 [&>*]:text-sm [&_dt]:font-light [&_dt]:text-muted-foreground">
             <div className="flex min-w-0 items-center justify-between gap-3">
               <dt>Token</dt>
-              <dd className="font-mono">{key.start}...</dd>
+              <dd className="font-mono">{value.start}...</dd>
             </div>
             <div className="flex min-w-0 items-center justify-between gap-3">
               <dt>Created At</dt>
-              <dd>{key.createdAt && formatDate(new Date(key.createdAt))}</dd>
+              <dd>
+                {value.createdAt && formatDate(new Date(value.createdAt))}
+              </dd>
             </div>
           </dl>
         ) : null}
       </Container>
       <p className="text-foreground text-sm">
-        Read more about APIs in our{" "}
+        Read more about API in our{" "}
         <a
           className="text-foreground underline underline-offset-4 hover:no-underline"
-          href="https://docs.openstatus.dev/api-reference/auth"
+          href="https://api.openstatus.dev/v1"
           target="_blank"
           rel="noreferrer"
         >

apps/web/src/app/app/[workspaceSlug]/(dashboard)/settings/api-token/page.tsx

@@ -1,8 +1,26 @@
+import { Unkey } from "@unkey/api";
+
+import { env } from "@/env";
 import { api } from "@/trpc/server";
 import { ApiKeys } from "./_components/card";
 
+export const revalidate = 0;
+
+const unkey = new Unkey({ token: env.UNKEY_TOKEN, cache: "no-cache" });
+
 export default async function ApiTokenPage() {
-  const data = await api.workspace.getWorkspace.query();
+  const workspace = await api.workspace.getWorkspace.query();
+
+  const data = await unkey.apis.listKeys({
+    apiId: env.UNKEY_API_ID,
+    ownerId: String(workspace.id),
+  });
+
+  if (data.error) {
+    return <div>Something went wrong. Please contact us.</div>;
+  }
+
+  const value = data.result.keys?.[0] || undefined;
 
-  return <ApiKeys ownerId={data.id} />;
+  return <ApiKeys ownerId={workspace.id} value={value} />;
 }