Rewrite playground AppHost import parser for multi-line chains

- Preprocess code: strip comments, preprocessor directives, normalize whitespace
- Split into semicolon-delimited statements before parsing (handles multi-line chains)
- AddDatabase chained after builder calls now correctly associates with parent
- WithReference/WaitFor found anywhere in a statement, not just at chain start
- Add missing METHOD_TO_TYPE entries: AddYarp, AddNpmApp, AddPythonApp,
  AddConnectionString, AddCSharpApp, AddElasticsearch, AddMySql, AddOracle, AddNats
- Support path-based AddProject with @"..." verbatim strings
- Add import feedback: show count on success, error message on failure
- Add importFeedback UI banner after import completes

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: adamint

AspireAcademy.Web/src/pages/PlaygroundPage.tsx

@@ -677,73 +677,153 @@ function makeCSharpScaffold(name: string, refs: PlaygroundResource[]): ProjectSc
 const METHOD_TO_TYPE: Record<string, ResourceType> = {
   AddPostgres: 'postgres', AddRedis: 'redis', AddSqlServer: 'sqlserver',
   AddMongoDB: 'mongodb', AddRabbitMQ: 'rabbitmq', AddKafka: 'kafka',
-  AddProject: 'project', AddContainer: 'container',
-  AddViteApp: 'npmapp', AddJavaScriptApp: 'npmapp', AddNodeApp: 'npmapp',
-  AddUvicornApp: 'pythonapp', AddUvApp: 'pythonapp',
+  AddProject: 'project', AddCSharpApp: 'project',
+  AddContainer: 'container',
+  AddNpmApp: 'npmapp', AddViteApp: 'npmapp', AddJavaScriptApp: 'npmapp', AddNodeApp: 'npmapp',
+  AddPythonApp: 'pythonapp', AddUvicornApp: 'pythonapp', AddUvApp: 'pythonapp',
   AddAzureStorage: 'azurestorage', AddAzureKeyVault: 'keyvault',
-  AddParameter: 'parameter',
+  AddParameter: 'parameter', AddConnectionString: 'parameter',
+  AddYarp: 'container', AddElasticsearch: 'container',
+  AddMySql: 'container', AddOracle: 'container', AddNats: 'container',
 };
 
+function preprocessCode(code: string): string {
+  return code
+    .replace(/\/\/.*$/gm, '')
+    .replace(/\/\*[\s\S]*?\*\//g, '')
+    .replace(/#(?:if|else|endif|pragma|region|endregion).*$/gm, '')
+    .replace(/\r\n/g, '\n');
+}
+
+function splitStatements(code: string): string[] {
+  const flat = code.replace(/\n/g, ' ').replace(/\s+/g, ' ');
+  return flat.split(';').map(s => s.trim()).filter(Boolean);
+}
+
 function parseAppHostCode(code: string): PlaygroundResource[] {
   const resources: PlaygroundResource[] = [];
   const varToId = new Map<string, string>();
+  // Map varName to the statement it was defined in (for attribute scanning)
+  const varToStmt = new Map<string, string>();
 
-  // Match: var <varName> = builder.<Method>("<name>"...)
-  const addRegex = /(?:var|const)\s+(\w+)\s*=\s*builder\.(\w+)\s*(?:<[^>]+>)?\s*\("([^"]+)"(?:\s*,\s*"([^"]*)")?/g;
-  let match;
-  while ((match = addRegex.exec(code)) !== null) {
-    const [, varName, method, name, secondArg] = match;
-    const type = METHOD_TO_TYPE[method];
-    if (!type) continue;
-
-    const id = makeId();
-    varToId.set(varName, id);
-
-    const r = makeResource({ id, type, name });
-    if (type === 'container' && secondArg) r.image = secondArg;
-    if ((type === 'npmapp') && secondArg) r.projectPath = secondArg;
-    if (type === 'pythonapp' && secondArg) r.projectPath = secondArg;
-    if (type === 'parameter' && code.includes(`${varName}`) && /secret\s*:\s*true/i.test(code.substring(match.index, match.index + 200))) {
-      r.isSecret = true;
+  const cleaned = preprocessCode(code);
+  const statements = splitStatements(cleaned);
+
+  for (const stmt of statements) {
+    // Step 1: Extract builder.Add* resource declarations
+    const addMatch = stmt.match(
+      /(?:var|const|[A-Z]\w*)\s+(\w+)\s*=\s*builder\.(\w+)\s*(?:<[^>]+>)?\s*\(\s*"([^"]+)"(?:\s*,\s*(?:@?"([^"]*)"))?/
+    );
+    if (addMatch) {
+      const [, varName, method, name, secondArg] = addMatch;
+      const type = METHOD_TO_TYPE[method];
+      if (type) {
+        const id = makeId();
+        varToId.set(varName, id);
+        varToStmt.set(varName, stmt);
+
+        const r = makeResource({ id, type, name });
+        if (type === 'container' && secondArg) r.image = secondArg;
+        if ((type === 'npmapp' || type === 'pythonapp' || type === 'project') && secondArg) r.projectPath = secondArg;
+        if (type === 'parameter' && /secret\s*:\s*true/i.test(stmt)) r.isSecret = true;
+        resources.push(r);
+      }
     }
-    resources.push(r);
-  }
 
-  // Match: .AddDatabase("<name>")
-  const dbRegex = /(\w+)\.AddDatabase\s*\("([^"]+)"\)/g;
-  while ((match = dbRegex.exec(code)) !== null) {
-    const [, parentVar, dbName] = match;
-    const parentId = varToId.get(parentVar);
-    if (parentId) {
-      const parent = resources.find((r) => r.id === parentId);
-      if (parent) parent.databases.push(dbName);
+    // Step 2: Extract .AddDatabase() anywhere in the statement
+    const dbMatches = stmt.matchAll(/\.AddDatabase\s*\(\s*"([^"]+)"\s*\)/g);
+    for (const dbMatch of dbMatches) {
+      const dbName = dbMatch[1];
+      // The parent is the variable assigned in the same statement that contains
+      // the builder.Add* call, OR the variable whose chain this belongs to.
+      // First, try to find the builder.Add* parent in this statement.
+      const parentAddMatch = stmt.match(
+        /(?:var|const|[A-Z]\w*)\s+(\w+)\s*=\s*builder\.(\w+)/
+      );
+      if (parentAddMatch) {
+        // The database is chained onto the resource defined in this statement
+        const parentVar = parentAddMatch[1];
+        const parentId = varToId.get(parentVar);
+        if (parentId) {
+          const parent = resources.find(r => r.id === parentId);
+          if (parent && !parent.databases.includes(dbName)) parent.databases.push(dbName);
+        }
+      } else {
+        // The database call is on a standalone variable: varName.AddDatabase(...)
+        const standaloneMatch = stmt.match(/(\w+)\s*\.\s*AddDatabase/);
+        if (standaloneMatch) {
+          const parentId = varToId.get(standaloneMatch[1]);
+          if (parentId) {
+            const parent = resources.find(r => r.id === parentId);
+            if (parent && !parent.databases.includes(dbName)) parent.databases.push(dbName);
+          }
+        }
+      }
     }
-  }
 
-  // Match: .WithReference(<var>) and .WaitFor(<var>)
-  const chainRegex = /(\w+)(?:\.[\w<>]+\([^)]*\))*\.(WithReference|WaitFor)\((\w+)\)/g;
-  while ((match = chainRegex.exec(code)) !== null) {
-    const [, consumerVar, method, depVar] = match;
-    const consumerId = varToId.get(consumerVar);
-    const depId = varToId.get(depVar);
-    if (!consumerId || !depId) continue;
-    const consumer = resources.find((r) => r.id === consumerId);
-    if (!consumer) continue;
-    if (method === 'WithReference' && !consumer.references.includes(depId)) {
-      consumer.references.push(depId);
+    // Step 3: Also handle `var dbVar = parentVar.AddDatabase("name")` as a variable assignment
+    const dbAssignMatch = stmt.match(
+      /(?:var|const|[A-Z]\w*)\s+(\w+)\s*=\s*(\w+)(?:\.\w+\([^)]*\))*\.AddDatabase\s*\(\s*"([^"]+)"\s*\)/
+    );
+    if (dbAssignMatch) {
+      const [, dbVarName, , dbName] = dbAssignMatch;
+      // Find the database resource by name and map the variable to it
+      // The database itself isn't a separate PlaygroundResource — it's stored on the parent.
+      // But the variable might be referenced via .WithReference(dbVar), so we need to track it.
+      // Find which parent has this database
+      const parentForDb = resources.find(r => r.databases.includes(dbName));
+      if (parentForDb) {
+        varToId.set(dbVarName, parentForDb.id);
+        varToStmt.set(dbVarName, stmt);
+      }
     }
-    if (method === 'WaitFor' && !consumer.waitFor.includes(depId)) {
-      consumer.waitFor.push(depId);
+
+    // Step 4: Extract .WithReference() and .WaitFor() — find the consumer variable
+    const refMatches = [...stmt.matchAll(/\.(WithReference|WaitFor)\s*\(\s*(\w+)\s*\)/g)];
+    if (refMatches.length > 0) {
+      // Find the consumer: the variable being assigned in this statement
+      const consumerMatch = stmt.match(/(?:var|const|[A-Z]\w*)\s+(\w+)\s*=/);
+      const consumerVar = consumerMatch?.[1];
+      const consumerId = consumerVar ? varToId.get(consumerVar) : undefined;
+      const consumer = consumerId ? resources.find(r => r.id === consumerId) : undefined;
+
+      if (!consumer) {
+        // Try standalone: varName.WithReference(...)
+        const standaloneConsumer = stmt.match(/^(\w+)\s*\./);
+        if (standaloneConsumer) {
+          const scId = varToId.get(standaloneConsumer[1]);
+          const sc = scId ? resources.find(r => r.id === scId) : undefined;
+          if (sc) {
+            for (const rm of refMatches) {
+              const [, method, depVar] = rm;
+              const depId = varToId.get(depVar);
+              if (!depId) continue;
+              if (method === 'WithReference' && !sc.references.includes(depId)) sc.references.push(depId);
+              if (method === 'WaitFor' && !sc.waitFor.includes(depId)) sc.waitFor.push(depId);
+            }
+          }
+        }
+      } else {
+        for (const rm of refMatches) {
+          const [, method, depVar] = rm;
+          const depId = varToId.get(depVar);
+          if (!depId) continue;
+          if (method === 'WithReference' && !consumer.references.includes(depId)) consumer.references.push(depId);
+          if (method === 'WaitFor' && !consumer.waitFor.includes(depId)) consumer.waitFor.push(depId);
+        }
+      }
     }
   }
 
-  // Match: .WithDataVolume()
+  // Step 5: Scan statements for attribute methods (.WithDataVolume, .WithLifetime, etc.)
   for (const r of resources) {
     const varName = [...varToId.entries()].find(([, id]) => id === r.id)?.[0];
-    if (varName && new RegExp(`${varName}[^;]*\\.WithDataVolume`).test(code)) r.hasDataVolume = true;
-    if (varName && new RegExp(`${varName}[^;]*\\.WithLifetime\\(ContainerLifetime\\.Persistent\\)`).test(code)) r.isPersistent = true;
-    if (varName && new RegExp(`${varName}[^;]*\\.WithExternalHttpEndpoints`).test(code)) r.hasExternalEndpoints = true;
-    if (varName && new RegExp(`${varName}[^;]*\\.WithHttpEndpoint`).test(code)) r.hasExternalEndpoints = true;
+    if (!varName) continue;
+    const stmt = varToStmt.get(varName) ?? '';
+    if (/\.WithDataVolume\b/.test(stmt)) r.hasDataVolume = true;
+    if (/\.WithLifetime\s*\(\s*ContainerLifetime\.Persistent\s*\)/.test(stmt)) r.isPersistent = true;
+    if (/\.WithExternalHttpEndpoints\b/.test(stmt)) r.hasExternalEndpoints = true;
+    if (/\.WithHttpEndpoint\b/.test(stmt)) r.hasExternalEndpoints = true;
   }
 
   return resources;
@@ -850,6 +930,7 @@ export default function PlaygroundPage() {
   const [activeTab, setActiveTab] = useState('canvas');
   const [importText, setImportText] = useState('');
   const [showImport, setShowImport] = useState(false);
+  const [importFeedback, setImportFeedback] = useState('');
   const [highlightedResource, setHighlightedResource] = useState<string | null>(null);
 
   // Undo/redo history — uses refs for index/history to avoid stale closures
@@ -1095,6 +1176,11 @@ export default function PlaygroundPage() {
       setShowImport(false);
       setImportText('');
       setActiveTab('canvas');
+      setImportFeedback(`Imported ${parsed.length} resource${parsed.length === 1 ? '' : 's'}`);
+      setTimeout(() => setImportFeedback(''), 3000);
+    } else {
+      setImportFeedback('No resources found — check your AppHost code');
+      setTimeout(() => setImportFeedback(''), 3000);
     }
   }, [importText]);
 
@@ -1769,6 +1855,12 @@ export default function PlaygroundPage() {
                 </Box>
               )}
 
+              {importFeedback && (
+                <Box mb="3" p="2" bg={importFeedback.startsWith('No') ? 'red.950' : 'green.950'} borderRadius="sm" border="1px solid" borderColor={importFeedback.startsWith('No') ? 'red.700' : 'green.700'}>
+                  <Text fontSize="xs" color={importFeedback.startsWith('No') ? 'red.300' : 'green.300'}>{importFeedback}</Text>
+                </Box>
+              )}
+
               {/* Name warnings */}
               {nameWarnings.length > 0 && (
                 <Box mb="3" p="2" bg="red.950" borderRadius="sm" border="1px solid" borderColor="red.700">