@malloy-publisher/sdk 0.0.126 → 0.0.128

package/package.json

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

package/src/components/Connections/common.ts

@@ -162,6 +162,11 @@ export const connectionFieldsByType: Record<
          name: "password",
          type: "password",
       },
+      {
+         label: "Peaka Key",
+         name: "peakaKey",
+         type: "password",
+      },
    ],
    mysql: [
       {

package/src/components/Model/Model.tsx

@@ -22,13 +22,18 @@ import { useModelData } from "./useModelData";
 interface ModelProps {
    onChange?: (query: QueryExplorerResult) => void;
    resourceUri: string;
+   runOnDemand?: boolean;
 }
 
 // Note: For this to properly render outside of publisher,
 // you must explicitly import the styles from the package:
 // import "@malloy-publisher/sdk/malloy-explorer.css";
 
-export default function Model({ onChange, resourceUri }: ModelProps) {
+export default function Model({
+   onChange,
+   resourceUri,
+   runOnDemand = false,
+}: ModelProps) {
    const { modelPath } = parseResourceUri(resourceUri);
    const { data, isError, isLoading, error } = useModelData(resourceUri);
    const [dialogOpen, setDialogOpen] = React.useState(false);
@@ -184,6 +189,7 @@ export default function Model({ onChange, resourceUri }: ModelProps) {
                         queryName={query.name}
                         annotations={query.annotations}
                         resourceUri={resourceUri}
+                        runOnDemand={runOnDemand}
                      />
                   ))}
                </Stack>

package/src/components/Model/ModelCell.tsx

@@ -1,5 +1,6 @@
+import PlayArrowIcon from "@mui/icons-material/PlayArrow";
 import SearchIcon from "@mui/icons-material/Search";
-import { Box, IconButton, Typography } from "@mui/material";
+import { Box, Button, IconButton, Typography } from "@mui/material";
 import React, { useEffect } from "react";
 import { useQueryWithApiError } from "../../hooks/useQueryWithApiError";
 import { parseResourceUri } from "../../utils/formatting";
@@ -15,16 +16,19 @@ interface ModelCellProps {
    noView?: boolean;
    annotations?: string[];
    resourceUri: string;
+   runOnDemand?: boolean;
 }
 
 export function ModelCell({
    queryName,
    annotations,
    resourceUri,
+   runOnDemand = false,
 }: ModelCellProps) {
    const [highlightedAnnotations, setHighlightedAnnotations] =
       React.useState<string>();
    const [resultsDialogOpen, setResultsDialogOpen] = React.useState(false);
+   const [hasRun, setHasRun] = React.useState(false);
 
    const { packageName, projectName, versionId, modelPath } =
       parseResourceUri(resourceUri);
@@ -48,7 +52,7 @@ export function ModelCell({
                versionId: versionId,
             },
          ),
-      enabled: true, // Always execute
+      enabled: runOnDemand ? hasRun : true, // Execute on demand or always
    });
 
    useEffect(() => {
@@ -126,19 +130,54 @@ export function ModelCell({
                position: "relative",
             }}
          >
-            {isLoading && (
+            {runOnDemand && !hasRun && (
+               <Box
+                  sx={{
+                     padding: "40px 20px",
+                     textAlign: "center",
+                     display: "flex",
+                     flexDirection: "column",
+                     alignItems: "center",
+                     gap: "16px",
+                  }}
+               >
+                  <Typography variant="body2" color="text.secondary">
+                     Click Run to execute the query
+                  </Typography>
+                  <Button
+                     variant="contained"
+                     startIcon={<PlayArrowIcon />}
+                     onClick={() => setHasRun(true)}
+                     sx={{
+                        backgroundColor: "#1976d2",
+                        "&:hover": {
+                           backgroundColor: "#1565c0",
+                        },
+                        textTransform: "none",
+                        fontSize: "14px",
+                        fontWeight: 600,
+                        padding: "8px 24px",
+                     }}
+                  >
+                     Run Query
+                  </Button>
+               </Box>
+            )}
+            {(!runOnDemand || hasRun) && isLoading && (
                <Box sx={{ padding: "20px", textAlign: "center" }}>
                   <Typography>Loading results...</Typography>
                </Box>
             )}
-            {isSuccess && queryData?.data?.result && (
-               <ResultContainer
-                  result={queryData.data.result}
-                  minHeight={300}
-                  maxHeight={600}
-                  hideToggle={false}
-               />
-            )}
+            {(!runOnDemand || hasRun) &&
+               isSuccess &&
+               queryData?.data?.result && (
+                  <ResultContainer
+                     result={queryData.data.result}
+                     minHeight={300}
+                     maxHeight={600}
+                     hideToggle={false}
+                  />
+               )}
          </CleanMetricCard>
 
          {/* Results Dialog */}

package/src/components/Package/Connections.tsx

@@ -36,7 +36,7 @@ type ConnectionProps = {
    connection: ApiConnection;
    onClick: () => void;
    onEdit: (connection: ApiConnection) => Promise<unknown>;
-   onDelete: (connection: ApiConnection) => Promise<unknown>;
+   onDelete: (connection: ApiConnection) => Promise<unknown> | void;
    isMutating: boolean;
    mutable: boolean;
 };
@@ -274,9 +274,19 @@ export default function Connections({ resourceUri }: ConnectionsProps) {
                                  onEdit={(payload) =>
                                     updateConnection.mutateAsync(payload)
                                  }
-                                 onDelete={(payload) =>
-                                    deleteConnection.mutateAsync(payload)
-                                 }
+                                 onDelete={(payload) => {
+                                    if (
+                                       !selectedConnectionResourceUri.startsWith(
+                                          "publisher:",
+                                       )
+                                    ) {
+                                       deleteConnection.mutateAsync(payload);
+                                    } else {
+                                       setNotificationMessage(
+                                          "Cannot delete this connection (publisher: resource)",
+                                       );
+                                    }
+                                 }}
                                  isMutating={
                                     updateConnection.isPending ||
                                     deleteConnection.isPending