@malloy-publisher/sdk 0.0.41 → 0.0.43

package/src/components/Package/Databases.tsx

@@ -12,16 +12,15 @@ import {
    TableRow,
    Typography,
 } from "@mui/material";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import React from "react";
 import { Configuration, Database, DatabasesApi } from "../../client";
 import { StyledCard, StyledCardContent } from "../styles";
 import { usePackage } from "./PackageProvider";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const databasesApi = new DatabasesApi(new Configuration());
-const queryClient = new QueryClient();
 
 export default function Databases() {
    const { server, projectName, packageName, versionId, accessToken } =
@@ -41,22 +40,17 @@ export default function Databases() {
       setSelectedDatabase(null);
    };
 
-   const { data, isError, error, isSuccess } = useQuery(
-      {
-         queryKey: ["databases", server, projectName, packageName, versionId],
-         queryFn: () =>
-            databasesApi.listDatabases(projectName, packageName, versionId, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   const { data, isError, error, isSuccess } = useQueryWithApiError({
+      queryKey: ["databases", server, projectName, packageName, versionId],
+      queryFn: () =>
+         databasesApi.listDatabases(projectName, packageName, versionId, {
+            baseURL: server,
+            withCredentials: !accessToken,
+            headers: {
+               Authorization: accessToken && `Bearer ${accessToken}`,
+            },
+         }),
+   });
    const formatRowSize = (size: number) => {
       if (size >= 1024 * 1024 * 1024 * 1024) {
          return `${(size / (1024 * 1024 * 1024)).toFixed(2)} T`;

package/src/components/Package/Models.tsx

@@ -1,16 +1,13 @@
 import { Box, Divider, Typography } from "@mui/material";
-import { QueryClient, useQuery } from "@tanstack/react-query";
-import axios from "axios";
 import { Configuration, ModelsApi } from "../../client";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
 import { StyledCard, StyledCardContent } from "../styles";
 import { FileTreeView } from "./FileTreeView";
 import { usePackage } from "./PackageProvider";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
-axios.defaults.baseURL = "http://localhost:4000";
 const modelsApi = new ModelsApi(new Configuration());
-const queryClient = new QueryClient();
 
 const DEFAULT_EXPANDED_FOLDERS = ["notebooks/", "models/"];
 
@@ -22,22 +19,17 @@ export default function Models({ navigate }: ModelsProps) {
    const { server, projectName, packageName, versionId, accessToken } =
       usePackage();
 
-   const { data, isError, error, isSuccess } = useQuery(
-      {
-         queryKey: ["models", server, projectName, packageName, versionId],
-         queryFn: () =>
-            modelsApi.listModels(projectName, packageName, versionId, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         throwOnError: false,
-         retry: false,
-      },
-      queryClient,
-   );
+   const { data, isError, error, isSuccess } = useQueryWithApiError({
+      queryKey: ["models", server, projectName, packageName, versionId],
+      queryFn: () =>
+         modelsApi.listModels(projectName, packageName, versionId, {
+            baseURL: server,
+            withCredentials: !accessToken,
+            headers: {
+               Authorization: accessToken && `Bearer ${accessToken}`,
+            },
+         }),
+   });
 
    return (
       <StyledCard variant="outlined" sx={{ padding: "10px", width: "100%" }}>

package/src/components/Package/Notebooks.tsx

@@ -1,14 +1,13 @@
 import { Box, Divider, Typography } from "@mui/material";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { Configuration, NotebooksApi } from "../../client";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
 import { StyledCard, StyledCardContent } from "../styles";
 import { FileTreeView } from "./FileTreeView";
 import { usePackage } from "./PackageProvider";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const notebooksApi = new NotebooksApi(new Configuration());
-const queryClient = new QueryClient();
 
 const DEFAULT_EXPANDED_FOLDERS = ["notebooks/"];
 
@@ -20,22 +19,24 @@ export default function Notebooks({ navigate }: NotebooksProps) {
    const { server, projectName, packageName, versionId, accessToken } =
       usePackage();
 
-   const { data, isError, error, isSuccess } = useQuery(
-      {
-         queryKey: ["notebooks", server, projectName, packageName, versionId],
-         queryFn: () =>
-            notebooksApi.listNotebooks(projectName, packageName, versionId, {
+   const { data, isError, error, isSuccess } = useQueryWithApiError({
+      queryKey: ["notebooks", server, projectName, packageName, versionId],
+      queryFn: async () => {
+         const response = await notebooksApi.listNotebooks(
+            projectName,
+            packageName,
+            versionId,
+            {
                baseURL: server,
                withCredentials: !accessToken,
                headers: {
                   Authorization: accessToken && `Bearer ${accessToken}`,
                },
-            }),
-         throwOnError: false,
-         retry: false,
+            },
+         );
+         return response;
       },
-      queryClient,
-   );
+   });
 
    return (
       <StyledCard variant="outlined" sx={{ padding: "10px", width: "100%" }}>

package/src/components/Package/Schedules.tsx

@@ -10,36 +10,30 @@ import {
    TableRow,
    Typography,
 } from "@mui/material";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { Configuration, SchedulesApi } from "../../client";
 import { StyledCard, StyledCardContent } from "../styles";
 import { usePackage } from "./PackageProvider";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const schedulesApi = new SchedulesApi(new Configuration());
-const queryClient = new QueryClient();
 
 export default function Schedules() {
    const { server, projectName, packageName, versionId, accessToken } =
       usePackage();
 
-   const { data, isError, isLoading, error } = useQuery(
-      {
-         queryKey: ["schedules", server, projectName, packageName, versionId],
-         queryFn: () =>
-            schedulesApi.listSchedules(projectName, packageName, versionId, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   const { data, isError, isLoading, error } = useQueryWithApiError({
+      queryKey: ["schedules", server, projectName, packageName, versionId],
+      queryFn: () =>
+         schedulesApi.listSchedules(projectName, packageName, versionId, {
+            baseURL: server,
+            withCredentials: !accessToken,
+            headers: {
+               Authorization: accessToken && `Bearer ${accessToken}`,
+            },
+         }),
+   });
 
    if (isLoading) {
       return <Loading text="Fetching Schedules..." />;

package/src/components/Project/About.tsx

@@ -2,33 +2,27 @@ import { Divider, Typography } from "@mui/material";
 import { Configuration, ProjectsApi } from "../../client";
 import Markdown from "markdown-to-jsx";
 import { StyledCard, StyledCardContent, StyledCardMedia } from "../styles";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { useProject } from "./Project";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const projectsApi = new ProjectsApi(new Configuration());
-const queryClient = new QueryClient();
 
 export default function About() {
    const { server, projectName, accessToken } = useProject();
 
-   const { data, isSuccess, isError, error } = useQuery(
-      {
-         queryKey: ["about", server, projectName],
-         queryFn: () =>
-            projectsApi.getProject(projectName, false, {
-               baseURL: server,
-               withCredentials: true,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   const { data, isSuccess, isError, error } = useQueryWithApiError({
+      queryKey: ["about", server, projectName],
+      queryFn: () =>
+         projectsApi.getProject(projectName, false, {
+            baseURL: server,
+            withCredentials: true,
+            headers: {
+               Authorization: accessToken && `Bearer ${accessToken}`,
+            },
+         }),
+   });
 
    return (
       <>

package/src/components/Project/ConnectionExplorer.tsx

@@ -21,15 +21,14 @@ import {
    TableHead,
    TableRow,
 } from "@mui/material";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { ConnectionsApi } from "../../client/api";
 import { Configuration } from "../../client/configuration";
 import { useProject } from "./Project";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const connectionsApi = new ConnectionsApi(new Configuration());
-const queryClient = new QueryClient();
 
 interface ConnectionExplorerProps {
    connectionName: string;
@@ -47,22 +46,17 @@ export default function ConnectionExplorer({
       null,
    );
    const [showHiddenSchemas, setShowHiddenSchemas] = React.useState(false);
-   const { data, isSuccess, isError, error, isLoading } = useQuery(
-      {
-         queryKey: ["tablePath", server, projectName, connectionName],
-         queryFn: () =>
-            connectionsApi.listSchemas(projectName, connectionName, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   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}`,
+            },
+         }),
+   });
 
    return (
       <Grid container spacing={2}>
@@ -174,35 +168,30 @@ function TableViewer({
 }: TableViewerProps) {
    const { server, projectName, accessToken } = useProject();
 
-   const { data, isSuccess, isError, error, isLoading } = useQuery(
-      {
-         queryKey: [
-            "tablePathSchema",
-            server,
+   const { data, isSuccess, isError, error, isLoading } = useQueryWithApiError({
+      queryKey: [
+         "tablePathSchema",
+         server,
+         projectName,
+         connectionName,
+         schemaName,
+         tableName,
+      ],
+      queryFn: () =>
+         connectionsApi.getTablesource(
             projectName,
             connectionName,
-            schemaName,
             tableName,
-         ],
-         queryFn: () =>
-            connectionsApi.getTablesource(
-               projectName,
-               connectionName,
-               tableName,
-               `${schemaName}.${tableName}`,
-               {
-                  baseURL: server,
-                  withCredentials: !accessToken,
-                  headers: {
-                     Authorization: accessToken && `Bearer ${accessToken}`,
-                  },
+            `${schemaName}.${tableName}`,
+            {
+               baseURL: server,
+               withCredentials: !accessToken,
+               headers: {
+                  Authorization: accessToken && `Bearer ${accessToken}`,
                },
-            ),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+            },
+         ),
+   });
 
    if (isSuccess && data) {
       console.log(data);
@@ -289,28 +278,23 @@ function TablesInSchema({
 }: TablesInSchemaProps) {
    const { server, projectName, accessToken } = useProject();
 
-   const { data, isSuccess, isError, error, isLoading } = useQuery(
-      {
-         queryKey: [
-            "tablesInSchema",
-            server,
-            projectName,
-            connectionName,
-            schemaName,
-         ],
-         queryFn: () =>
-            connectionsApi.listTables(projectName, connectionName, schemaName, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   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}`,
+            },
+         }),
+   });
 
    return (
       <>

package/src/components/Project/Packages.tsx

@@ -1,13 +1,12 @@
 import { Box, Divider, Grid, Typography } from "@mui/material";
 import { Configuration, PackagesApi } from "../../client";
 import { StyledCard, StyledCardContent, StyledCardMedia } from "../styles";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { useProject } from "./Project";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const packagesApi = new PackagesApi(new Configuration());
-const queryClient = new QueryClient();
 
 interface PackagesProps {
    navigate: (to: string, event?: React.MouseEvent) => void;
@@ -16,22 +15,17 @@ interface PackagesProps {
 export default function Packages({ navigate }: PackagesProps) {
    const { server, projectName, accessToken } = useProject();
 
-   const { data, isSuccess, isError, error } = useQuery(
-      {
-         queryKey: ["packages", server, projectName],
-         queryFn: () =>
-            packagesApi.listPackages(projectName, {
-               baseURL: server,
-               withCredentials: !accessToken,
-               headers: {
-                  Authorization: accessToken && `Bearer ${accessToken}`,
-               },
-            }),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+   const { data, isSuccess, isError, error } = useQueryWithApiError({
+      queryKey: ["packages", server, projectName],
+      queryFn: () =>
+         packagesApi.listPackages(projectName, {
+            baseURL: server,
+            withCredentials: !accessToken,
+            headers: {
+               Authorization: accessToken && `Bearer ${accessToken}`,
+            },
+         }),
+   });
 
    return (
       <>

package/src/components/QueryResult/QueryResult.tsx

@@ -1,14 +1,13 @@
 import { Suspense, lazy } from "react";
 import { Configuration, QueryresultsApi } from "../../client";
-import { QueryClient, useQuery } from "@tanstack/react-query";
 import { usePackage } from "../Package/PackageProvider";
 import { ApiErrorDisplay } from "../ApiErrorDisplay";
 import { Loading } from "../Loading";
+import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 
 const RenderedResult = lazy(() => import("../RenderedResult/RenderedResult"));
 
 const queryResultsApi = new QueryresultsApi(new Configuration());
-const queryClient = new QueryClient();
 
 interface QueryResultProps {
    modelPath: string;
@@ -26,41 +25,36 @@ export default function QueryResult({
    const { server, projectName, packageName, versionId, accessToken } =
       usePackage();
 
-   const { data, isSuccess, isError, error } = useQuery(
-      {
-         queryKey: [
-            "queryResult",
-            server,
+   const { data, isSuccess, isError, error } = useQueryWithApiError({
+      queryKey: [
+         "queryResult",
+         server,
+         projectName,
+         packageName,
+         modelPath,
+         versionId,
+         query,
+         sourceName,
+         queryName,
+      ],
+      queryFn: () =>
+         queryResultsApi.executeQuery(
             projectName,
             packageName,
             modelPath,
-            versionId,
             query,
             sourceName,
             queryName,
-         ],
-         queryFn: () =>
-            queryResultsApi.executeQuery(
-               projectName,
-               packageName,
-               modelPath,
-               query,
-               sourceName,
-               queryName,
-               versionId,
-               {
-                  baseURL: server,
-                  withCredentials: !accessToken,
-                  headers: {
-                     Authorization: accessToken && `Bearer ${accessToken}`,
-                  },
+            versionId,
+            {
+               baseURL: server,
+               withCredentials: !accessToken,
+               headers: {
+                  Authorization: accessToken && `Bearer ${accessToken}`,
                },
-            ),
-         retry: false,
-         throwOnError: false,
-      },
-      queryClient,
-   );
+            },
+         ),
+   });
 
    return (
       <>

package/src/hooks/useQueryWithApiError.ts

@@ -0,0 +1,114 @@
+import {
+   useQuery,
+   useMutation,
+   QueryClient,
+   UseQueryOptions,
+   UseQueryResult,
+   UseMutationOptions,
+   UseMutationResult,
+} from "@tanstack/react-query";
+import { ApiError } from "../components/ApiErrorDisplay";
+
+// Global QueryClient instance
+const globalQueryClient = new QueryClient({
+   defaultOptions: {
+      queries: {
+         retry: false,
+         throwOnError: false,
+      },
+      mutations: {
+         retry: false,
+         throwOnError: false,
+      },
+   },
+});
+
+export function useQueryWithApiError<TData = unknown, TError = ApiError>(
+   options: Omit<UseQueryOptions<TData, TError>, "throwOnError" | "retry"> & {
+      queryFn: () => Promise<TData>;
+   },
+): UseQueryResult<TData, TError> {
+   const enhancedOptions: UseQueryOptions<TData, TError> = {
+      ...options,
+      queryFn: async () => {
+         try {
+            return await options.queryFn();
+         } catch (err) {
+            // Standardized error handling for axios errors
+            if (err && typeof err === "object" && "response" in err) {
+               const axiosError = err as {
+                  response?: {
+                     status: number;
+                     data: { code: number; message: string };
+                  };
+                  message: string;
+               };
+               if (axiosError.response?.data) {
+                  const apiError: ApiError = new Error(
+                     axiosError.response.data.message || axiosError.message,
+                  );
+                  apiError.status = axiosError.response.status;
+                  apiError.data = axiosError.response.data;
+                  throw apiError;
+               }
+            }
+            // For other errors, throw as is
+            throw err;
+         }
+      },
+      retry: false,
+      throwOnError: false,
+   };
+
+   return useQuery(enhancedOptions, globalQueryClient);
+}
+
+export function useMutationWithApiError<
+   TData = unknown,
+   TError = ApiError,
+   TVariables = void,
+>(
+   options: Omit<
+      UseMutationOptions<TData, TError, TVariables>,
+      "throwOnError" | "retry"
+   > & {
+      mutationFn: (variables: TVariables) => Promise<TData>;
+   },
+): UseMutationResult<TData, TError, TVariables> {
+   const enhancedOptions: UseMutationOptions<TData, TError, TVariables> = {
+      ...options,
+      mutationFn: async (variables: TVariables) => {
+         try {
+            return await options.mutationFn(variables);
+         } catch (err) {
+            // Standardized error handling for axios errors
+            if (err && typeof err === "object" && "response" in err) {
+               const axiosError = err as {
+                  response?: {
+                     status: number;
+                     data: { code: number; message: string };
+                  };
+                  message: string;
+               };
+               if (axiosError.response?.data) {
+                  const apiError: ApiError = new Error(
+                     axiosError.response.data.message || axiosError.message,
+                  );
+                  apiError.status = axiosError.response.status;
+                  apiError.data = axiosError.response.data;
+                  throw apiError;
+               }
+            }
+            // For other errors, throw as is
+            throw err;
+         }
+      },
+      retry: false,
+      throwOnError: false,
+   };
+
+   return useMutation(enhancedOptions, globalQueryClient);
+}
+
+// Export the global query client for direct access if needed
+export { globalQueryClient };

package/src/index.ts

@@ -1,2 +1,7 @@
 export * from "./components";
 export { default as ConnectionExplorer } from "./components/Project/ConnectionExplorer";
+import axios from "axios";
+
+// There's a bug in the OpenAPI generator that causes it to ignore baseURL in the
+// axios request if defaults.baseURL is not set.
+axios.defaults.baseURL = "IfYouAreSeeingThis_baseURL_IsNotSet";