Fix YAML generation and resource parsing for templates

- Disable line wrapping in jsYaml.dump to preserve multi-line command
  formatting from templates
- Handle numeric and object resource values (e.g. gpu: 0) in addition
  to string shorthand
- Show empty placeholder for disabled offer cards

Co-authored-by: Cursor <cursoragent@cursor.com>

Author: peterschmidt85

frontend/src/pages/Offers/List/index.tsx

@@ -218,6 +218,7 @@ export const OfferList: React.FC<OfferListProps> = ({
             {...props}
             entireCardClickable
             items={disabled ? [] : items}
+            empty={disabled ? ' ' : undefined}
             cardDefinition={{
                 header: (gpu) => gpu.name,
                 sections,

frontend/src/pages/Runs/Launch/helpers/getRunSpecConfigurationResources.ts

@@ -19,13 +19,14 @@ const parseRange = (rangeString: string) => {
 };
 
 export const getRunSpecConfigurationResources = (json: unknown): TDevEnvironmentConfiguration['resources'] => {
-    const { gpu, cpu, memory, shm_size, disk } = (json ?? {}) as { [key: string]: string };
+    const { gpu, cpu, memory, shm_size, disk } = (json ?? {}) as Record<string, unknown>;
     const result: TDevEnvironmentConfiguration['resources'] = {};
 
-    let gpuResources: TGPUResources = {};
-
-    if (typeof gpu === 'string') {
-        const attributes = ((gpu as string) ?? '').split(':');
+    if (typeof gpu === 'number') {
+        result['gpu'] = gpu;
+    } else if (typeof gpu === 'string') {
+        const gpuResources: TGPUResources = {};
+        const attributes = gpu.split(':');
 
         attributes.forEach((attribute, index) => {
             if (isVendor(attribute)) {
@@ -52,38 +53,43 @@ export const getRunSpecConfigurationResources = (json: unknown): TDevEnvironment
                 return;
             }
         });
-    } else if (typeof gpu === 'object') {
-        gpuResources = gpu;
+        result['gpu'] = gpuResources;
+    } else if (typeof gpu === 'object' && gpu !== null) {
+        result['gpu'] = gpu as TGPUResources;
     }
 
-    result['gpu'] = gpuResources;
-
-    if (memory && isMemory(memory)) {
+    if (typeof memory === 'string' && isMemory(memory)) {
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-expect-error
         result['memory'] = parseRange(memory);
     }
 
     if (shm_size) {
-        const shmSizeNum = parseInt(shm_size, 10);
+        const shmSizeStr = String(shm_size);
+        const shmSizeNum = parseInt(shmSizeStr, 10);
 
         if (!isNaN(shmSizeNum)) {
             result['shm_size'] = shmSizeNum;
         } else {
-            result['shm_size'] = shm_size;
+            result['shm_size'] = shmSizeStr;
         }
     }
 
     if (cpu) {
-        const cpuNum = parseInt(cpu, 10);
+        const cpuStr = String(cpu);
+        const cpuNum = parseInt(cpuStr, 10);
 
         if (!isNaN(cpuNum)) {
             result['cpu'] = cpuNum;
         } else {
-            result['cpu'] = cpu;
+            result['cpu'] = cpuStr;
         }
     }
 
-    if (disk && isMemory(disk)) {
+    if (typeof disk === 'string' && isMemory(disk)) {
         result['disk'] = {
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-expect-error
             size: parseRange(disk),
         };
     }

frontend/src/pages/Runs/Launch/hooks/useGenerateYaml.ts

@@ -26,36 +26,39 @@ export const useGenerateYaml = ({ formValues, configuration, envParam, backends
             envEntries.push(...(configuration['env'] as string[]));
         }
 
-        return jsYaml.dump({
-            ...configuration,
-
-            ...(name ? { name } : {}),
-            ...(ide ? { ide } : {}),
-            ...(docker ? { docker } : {}),
-            ...(image ? { image } : {}),
-            ...(python ? { python } : {}),
-            ...(envEntries.length > 0 ? { env: envEntries } : {}),
-
-            ...(gpuEnabled && offer
-                ? {
-                      resources: {
-                          gpu: `${offer.name}:${round(convertMiBToGB(offer.memory_mib))}GB:${renderRange(offer.count)}`,
-                      },
-
-                      ...(backends && backends.length > 0 ? { backends } : {}),
-                      ...(offer.spot.length === 1 ? { spot_policy: offer.spot[0] } : {}),
-                      ...(offer.spot.length > 1 ? { spot_policy: 'auto' } : {}),
-                  }
-                : {}),
-            ...(!gpuEnabled ? { resources: { gpu: 0 } } : {}),
-
-            ...(repo_url || repo_path
-                ? {
-                      repos: [[repo_url?.trim(), repo_path?.trim()].filter(Boolean).join(':')],
-                  }
-                : {}),
-
-            ...(working_dir ? { working_dir } : {}),
-        });
+        return jsYaml.dump(
+            {
+                ...configuration,
+
+                ...(name ? { name } : {}),
+                ...(ide ? { ide } : {}),
+                ...(docker ? { docker } : {}),
+                ...(image ? { image } : {}),
+                ...(python ? { python } : {}),
+                ...(envEntries.length > 0 ? { env: envEntries } : {}),
+
+                ...(gpuEnabled && offer
+                    ? {
+                          resources: {
+                              gpu: `${offer.name}:${round(convertMiBToGB(offer.memory_mib))}GB:${renderRange(offer.count)}`,
+                          },
+
+                          ...(backends && backends.length > 0 ? { backends } : {}),
+                          ...(offer.spot.length === 1 ? { spot_policy: offer.spot[0] } : {}),
+                          ...(offer.spot.length > 1 ? { spot_policy: 'auto' } : {}),
+                      }
+                    : {}),
+                ...(!gpuEnabled ? { resources: { gpu: 0 } } : {}),
+
+                ...(repo_url || repo_path
+                    ? {
+                          repos: [[repo_url?.trim(), repo_path?.trim()].filter(Boolean).join(':')],
+                      }
+                    : {}),
+
+                ...(working_dir ? { working_dir } : {}),
+            },
+            { lineWidth: -1 },
+        );
     }, [formValues, configuration, envParam, backends]);
 };