vmm: Optimize web UI

Author: kvinwang

ra-rpc/src/openapi.rs

@@ -1035,6 +1035,7 @@ fn build_swagger_ui_html(spec_url: &str, cfg: &SwaggerUiConfig) -> String {
       window.ui = SwaggerUIBundle({{
         url: '{spec}',
         dom_id: '#swagger-ui',
+        deepLinking: true,
         presets: [
           SwaggerUIBundle.presets.apis,
           SwaggerUIStandalonePreset

vmm/src/console_v1.html

@@ -1994,6 +1994,11 @@ <h2>Deploy a new instance</h2>
               <textarea id="preLaunchScript" v-model="form.preLaunchScript" placeholder="Optional script executed before launch" rows="6"></textarea>
             </div>
 
+            <div class="form-group full-width">
+              <label for="userConfig">User Config</label>
+              <textarea id="userConfig" v-model="form.user_config" placeholder="Optional user config placed at /dstack/.user-config in the CVM"></textarea>
+            </div>
+
             <div class="form-group full-width" v-if="availableGpus.length > 0">
               <gpu-config-editor
                 :available-gpus="availableGpus"
@@ -2003,11 +2008,6 @@ <h2>Deploy a new instance</h2>
               />
             </div>
 
-            <div class="form-group full-width">
-              <label for="userConfig">User Config</label>
-              <textarea id="userConfig" v-model="form.user_config" placeholder="Optional user config placed at /dstack/.user-config in the CVM"></textarea>
-            </div>
-
             <div class="form-group full-width">
               <label>Features</label>
               <div class="feature-checkboxes">

vmm/ui/src/components/CreateVmDialog.ts

@@ -109,6 +109,11 @@ const CreateVmDialogComponent = {
               <textarea id="preLaunchScript" v-model="form.preLaunchScript" placeholder="Optional script executed before launch" rows="6"></textarea>
             </div>
 
+            <div class="form-group full-width">
+              <label for="userConfig">User Config</label>
+              <textarea id="userConfig" v-model="form.user_config" placeholder="Optional user config placed at /dstack/.user-config in the CVM"></textarea>
+            </div>
+
             <div class="form-group full-width" v-if="availableGpus.length > 0">
               <gpu-config-editor
                 :available-gpus="availableGpus"
@@ -118,11 +123,6 @@ const CreateVmDialogComponent = {
               />
             </div>
 
-            <div class="form-group full-width">
-              <label for="userConfig">User Config</label>
-              <textarea id="userConfig" v-model="form.user_config" placeholder="Optional user config placed at /dstack/.user-config in the CVM"></textarea>
-            </div>
-
             <div class="form-group full-width">
               <label>Features</label>
               <div class="feature-checkboxes">

vmm/ui/src/composables/useVmManager.ts

@@ -391,10 +391,19 @@ fi
     }
   }
 
-  function configGpu(form: { attachAllGpus: boolean; selectedGpus: string[] }): VmmTypes.IGpuConfig | undefined {
+  function configGpu(form: { attachAllGpus: boolean; selectedGpus: string[] }, isUpdate: boolean = false): VmmTypes.IGpuConfig | undefined {
     if (form.attachAllGpus) {
       return { attach_mode: 'all' };
     }
+    // For updates, always return a config when GPUs are being explicitly updated
+    // Empty array means no GPUs should be attached
+    if (isUpdate) {
+      return {
+        attach_mode: 'listed',
+        gpus: (form.selectedGpus || []).map((slot: string) => ({ slot })),
+      };
+    }
+    // For creation, return undefined if no GPUs are selected
     if (form.selectedGpus && form.selectedGpus.length > 0) {
       return {
         attach_mode: 'listed',
@@ -1042,7 +1051,7 @@ type CreateVmPayloadSource = {
       body.user_config = updated.user_config;
       body.update_ports = true;
       body.ports = normalizePorts(updated.ports);
-      body.gpus = updateDialog.value.updateGpuConfig ? configGpu(updated) : undefined;
+      body.gpus = updateDialog.value.updateGpuConfig ? configGpu(updated, true) : undefined;
 
       await vmmRpc.updateVm(body);
       updateDialog.value.encryptedEnvs = [];