Get env

src/app/environment/page.tsx

@@ -1,51 +1,28 @@
 "use client";
 
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { DashboardLayout } from "@/components/dashboard/DashboardLayout";
 import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
 import { Button } from "@/components/ui/button";
 import { Badge } from "@/components/ui/badge";
 import { Input } from "@/components/ui/input";
 import { Plus, Trash2, Eye, EyeOff, Copy, Save, Lock } from "lucide-react";
-
+import { Env } from "@/lib/types";
-const envGroups = [
+import { getEnv } from "@/core/application";
-  {
-    name: "api-gateway",
-    variables: [
-      { key: "PORT", value: "8080", secret: false },
-      { key: "NODE_ENV", value: "production", secret: false },
-      { key: "API_KEY", value: "sk-xxxx-xxxx-xxxx", secret: true },
-      { key: "DATABASE_URL", value: "postgresql://...", secret: true },
-      { key: "REDIS_URL", value: "redis://localhost:6379", secret: false },
-      { key: "LOG_LEVEL", value: "info", secret: false },
-    ],
-  },
-  {
-    name: "auth-service",
-    variables: [
-      { key: "PORT", value: "9000", secret: false },
-      { key: "JWT_SECRET", value: "xxxxxxxxxxxx", secret: true },
-      { key: "JWT_EXPIRY", value: "7d", secret: false },
-      { key: "OAUTH_CLIENT_ID", value: "client-id-xxxx", secret: true },
-      { key: "OAUTH_CLIENT_SECRET", value: "client-secret-xxxx", secret: true },
-    ],
-  },
-  {
-    name: "worker-queue",
-    variables: [
-      { key: "QUEUE_URL", value: "amqp://localhost:5672", secret: false },
-      { key: "CONCURRENCY", value: "10", secret: false },
-      { key: "RETRY_LIMIT", value: "3", secret: false },
-      { key: "DEAD_LETTER_QUEUE", value: "dlq.worker", secret: false },
-    ],
-  },
-];
 
 export default function EnvironmentPage() {
-  const [selectedApp, setSelectedApp] = useState("api-gateway");
+  const [selectedApp, setSelectedApp] = useState("");
   const [showSecrets, setShowSecrets] = useState<Record<string, boolean>>({});
+  const [envGroups, setEnvGroups] = useState<Record<string, Env[]>>({});
 
-  const currentGroup = envGroups.find((g) => g.name === selectedApp);
+  useEffect(() => {
+    const fetch = async () => {
+      setEnvGroups(await getEnv());
+    };
+    fetch();
+  }, []);
+
+  const currentGroup = envGroups[selectedApp];
 
   const toggleSecret = (key: string) => {
     setShowSecrets((prev) => ({ ...prev, [key]: !prev[key] }));
@@ -70,23 +47,21 @@ export default function EnvironmentPage() {
               </CardTitle>
             </CardHeader>
             <CardContent className="p-2 flex gap-2 md:block overflow-x-auto">
-              {envGroups.map((group) => (
+              {Object.entries(envGroups).map(([key, variables]) => (
                 <button
-                  key={group.name}
+                  key={key}
-                  onClick={() => setSelectedApp(group.name)}
+                  onClick={() => setSelectedApp(key)}
                   className={`
                     whitespace-nowrap md:w-full text-left px-3 py-2 text-sm font-mono transition-colors
                     ${
-                      selectedApp === group.name
+                      selectedApp === key
                         ? "bg-secondary text-foreground"
                         : "text-muted-foreground hover:bg-muted hover:text-foreground"
                     }
                   `}
                 >
-                  {group.name}
+                  {key}
-                  <Badge className="ml-2 text-[10px]">
+                  <Badge className="ml-2 text-[10px]">{variables.length}</Badge>
-                    {group.variables.length}
-                  </Badge>
                 </button>
               ))}
             </CardContent>
@@ -100,9 +75,8 @@ export default function EnvironmentPage() {
               <div>
                 <CardTitle className="font-mono">{selectedApp}</CardTitle>
                 <p className="text-xs text-muted-foreground mt-1">
-                  {currentGroup?.variables.length} variables •{" "}
+                  {currentGroup?.length} variables •{" "}
-                  {currentGroup?.variables.filter((v) => v.secret).length}{" "}
+                  {currentGroup?.filter((v) => v.secret).length} secrets
-                  secrets
                 </p>
               </div>
 
@@ -128,7 +102,7 @@ export default function EnvironmentPage() {
 
               {/* Rows */}
               <div className="divide-y divide-border md:divide-none">
-                {currentGroup?.variables.map((variable) => (
+                {currentGroup?.map((variable) => (
                   <div
                     key={variable.key}
                     className="

src/core/application.ts

@@ -3,7 +3,7 @@
 import { verifySession } from "./auth/session";
 import { getNodes } from "./node";
 import axios from "axios";
-import { ImageApp } from "@/lib/types";
+import { Env, ImageApp } from "@/lib/types";
 
 export async function deployNewApp(name: string, repo: string, nodeId: string) {
   if (await verifySession()) {
@@ -41,3 +41,20 @@ export async function getApplications(): Promise<ImageApp[]> {
     )
   ).flat();
 }
+
+export async function getEnv(): Promise<Record<string, Env[]>> {
+  const nodes = await getNodes();
+
+  const envRecords = await Promise.all(
+    nodes.map(async (n) => {
+      const response = await axios.get(`http://${n.ip}:3000/api/env`, {
+        headers: { Authorization: `ApiKey ${n.key}` },
+      });
+      return response.data as Record<string, Env[]>;
+    })
+  );
+
+  const merged: Record<string, Env[]> = Object.assign({}, ...envRecords);
+
+  return merged;
+}

src/core/server/application.ts

@@ -6,7 +6,7 @@ import fs from "fs";
 import path from "path";
 import { exec } from "child_process";
 import util from "util";
-import { ImageApp } from "@/lib/types";
+import { Env, ImageApp } from "@/lib/types";
 import { CPUusage } from "@/lib/server/calc";
 
 const docker = new Docker();
@@ -100,6 +100,8 @@ export async function deployNewApp(name: string, repo: string, nodeId: string) {
     JSON.stringify(appConfig, null, 2)
   );
 
+  fs.writeFileSync(path.join(appDir, "env.json"), JSON.stringify([], null, 2));
+
   // Clone repository
   try {
     await execAsync(`git clone ${repo} ${repoDir}`);
@@ -132,3 +134,19 @@ export async function deployNewApp(name: string, repo: string, nodeId: string) {
     image: imageTag,
   };
 }
+
+export async function getEnv(): Promise<Record<string, Env[]>> {
+  const apps = fs.readdirSync(DATA_DIR);
+
+  return apps.reduce((acc, appId) => {
+    const appPath = path.join(DATA_DIR, appId, "app.json");
+    const name = JSON.parse(fs.readFileSync(appPath).toString()).name;
+
+    const envPath = path.join(DATA_DIR, appId, "env.json");
+    if (fs.existsSync(envPath)) {
+      const envData: Env[] = JSON.parse(fs.readFileSync(envPath, "utf-8"));
+      acc[name] = envData;
+    }
+    return acc;
+  }, {} as Record<string, Env[]>);
+}

src/lib/format.ts

@@ -15,3 +15,10 @@ export function average<T>(values: Array<T>, p: (v: T) => number) {
     ? values.reduce((sum, value) => sum + p(value), 0) / values.length
     : 0;
 }
+
+export function mapRecord<T, U>(
+  input: Record<string, T>,
+  fn: ([key, value]: [string, T]) => [string, U]
+): Record<string, U> {
+  return Object.fromEntries(Object.entries(input).map(fn));
+}

src/lib/types.ts

@@ -81,3 +81,9 @@ export interface Log {
   source: string;
   message: string;
 }
+
+export interface Env {
+  key: string;
+  value: string;
+  secret: boolean;
+}