[Coolify] view-secret-keys + update-projects (raycast#16003)

* [Coolify] view-secret-keys + update-projects * Update CHANGELOG.md and optimise images --------- Co-authored-by: raycastbot <[email protected]>
gogocharli · Jan 6, 2025 · a7f442e · a7f442e
1 parent 1b5985f
commit a7f442e
Show file tree

Hide file tree

Showing 8 changed files with 184 additions and 4 deletions.
diff --git a/extensions/coolify/CHANGELOG.md b/extensions/coolify/CHANGELOG.md
@@ -1,5 +1,13 @@
 # Coolify Changelog
 
+## [Enhancements] - 2025-01-02
+
+- In `Projects`:
+    - Create Project
+    - Update Project
+- In `Private Keys`
+    - View Private Keys
+
 ## [Enhancements] - 2024-10-23
 
 - Fix issue where `Resources` command would crash if the resource type is not "application" or "service"

diff --git a/extensions/coolify/README.md b/extensions/coolify/README.md
@@ -4,11 +4,11 @@
 
 # Coolify Raycast Extension
 
-This is a Raycast extension for [Coolify](https://coolify.io/). With this extension you can view Servers, Server Details, Resources, Teams, Team Members, Projects, Environments and more in your Coolify instance.
+This is a Raycast extension for [Coolify](https://coolify.io/). With this extension you can view Servers, Server Details, Resources, Teams, Team Members, Projects, Environments, Private Keys and more in your Coolify instance.
 
 ## 🚀 Getting Started
 
-1. **Install extension**: Click the `Install Extension` button in the top right of [this page](https://www.raycast.com/xmok/coolify) OR via Raycast Store
+1. **Install extension**: Click the `Install Extension` button in the top right of [this page](https://www.raycast.com/xmok/coolify) OR `install` via Raycast Store
 
 2. **Enter your Coolify Details**: The first time you use the extension, you'll need to enter the following in Preferences OR at first prompt:
 

diff --git a/extensions/coolify/package.json b/extensions/coolify/package.json
@@ -53,6 +53,12 @@
       "title": "View Projects",
       "description": "View Projects, Environments and Resources",
       "mode": "view"
+    },
+    {
+      "name": "private-keys",
+      "title": "View Private Keys",
+      "description": "View Private Keys",
+      "mode": "view"
     }
   ],
   "dependencies": {

diff --git a/extensions/coolify/src/lib/components/projects/create.tsx b/extensions/coolify/src/lib/components/projects/create.tsx
@@ -0,0 +1,52 @@
+import { Action, ActionPanel, Form, Icon, useNavigation } from "@raycast/api";
+import { FormValidation, useForm } from "@raycast/utils";
+import { useState } from "react";
+import { type CreateProject } from "../../types";
+import useCoolify from "../../use-coolify";
+
+export default function CreateProject({ onAdded }: { onAdded: () => void }) {
+  const { pop } = useNavigation();
+  const [execute, setExecute] = useState(false);
+
+  const { itemProps, handleSubmit, values } = useForm<CreateProject>({
+    onSubmit() {
+      setExecute(true);
+    },
+    validation: {
+      name: FormValidation.Required,
+    },
+  });
+
+  const { isLoading } = useCoolify("projects", {
+    method: "POST",
+    body: values,
+    execute,
+    onData() {
+      onAdded();
+      pop();
+    },
+    onError() {
+      setExecute(false);
+    },
+  });
+
+  return (
+    <Form
+      isLoading={isLoading}
+      actions={
+        <ActionPanel>
+          <Action.SubmitForm icon={Icon.Check} onSubmit={handleSubmit} />
+        </ActionPanel>
+      }
+    >
+      <Form.Description text="Create Project" />
+      <Form.TextField title="Name" placeholder="Your Cool Project" {...itemProps.name} />
+      <Form.TextField
+        title="Description"
+        placeholder="This is my cool project everyone knows about"
+        {...itemProps.description}
+      />
+      <Form.Description text="New project will have a default production environment." />
+    </Form>
+  );
+}
diff --git a/extensions/coolify/src/lib/components/projects/update.tsx b/extensions/coolify/src/lib/components/projects/update.tsx
@@ -0,0 +1,55 @@
+import { Action, ActionPanel, Form, Icon, useNavigation } from "@raycast/api";
+import { FormValidation, useForm } from "@raycast/utils";
+import { useState } from "react";
+import { CreateProject, Project } from "../../types";
+import useCoolify from "../../use-coolify";
+
+export default function UpdateProject({ project, onUpdated }: { project: Project; onUpdated: () => void }) {
+  const { pop } = useNavigation();
+  const [execute, setExecute] = useState(false);
+
+  const { itemProps, handleSubmit, values } = useForm<CreateProject>({
+    onSubmit() {
+      setExecute(true);
+    },
+    validation: {
+      name: FormValidation.Required,
+    },
+    initialValues: {
+      name: project.name,
+      description: project.description || "",
+    },
+  });
+
+  const { isLoading } = useCoolify(`projects/${project.uuid}`, {
+    method: "PATCH",
+    body: values,
+    execute,
+    onData() {
+      onUpdated();
+      pop();
+    },
+    onError() {
+      setExecute(false);
+    },
+  });
+
+  return (
+    <Form
+      isLoading={isLoading}
+      actions={
+        <ActionPanel>
+          <Action.SubmitForm icon={Icon.Check} onSubmit={handleSubmit} />
+        </ActionPanel>
+      }
+    >
+      <Form.Description text="Update Project" />
+      <Form.TextField title="Name" placeholder="Your Cooler Project" {...itemProps.name} />
+      <Form.TextField
+        title="Description"
+        placeholder="This is my cooler project everyone knows about"
+        {...itemProps.description}
+      />
+    </Form>
+  );
+}
diff --git a/extensions/coolify/src/lib/types.ts b/extensions/coolify/src/lib/types.ts
@@ -85,6 +85,7 @@ export type PrivateKey = {
   uuid: string;
   name: string;
   description: string;
+  fingerprint: string | null;
   private_key: string;
   is_git_related: true;
   team_id: number;
@@ -164,6 +165,10 @@ export type ProjectDetails = Project & {
   updated_at: string;
   created_at: string;
 };
+export type CreateProject = {
+  name: string;
+  description: string;
+};
 
 export type Environment = {
   id: number;

diff --git a/extensions/coolify/src/private-keys.tsx b/extensions/coolify/src/private-keys.tsx
@@ -0,0 +1,40 @@
+import { Action, ActionPanel, Icon, List } from "@raycast/api";
+import InvalidUrl from "./lib/components/invalid-url";
+import { PrivateKey } from "./lib/types";
+import useCoolify from "./lib/use-coolify";
+import { isValidCoolifyUrl } from "./lib/utils";
+import { useState } from "react";
+
+export default function PrivateKeys() {
+  if (!isValidCoolifyUrl()) return <InvalidUrl />;
+
+  const { isLoading, data: keys = [] } = useCoolify<PrivateKey[]>("security/keys");
+
+  const [isShowingDetail, setIsShowingDetail] = useState(false);
+
+  return (
+    <List isLoading={isLoading} searchBarPlaceholder="Search keys" isShowingDetail={isShowingDetail}>
+      <List.Section title="Private Keys" subtitle={`${keys.length} keys`}>
+        {keys.map((key) => (
+          <List.Item
+            key={key.id}
+            icon={Icon.Key}
+            title={key.name}
+            subtitle={isShowingDetail ? undefined : key.description}
+            detail={<List.Item.Detail markdown={key.private_key} />}
+            actions={
+              <ActionPanel>
+                <Action
+                  icon={Icon.AppWindowSidebarLeft}
+                  title="Toggle Private Key"
+                  onAction={() => setIsShowingDetail((prev) => !prev)}
+                />
+                <Action.CopyToClipboard title="Copy Private Key to Clipboard" content={key.private_key} />
+              </ActionPanel>
+            }
+          />
+        ))}
+      </List.Section>
+    </List>
+  );
+}
diff --git a/extensions/coolify/src/projects.tsx b/extensions/coolify/src/projects.tsx
@@ -1,16 +1,18 @@
-import { Action, ActionPanel, Icon, List } from "@raycast/api";
+import { Action, ActionPanel, Icon, Keyboard, List } from "@raycast/api";
 import { Environment, EnvironmentDetails, Project, ProjectDetails, Resource } from "./lib/types";
 import useCoolify from "./lib/use-coolify";
 import { isValidCoolifyUrl } from "./lib/utils";
 import InvalidUrl from "./lib/components/invalid-url";
 import OpenInCoolify from "./lib/components/open-in-coolify";
 import { getAvatarIcon } from "@raycast/utils";
 import { useMemo } from "react";
+import CreateProject from "./lib/components/projects/create";
+import UpdateProject from "./lib/components/projects/update";
 
 export default function Projects() {
   if (!isValidCoolifyUrl()) return <InvalidUrl />;
 
-  const { isLoading, data: projects = [] } = useCoolify<Project[]>("projects");
+  const { isLoading, data: projects = [], revalidate } = useCoolify<Project[]>("projects");
 
   return (
     <List isLoading={isLoading} searchBarPlaceholder="Search project">
@@ -29,6 +31,18 @@ export default function Projects() {
                   title="View Environments"
                   target={<ViewEnvironments project={project} />}
                 />
+                <Action.Push
+                  icon={Icon.Pencil}
+                  title="Update Project"
+                  target={<UpdateProject project={project} onUpdated={revalidate} />}
+                  shortcut={Keyboard.Shortcut.Common.Edit}
+                />
+                <Action.Push
+                  icon={Icon.Plus}
+                  title="Add Project"
+                  target={<CreateProject onAdded={revalidate} />}
+                  shortcut={Keyboard.Shortcut.Common.New}
+                />
                 <OpenInCoolify url={`project/${project.uuid}`} />
               </ActionPanel>
             }