Redeploy

src/app/deployments/page.tsx

@@ -10,13 +10,14 @@ import {
 } from "@/components/ui/card";
 import { Badge } from "@/components/ui/badge";
 import { Button } from "@/components/ui/button";
-import { Plus, Play, Pause, Square } from "lucide-react";
+import { Plus, Play, Pause, Square, RotateCcw } from "lucide-react";
 import { getDeployments, toggleDeployment } from "@/lib/dockship/deploy";
 import { getApps } from "@/lib/dockship/application";
 import { cn } from "@/lib/utils";
 import DeployAppDialog from "@/components/dialogs/DeployApp";
 import { useAsync, useAsyncInterval } from "@/hooks/use-async";
 import RemoveDialog from "@/components/dialogs/Remove";
+import { Application } from "@/lib/types";
 
 const statusDot = {
   running: "bg-chart-2",
@@ -34,11 +35,11 @@ export default function DeploymentsPage() {
     [apps],
   );
 
-  const appNameByContainer = useMemo(() => {
-    const map = new Map<string, string>();
+  const appByContainer = useMemo(() => {
+    const map = new Map<string, Application>();
     for (const app of apps) {
       for (const container of app.deployments) {
-        map.set(container, app.name);
+        map.set(container, app);
       }
     }
     return map;
@@ -90,7 +91,8 @@ export default function DeploymentsPage() {
                     <CardTitle>
                       {dep.name} @{" "}
                       <span className="text-primary-foreground">
-                        {appNameByContainer.get(dep.container) ?? "Unknown app"}
+                        {appByContainer.get(dep.container)?.name ??
+                          "Unknown app"}
                       </span>
                     </CardTitle>
                     <CardDescription className="flex gap-3">
@@ -123,6 +125,19 @@ export default function DeploymentsPage() {
                         <Square className="w-3 h-3 text-primary" />
                       )}
                     </Button>
+                    <DeployAppDialog
+                      defaultApp={appByContainer.get(dep.container)?.id}
+                      ports={dep.ports.map(([to, from]) => ({
+                        containerPort: from.toString(),
+                        hostPort: to.toString(),
+                        protocol: "tcp",
+                      }))}
+                      nodeId={dep.nodeId}
+                    >
+                      <Button variant="ghost" size="icon-sm">
+                        <RotateCcw className="w-3 h-3" />
+                      </Button>
+                    </DeployAppDialog>
                     <RemoveDialog remove={() => {}} />
                   </div>
                 </div>