@malloy-publisher/sdk 0.0.125 → 0.0.126

package/package.json

@@ -1,7 +1,7 @@
 {
    "name": "@malloy-publisher/sdk",
    "description": "Malloy Publisher SDK",
-   "version": "0.0.125",
+   "version": "0.0.126",
    "type": "module",
    "main": "dist/index.cjs.js",
    "module": "dist/index.es.js",

package/src/components/Project/ConnectionExplorer.tsx

@@ -14,9 +14,10 @@ import {
    TableContainer,
    TableHead,
    TableRow,
+   TextField,
    Typography,
 } from "@mui/material";
-import React from "react";
+import React, { useState } from "react";
 import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 import { parseResourceUri } from "../../utils/formatting";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
@@ -224,6 +225,7 @@ function TablesInSchema({
 }: TablesInSchemaProps) {
    const { projectName: projectName } = parseResourceUri(resourceUri);
    const { apiClients } = useServer();
+   const [searchTerm, setSearchTerm] = useState("");
    const { data, isSuccess, isError, error, isLoading } = useQueryWithApiError({
       queryKey: ["tablesInSchema", projectName, connectionName, schemaName],
       queryFn: () =>
@@ -234,12 +236,38 @@ function TablesInSchema({
          ),
    });
 
+   const filteredTables =
+      isSuccess && data?.data
+         ? data.data
+              .filter((table: { resource: string }) => {
+                 const tableName =
+                    table.resource.split(".").pop()?.toLowerCase() || "";
+                 return tableName.includes(searchTerm.toLowerCase());
+              })
+              .sort((a: { resource: string }, b: { resource: string }) => {
+                 const tableNameA = a.resource.split(".").pop() || a.resource;
+                 const tableNameB = b.resource.split(".").pop() || b.resource;
+                 return tableNameA.localeCompare(tableNameB);
+              })
+         : [];
+
    return (
       <>
          <Typography variant="overline" fontWeight="bold">
             Tables in {schemaName}
          </Typography>
          <Divider />
+         <Box sx={{ mt: 1, mb: 1 }}>
+            <TextField
+               size="small"
+               fullWidth
+               placeholder="Search tables..."
+               value={searchTerm}
+               onChange={(e) => setSearchTerm(e.target.value)}
+               variant="outlined"
+            />
+         </Box>
+         <Divider />
          <Box sx={{ mt: "2px", maxHeight: "600px", overflowY: "auto" }}>
             {isLoading && <Loading text="Fetching Tables..." />}
             {isError && (
@@ -248,43 +276,32 @@ function TablesInSchema({
                   context={`${projectName} > ${connectionName} > ${schemaName}`}
                />
             )}
-            {isSuccess && data?.data?.length === 0 && (
+            {isSuccess && filteredTables.length === 0 && (
                <Typography variant="body2">No Tables</Typography>
             )}
             {isSuccess && data?.data && data.data.length > 0 && (
                <List dense disablePadding>
-                  {data.data
-                     .sort(
-                        (a: { resource: string }, b: { resource: string }) => {
-                           // Extract table names for sorting
-                           const tableNameA =
-                              a.resource.split(".").pop() || a.resource;
-                           const tableNameB =
-                              b.resource.split(".").pop() || b.resource;
-                           return tableNameA.localeCompare(tableNameB);
-                        },
-                     )
-                     .map(
-                        (table: {
-                           resource: string;
-                           columns: Array<{ name: string; type: string }>;
-                        }) => {
-                           // Extract table name from resource path (e.g., "schema.table_name" -> "table_name")
-                           const tableName =
-                              table.resource.split(".").pop() || table.resource;
-                           return (
-                              <ListItemButton
-                                 key={table.resource}
-                                 onClick={() => onTableClick(table)}
-                              >
-                                 <ListItemText
-                                    primary={tableName}
-                                    secondary={`${table.columns.length} columns`}
-                                 />
-                              </ListItemButton>
-                           );
-                        },
-                     )}
+                  {filteredTables.map(
+                     (table: {
+                        resource: string;
+                        columns: Array<{ name: string; type: string }>;
+                     }) => {
+                        // Extract table name from resource path (e.g., "schema.table_name" -> "table_name")
+                        const tableName =
+                           table.resource.split(".").pop() || table.resource;
+                        return (
+                           <ListItemButton
+                              key={table.resource}
+                              onClick={() => onTableClick(table)}
+                           >
+                              <ListItemText
+                                 primary={tableName}
+                                 secondary={`${table.columns.length} columns`}
+                              />
+                           </ListItemButton>
+                        );
+                     },
+                  )}
                </List>
             )}
          </Box>

package/src/components/Project/Project.tsx

@@ -5,6 +5,7 @@ import { PackageContainer } from "../styles";
 import About from "./About";
 import AddPackageDialog from "./AddPackageDialog";
 import Packages from "./Packages";
+import { useEffect } from "react";
 
 interface ProjectProps {
    onSelectPackage: (to: string, event?: React.MouseEvent) => void;
@@ -17,6 +18,11 @@ export default function Project({
 }: ProjectProps) {
    const { mutable } = useServer();
    const { projectName } = parseResourceUri(resourceUri);
+
+   useEffect(() => {
+      window.scrollTo({ top: 0, behavior: "auto" });
+   }, []);
+
    return (
       <>
          <PackageContainer>

package/src/components/ServerProvider.tsx

@@ -56,7 +56,7 @@ const getApiClients = (
 
    axiosInstance.interceptors.request.use(async (config) => {
       const token = await accessToken?.();
-      config.headers.Authorization = token ? `Bearer ${token}` : "";
+      config.headers.Authorization = token || "";
       return config;
    });