fix: bq table in metrics view UI not loading;

web-common/src/components/forms/Input.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
   import { IconButton } from "@rilldata/web-common/components/button";
   import { EyeIcon, EyeOffIcon } from "lucide-svelte";
-  import { onMount } from "svelte";
+  import { onMount, type ComponentType, type SvelteComponent } from "svelte";
   import { slide } from "svelte/transition";
   import FieldSwitcher from "./FieldSwitcher.svelte";
   import InputLabel from "./InputLabel.svelte";
@@ -42,6 +42,9 @@
   export let textInputPrefix = "";
   export let lockTooltip: string | undefined = undefined;
   export let disabledMessage = "No valid options";
+  /** Optional icon rendered inside the Select trigger when `options` is set. */
+  export let leadingIcon: ComponentType<SvelteComponent> | undefined =
+    undefined;
   export let options:
     | { value: string; label: string; type?: string }[]
     | undefined = undefined;
@@ -245,6 +248,7 @@
       {size}
       fontSize={size === "sm" ? 12 : 14}
       {truncate}
+      {leadingIcon}
       placeholder={disabled ? disabledMessage : placeholder}
     />
   {/if}

web-common/src/components/forms/Select.svelte

@@ -46,6 +46,9 @@
   export let forcedTriggerStyle = "";
   /** When true, shows an X button to clear the selection back to empty */
   export let clearable = false;
+  /** Optional icon rendered inside the trigger, before the label. */
+  export let leadingIcon: ComponentType<SvelteComponent> | undefined =
+    undefined;
   export let onChange: (value: string) => void = () => {};
 
   let searchText = "";
@@ -133,6 +136,11 @@
           : ''} {forcedTriggerStyle} {outline ? '' : 'border-0'}"
         aria-label={label || ariaLabel}
       >
+        {#if leadingIcon}
+          <span class="flex-none">
+            <svelte:component this={leadingIcon} size="14px" />
+          </span>
+        {/if}
         <span
           class="text-[{fontSize}px] {!selected
             ? 'text-fg-secondary'

web-common/src/features/workspaces/VisualMetrics.svelte

@@ -28,6 +28,8 @@
   import { parseDocument, Scalar, YAMLMap, YAMLSeq } from "yaml";
   import ConnectorExplorer from "../connectors/explorer/ConnectorExplorer.svelte";
   import { connectorExplorerStore } from "../connectors/explorer/connector-explorer-store";
+  import { connectorIconMapping } from "../connectors/connector-metadata";
+  import { getConnectorIconKey } from "../connectors/connectors-utils";
   import { useIsModelingSupportedForConnectorOLAP as useIsModelingSupportedForConnector } from "../connectors/selectors";
   import { FileArtifact } from "../entity-management/file-artifact";
   import {
@@ -170,6 +172,14 @@
   );
   $: hasNonDuckDBOLAPConnector = $hasNonDuckDBOLAPConnectorQuery.data;
 
+  $: analyzedConnectorsQuery = createRuntimeServiceAnalyzeConnectors(
+    runtimeClient,
+    {},
+  );
+  $: analyzedConnector = $analyzedConnectorsQuery.data?.connectors?.find(
+    (c) => c.name === connector,
+  );
+
   $: resourceKind = hasSourceSelected
     ? ResourceKind.Source
     : hasModelSelected
@@ -266,6 +276,13 @@
     measureNamesAndLabels.label,
   );
 
+  // When the metrics view YAML already specifies a live connector, trust the
+  // YAML fields (connector/database/database_schema/table) directly rather than
+  // walking every dataset via OLAPListTables. For warehouses like BigQuery, that
+  // enumeration issues an INFORMATION_SCHEMA.TABLES query per dataset and often
+  // never completes in projects with many datasets.
+  $: hasLiveConnectorYAML = Boolean(yamlConnector && modelOrSourceOrTableName);
+
   $: tablesQuery = createConnectorServiceOLAPListTables(
     runtimeClient,
     { connector },
@@ -274,7 +291,8 @@
         enabled:
           !!runtimeClient.instanceId &&
           !!connector &&
-          !hasValidModelOrSourceSelection,
+          !hasValidModelOrSourceSelection &&
+          !hasLiveConnectorYAML,
       },
     },
   );
@@ -284,12 +302,13 @@
   $: hasValidOLAPTableSelected =
     !hasValidModelOrSourceSelection &&
     modelOrSourceOrTableName &&
-    tables.find(
-      (table) =>
-        table.name === modelOrSourceOrTableName &&
-        (!database || table.database === database) &&
-        (!databaseSchema || table.databaseSchema === databaseSchema),
-    );
+    (hasLiveConnectorYAML ||
+      tables.find(
+        (table) =>
+          table.name === modelOrSourceOrTableName &&
+          (!database || table.database === database) &&
+          (!databaseSchema || table.databaseSchema === databaseSchema),
+      ));
 
   $: tableMode = Boolean(hasValidOLAPTableSelected);
 
@@ -552,7 +571,7 @@
         <div class="flex flex-col gap-y-1 w-full">
           <InputLabel label="Table" id="table">
             <svelte:fragment slot="mode-switch">
-              {#if isModelingSupported}
+              {#if isModelingSupported && !yamlConnector}
                 <button
                   onclick={switchTableMode}
                   class="ml-auto text-primary-600 font-medium text-xs"
@@ -574,6 +593,16 @@
                   {#if !hasValidOLAPTableSelected}
                     <span class="text-fg-muted truncate">Select table</span>
                   {:else}
+                    {#if analyzedConnector}
+                      <span class="flex-none">
+                        <svelte:component
+                          this={connectorIconMapping[
+                            getConnectorIconKey(analyzedConnector)
+                          ]}
+                          size="14px"
+                        />
+                      </span>
+                    {/if}
                     <span class="text-fg-secondary truncate">
                       {modelOrSourceOrTableName}
                     </span>
@@ -610,6 +639,9 @@
             options={modelAndSourceOptions}
             placeholder="Select a model"
             label="Model"
+            leadingIcon={analyzedConnector
+              ? connectorIconMapping[getConnectorIconKey(analyzedConnector)]
+              : undefined}
             onChange={async (newModelOrSourceName) => {
               if (modelOrSourceOrTableName === newModelOrSourceName) return;
               if (!modelOrSourceOrTableName) {