From 52a13280f3383690a48fb51e5a80900ca6b2c608 Mon Sep 17 00:00:00 2001
From: Salih Altun <salih@skyvern.com>
Date: Wed, 3 Jul 2024 23:34:30 +0300
Subject: [PATCH] Show currently active key in settings (#542)

---
 skyvern-frontend/src/routes/settings/Settings.tsx | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/skyvern-frontend/src/routes/settings/Settings.tsx b/skyvern-frontend/src/routes/settings/Settings.tsx
index 4b6571fc5..a865faac3 100644
--- a/skyvern-frontend/src/routes/settings/Settings.tsx
+++ b/skyvern-frontend/src/routes/settings/Settings.tsx
@@ -14,10 +14,13 @@ import {
   CardHeader,
   CardTitle,
 } from "@/components/ui/card";
+import { envCredential } from "@/util/env";
+import { HiddenCopyableInput } from "@/components/ui/hidden-copyable-input";
 
 function Settings() {
   const { environment, organization, setEnvironment, setOrganization } =
     useSettingsStore();
+  const apiKey = envCredential;
 
   return (
     <div className="flex flex-col gap-8">
@@ -55,6 +58,15 @@ function Settings() {
           </div>
         </CardContent>
       </Card>
+      <Card>
+        <CardHeader className="border-b-2">
+          <CardTitle className="text-lg">API Key</CardTitle>
+          <CardDescription>Currently active API key</CardDescription>
+        </CardHeader>
+        <CardContent className="p-8">
+          <HiddenCopyableInput value={apiKey ?? "API key not found"} />
+        </CardContent>
+      </Card>
     </div>
   );
 }