From f1d36f0f4a12e4d76cee72e157173cac9a0caa10 Mon Sep 17 00:00:00 2001
From: karamvir <karamvir.singh98@gmail.com>
Date: Tue, 12 Sep 2023 16:22:29 -0700
Subject: [PATCH] fix version selector etc

---
 .../src/components/resources/build/index.tsx  | 24 ++++++++++++++++---
 .../deployment/config/components/image.tsx    |  5 +++-
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/frontend-v2/src/components/resources/build/index.tsx b/frontend-v2/src/components/resources/build/index.tsx
index 717a6a8df..a99a001ca 100644
--- a/frontend-v2/src/components/resources/build/index.tsx
+++ b/frontend-v2/src/components/resources/build/index.tsx
@@ -1,12 +1,13 @@
 import { ConfigInner } from "@components/config";
 import { ResourceSelector, AccountSelector } from "@components/config/util";
 import { NewResource } from "@components/layouts";
-import { useRead, useWrite } from "@lib/hooks";
+import { ConfirmButton } from "@components/util";
+import { useExecute, useRead, useWrite } from "@lib/hooks";
 import { fmt_verison } from "@lib/utils";
 import { Types } from "@monitor/client";
 import { RequiredResourceComponents } from "@types";
 import { Input } from "@ui/input";
-import { Hammer, History } from "lucide-react";
+import { Hammer, History, Loader2 } from "lucide-react";
 import { useState } from "react";
 
 const useBuild = (id?: string) =>
@@ -110,6 +111,23 @@ export const Build: RequiredResourceComponents = {
   Page: {
     Config: ({ id }) => <BuildConfig id={id} />,
   },
-  Actions: () => null,
+  Actions: ({ id }) => {
+    const building = useRead("GetBuildActionState", { id }).data?.building;
+    const { mutate, isLoading } = useExecute("RunBuild");
+    return (
+      <ConfirmButton
+        title={building ? "Building" : "Build"}
+        icon={
+          building ? (
+            <Loader2 className="w-4 h-4 animate-spin" />
+          ) : (
+            <Hammer className="h-4 w-4" />
+          )
+        }
+        onClick={() => mutate({ build_id: id })}
+        disabled={building || isLoading}
+      />
+    );
+  },
   New: () => <NewBuild />,
 };
diff --git a/frontend-v2/src/components/resources/deployment/config/components/image.tsx b/frontend-v2/src/components/resources/deployment/config/components/image.tsx
index 37cc68d5f..bb03ffba8 100644
--- a/frontend-v2/src/components/resources/deployment/config/components/image.tsx
+++ b/frontend-v2/src/components/resources/deployment/config/components/image.tsx
@@ -36,7 +36,10 @@ const BuildVersionSelector = ({
           latest
         </SelectItem>
         {versions?.map((v) => (
-          <SelectItem key={JSON.stringify(v)} value={JSON.stringify(v)}>
+          <SelectItem
+            key={JSON.stringify(v.version) + v.ts}
+            value={JSON.stringify(v.version)}
+          >
             {fmt_verison(v.version)}
           </SelectItem>
         ))}