feat: Select Engine versions (#5479)

Author: arcoraven

apps/dashboard/src/@3rdweb-sdk/react/cache-keys.ts

@@ -111,7 +111,8 @@ export const engineKeys = {
     ] as const,
   health: (instance: string) =>
     [...engineKeys.all, instance, "health"] as const,
-  latestVersion: () => [...engineKeys.all, "latestVersion"] as const,
+  deploymentPublicConfiguration: () =>
+    [...engineKeys.all, "deploymentPublicConfiguration"] as const,
   systemMetrics: (engineId: string) =>
     [...engineKeys.all, engineId, "systemMetrics"] as const,
   queueMetrics: (engineId: string) =>

apps/dashboard/src/@3rdweb-sdk/react/hooks/useEngine.ts

@@ -191,32 +191,48 @@ export function useEngineQueueMetrics(
   });
 }
 
-export function useEngineLatestVersion() {
-  return useQuery({
-    queryKey: engineKeys.latestVersion(),
+interface GetDeploymentPublicConfigurationInput {
+  teamSlug: string;
+}
+
+interface DeploymentPublicConfigurationResponse {
+  serverVersions: {
+    name: string;
+    createdAt: string;
+  }[];
+}
+
+export function useEngineGetDeploymentPublicConfiguration(
+  input: GetDeploymentPublicConfigurationInput,
+) {
+  return useQuery<DeploymentPublicConfigurationResponse>({
+    queryKey: engineKeys.deploymentPublicConfiguration(),
     queryFn: async () => {
-      const res = await fetch(`${THIRDWEB_API_HOST}/v1/engine/latest-version`, {
-        method: "GET",
-      });
+      const res = await fetch(
+        `${THIRDWEB_API_HOST}/v1/teams/${input.teamSlug}/engine/deployments/public-configuration`,
+        { method: "GET" },
+      );
       if (!res.ok) {
         throw new Error(`Unexpected status ${res.status}: ${await res.text()}`);
       }
+
       const json = await res.json();
-      return json.data.version as string;
+      return json.data as DeploymentPublicConfigurationResponse;
     },
   });
 }
 
-interface UpdateVersionInput {
+interface UpdateDeploymentInput {
+  teamSlug: string;
   deploymentId: string;
   serverVersion: string;
 }
 
-export function useEngineUpdateServerVersion() {
+export function useEngineUpdateDeployment() {
   return useMutation({
-    mutationFn: async (input: UpdateVersionInput) => {
+    mutationFn: async (input: UpdateDeploymentInput) => {
       const res = await fetch(
-        `${THIRDWEB_API_HOST}/v2/engine/deployments/${input.deploymentId}/infrastructure`,
+        `${THIRDWEB_API_HOST}/v1/teams/${input.teamSlug}/engine/deployments/${input.deploymentId}`,
         {
           method: "PUT",
           headers: {

apps/dashboard/src/app/team/[team_slug]/(team)/~/engine/(general)/overview/engine-instances-table.tsx

@@ -465,7 +465,7 @@ function DeleteSubscriptionModalContent(props: {
         <div className="h-4" />
 
         <Alert variant="destructive">
-          <TriangleAlertIcon className="!text-destructive-text size-5" />
+          <TriangleAlertIcon className="!text-destructive-text size-4" />
           <AlertTitle>This action is irreversible!</AlertTitle>
 
           <AlertDescription className="!pl-0 pt-2">

apps/dashboard/src/app/team/[team_slug]/(team)/~/engine/(instance)/[engineId]/_components/EnginePageLayout.tsx

@@ -119,6 +119,7 @@ export function WithEngineInstance(props: {
         instance={sandboxEngine}
         content={props.content}
         rootPath={rootPath}
+        teamSlug={props.teamSlug}
       />
     );
   }
@@ -128,6 +129,7 @@ export function WithEngineInstance(props: {
       content={props.content}
       engineId={props.engineId}
       rootPath={rootPath}
+      teamSlug={props.teamSlug}
     />
   );
 }
@@ -136,6 +138,7 @@ function QueryAndRenderInstanceHeader(props: {
   engineId: string;
   content: React.FC<{ instance: EngineInstance }>;
   rootPath: string;
+  teamSlug: string;
 }) {
   const instancesQuery = useEngineInstances();
   const instance = instancesQuery.data?.find((x) => x.id === props.engineId);
@@ -157,6 +160,7 @@ function QueryAndRenderInstanceHeader(props: {
       instance={instance}
       content={props.content}
       rootPath={props.rootPath}
+      teamSlug={props.teamSlug}
     />
   );
 }
@@ -165,6 +169,7 @@ function EnsurePermissionAndRenderInstance(props: {
   content: React.FC<{ instance: EngineInstance }>;
   instance: EngineInstance;
   rootPath: string;
+  teamSlug: string;
 }) {
   const permissionQuery = useHasEnginePermission({
     instanceUrl: props.instance.url,
@@ -210,6 +215,7 @@ function EnsurePermissionAndRenderInstance(props: {
       rootPath={props.rootPath}
       instance={props.instance}
       content={props.content}
+      teamSlug={props.teamSlug}
     />
   );
 }
@@ -218,6 +224,7 @@ function RenderEngineInstanceHeader(props: {
   instance: EngineInstance;
   content: React.FC<{ instance: EngineInstance }>;
   rootPath: string;
+  teamSlug: string;
 }) {
   const { instance } = props;
 
@@ -261,7 +268,7 @@ function RenderEngineInstanceHeader(props: {
             )}
           </div>
         </div>
-        <EngineVersionBadge instance={instance} />
+        <EngineVersionBadge instance={instance} teamSlug={props.teamSlug} />
       </div>
 
       <div className="h-5" />