@malloy-publisher/sdk 0.0.45 → 0.0.46

package/src/components/Project/ConnectionExplorer.tsx

@@ -37,7 +37,7 @@ interface ConnectionExplorerProps {
 export default function ConnectionExplorer({
    connectionName,
 }: ConnectionExplorerProps) {
-   const { server, projectName, accessToken } = useProject();
+   const { projectName } = useProject();
 
    const [selectedTable, setSelectedTable] = React.useState<string | undefined>(
       undefined,
@@ -47,15 +47,9 @@ export default function ConnectionExplorer({
    );
    const [showHiddenSchemas, setShowHiddenSchemas] = React.useState(false);
    const { data, isSuccess, isError, error, isLoading } = useQueryWithApiError({
-      queryKey: ["tablePath", server, projectName, connectionName],
-      queryFn: () =>
-         connectionsApi.listSchemas(projectName, connectionName, {
-            baseURL: server,
-            withCredentials: !accessToken,
-            headers: {
-               Authorization: accessToken && `Bearer ${accessToken}`,
-            },
-         }),
+      queryKey: ["tablePath", projectName, connectionName],
+      queryFn: (config) =>
+         connectionsApi.listSchemas(projectName, connectionName, config),
    });
 
    return (
@@ -166,30 +160,23 @@ function TableViewer({
    tableName,
    onClose,
 }: TableViewerProps) {
-   const { server, projectName, accessToken } = useProject();
+   const { projectName } = useProject();
 
    const { data, isSuccess, isError, error, isLoading } = useQueryWithApiError({
       queryKey: [
          "tablePathSchema",
-         server,
          projectName,
          connectionName,
          schemaName,
          tableName,
       ],
-      queryFn: () =>
+      queryFn: (config) =>
          connectionsApi.getTablesource(
             projectName,
             connectionName,
             tableName,
             `${schemaName}.${tableName}`,
-            {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            },
+            config,
          ),
    });
 
@@ -276,24 +263,17 @@ function TablesInSchema({
    schemaName,
    onTableClick,
 }: TablesInSchemaProps) {
-   const { server, projectName, accessToken } = useProject();
+   const { projectName } = useProject();
 
    const { data, isSuccess, isError, error, isLoading } = useQueryWithApiError({
-      queryKey: [
-         "tablesInSchema",
-         server,
-         projectName,
-         connectionName,
-         schemaName,
-      ],
-      queryFn: () =>
-         connectionsApi.listTables(projectName, connectionName, schemaName, {
-            baseURL: server,
-            withCredentials: !accessToken,
-            headers: {
-               Authorization: accessToken && `Bearer ${accessToken}`,
-            },
-         }),
+      queryKey: ["tablesInSchema", projectName, connectionName, schemaName],
+      queryFn: (config) =>
+         connectionsApi.listTables(
+            projectName,
+            connectionName,
+            schemaName,
+            config,
+         ),
    });
 
    return (

package/src/components/Project/Packages.tsx

@@ -13,18 +13,11 @@ interface PackagesProps {
 }
 
 export default function Packages({ navigate }: PackagesProps) {
-   const { server, projectName, accessToken } = useProject();
+   const { projectName } = useProject();
 
    const { data, isSuccess, isError, error } = useQueryWithApiError({
-      queryKey: ["packages", server, projectName],
-      queryFn: () =>
-         packagesApi.listPackages(projectName, {
-            baseURL: server,
-            withCredentials: !accessToken,
-            headers: {
-               Authorization: accessToken && `Bearer ${accessToken}`,
-            },
-         }),
+      queryKey: ["packages", projectName],
+      queryFn: (config) => packagesApi.listPackages(projectName, config),
    });
 
    return (

package/src/components/Project/Project.tsx

@@ -4,9 +4,7 @@ import Packages from "./Packages";
 import { createContext, useContext, ReactNode } from "react";
 
 export interface ProjectContextProps {
-   server?: string;
    projectName: string;
-   accessToken?: string;
 }
 
 const ProjectContext = createContext<ProjectContextProps | undefined>(
@@ -18,13 +16,11 @@ interface ProjectProviderProps extends ProjectContextProps {
 }
 
 export const ProjectProvider = ({
-   server,
    projectName,
-   accessToken,
    children,
 }: ProjectProviderProps) => {
    return (
-      <ProjectContext.Provider value={{ server, projectName, accessToken }}>
+      <ProjectContext.Provider value={{ projectName }}>
          {children}
       </ProjectContext.Provider>
    );

package/src/components/QueryResult/QueryResult.tsx

@@ -22,13 +22,11 @@ export default function QueryResult({
    sourceName,
    queryName,
 }: QueryResultProps) {
-   const { server, projectName, packageName, versionId, accessToken } =
-      usePackage();
+   const { projectName, packageName, versionId } = usePackage();
 
    const { data, isSuccess, isError, error } = useQueryWithApiError({
       queryKey: [
          "queryResult",
-         server,
          projectName,
          packageName,
          modelPath,
@@ -37,7 +35,7 @@ export default function QueryResult({
          sourceName,
          queryName,
       ],
-      queryFn: () =>
+      queryFn: (config) =>
          queryResultsApi.executeQuery(
             projectName,
             packageName,
@@ -46,13 +44,7 @@ export default function QueryResult({
             sourceName,
             queryName,
             versionId,
-            {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            },
+            config,
          ),
    });
 

package/src/components/ServerProvider.tsx

@@ -0,0 +1,37 @@
+import React, { createContext, useContext, ReactNode } from "react";
+
+export interface ServerContextValue {
+   server: string;
+   accessToken?: string;
+}
+
+const ServerContext = createContext<ServerContextValue | undefined>(undefined);
+
+export interface ServerProviderProps {
+   server?: string;
+   accessToken?: string;
+   children: ReactNode;
+}
+
+export const ServerProvider: React.FC<ServerProviderProps> = ({
+   server = `${window.location.protocol}//${window.location.host}/api/v0`,
+   accessToken,
+   children,
+}) => {
+   const value: ServerContextValue = {
+      server,
+      accessToken,
+   };
+
+   return (
+      <ServerContext.Provider value={value}>{children}</ServerContext.Provider>
+   );
+};
+
+export const useServer = (): ServerContextValue => {
+   const context = useContext(ServerContext);
+   if (context === undefined) {
+      throw new Error("useServer must be used within a ServerProvider");
+   }
+   return context;
+};

package/src/components/index.ts

@@ -7,3 +7,5 @@ export * from "./QueryResult";
 export * from "./Home";
 export * from "./Loading";
 export { useRouterClickHandler } from "./click_helper";
+export { ServerProvider, useServer } from "./ServerProvider";
+export type { ServerContextValue, ServerProviderProps } from "./ServerProvider";

package/src/hooks/useQueryWithApiError.ts

@@ -8,6 +8,8 @@ import {
    UseMutationResult,
 } from "@tanstack/react-query";
 import { ApiError } from "../components/ApiErrorDisplay";
+import { useServer } from "../components";
+import { RawAxiosRequestConfig } from "axios";
 
 // Global QueryClient instance
 const globalQueryClient = new QueryClient({
@@ -25,14 +27,24 @@ const globalQueryClient = new QueryClient({
 
 export function useQueryWithApiError<TData = unknown, TError = ApiError>(
    options: Omit<UseQueryOptions<TData, TError>, "throwOnError" | "retry"> & {
-      queryFn: () => Promise<TData>;
+      queryFn: (config: RawAxiosRequestConfig) => Promise<TData>;
    },
 ): UseQueryResult<TData, TError> {
+   const { server, accessToken } = useServer();
+   const config = {
+      baseURL: server,
+      withCredentials: !accessToken,
+      headers: {
+         Authorization: accessToken && `Bearer ${accessToken}`,
+      },
+   } as RawAxiosRequestConfig;
    const enhancedOptions: UseQueryOptions<TData, TError> = {
       ...options,
+      // Add in the server to the query key so that we can have a per-server caches.
+      queryKey: [...options.queryKey, server],
       queryFn: async () => {
          try {
-            return await options.queryFn();
+            return await options.queryFn(config);
          } catch (err) {
             // Standardized error handling for axios errors
             if (err && typeof err === "object" && "response" in err) {
@@ -70,16 +82,27 @@ export function useMutationWithApiError<
 >(
    options: Omit<
       UseMutationOptions<TData, TError, TVariables>,
-      "throwOnError" | "retry"
+      "throwOnError" | "retry" | "mutationFn"
    > & {
-      mutationFn: (variables: TVariables) => Promise<TData>;
+      mutationFn: (
+         variables: TVariables,
+         config: RawAxiosRequestConfig,
+      ) => Promise<TData>;
    },
 ): UseMutationResult<TData, TError, TVariables> {
+   const { server, accessToken } = useServer();
+   const config = {
+      baseURL: server,
+      withCredentials: !accessToken,
+      headers: {
+         Authorization: accessToken && `Bearer ${accessToken}`,
+      },
+   } as RawAxiosRequestConfig;
    const enhancedOptions: UseMutationOptions<TData, TError, TVariables> = {
       ...options,
       mutationFn: async (variables: TVariables) => {
          try {
-            return await options.mutationFn(variables);
+            return await options.mutationFn(variables, config);
          } catch (err) {
             // Standardized error handling for axios errors
             if (err && typeof err === "object" && "response" in err) {