@quillsql/admin 1.8.8 → 1.8.9

package/dist/index.cjs

@@ -21567,6 +21567,7 @@ function EditEnvironmentModal({
     state,
     dispatch,
     refreshClientsList,
+    setClient,
     getToken,
     quillFetchWithToken,
     eventTracking
@@ -21578,6 +21579,12 @@ function EditEnvironmentModal({
   const [isSubmitTenantLoading, setSubmitTenantLoading] = (0, import_react50.useState)(false);
   const [isSaveEnvironmentLoading, setIsSaveEnvironmentLoading] = (0, import_react50.useState)(false);
   const [isDeleteEnvironmentLoading, setIsDeleteEnvironmentLoading] = (0, import_react50.useState)(false);
+  const [isCreateChildEnvironmentLoading, setIsCreateChildEnvironmentLoading] = (0, import_react50.useState)(false);
+  const [
+    isPromoteChildEnvironmentLoading,
+    setIsPromoteChildEnvironmentLoading
+  ] = (0, import_react50.useState)(false);
+  const [developmentEnvironmentConfirm, setDevelopmentEnvironmentConfirm] = (0, import_react50.useState)(null);
   const [validationError, setValidationError] = (0, import_react50.useState)(
     void 0
   );
@@ -21585,6 +21592,26 @@ function EditEnvironmentModal({
   const connectionDetails = (0, import_react50.useMemo)(() => {
     return getDatabaseConnectionFormat(state.client?.databaseType || "");
   }, [state.client?.databaseType]);
+  const sourceClientId = (0, import_react50.useMemo)(() => {
+    if (state.sandboxParentClientId != null) {
+      return String(state.sandboxParentClientId);
+    }
+    return clientRecordId(state.client);
+  }, [state.sandboxParentClientId, state.client]);
+  const relatedChildEnvironments = (0, import_react50.useMemo)(() => {
+    const parentClientId = state.client?.sandboxParentClientId != null ? String(state.client.sandboxParentClientId) : sourceClientId;
+    if (!parentClientId) return [];
+    return state.clients.filter(
+      (c2) => c2.sandboxParentClientId != null && String(c2.sandboxParentClientId) === parentClientId
+    );
+  }, [state.clients, state.client?.sandboxParentClientId, sourceClientId]);
+  const sourceEnvironmentName = (0, import_react50.useMemo)(() => {
+    if (!sourceClientId) return state.client?.name;
+    const sourceClient = state.clients.find(
+      (c2) => clientRecordId(c2) === sourceClientId
+    );
+    return sourceClient?.name ?? state.client?.name;
+  }, [sourceClientId, state.clients, state.client?.name]);
   const [tenantToEdit, setTenantToEdit] = (0, import_react50.useState)(
     void 0
   );
@@ -21983,6 +22010,104 @@ function EditEnvironmentModal({
       setFetchSchemasLoading(false);
     }
   };
+  const handleCreateChildEnvironment = async () => {
+    if (!sourceClientId) return;
+    setDevelopmentEnvironmentConfirm(null);
+    setIsCreateChildEnvironmentLoading(true);
+    try {
+      const response = await quillFetchWithToken({
+        client: {
+          queryEndpoint: state.queryEndpoint,
+          clientId: sourceClientId,
+          withCredentials: !!state.withCredentials,
+          queryHeaders: state.queryHeaders
+        },
+        task: "create-sandbox",
+        metadata: {
+          clientId: sourceClientId,
+          permanentSandbox: true
+        },
+        adminMode: true
+      });
+      if (response.status === "error") {
+        throw new Error(response.error);
+      }
+      await refreshClientsList(sourceClientId);
+    } catch (e2) {
+      eventTracking?.logError?.({
+        type: "bug",
+        // TODO: determine type
+        severity: "high",
+        message: "Error creating child environment",
+        errorMessage: e2.message,
+        errorStack: e2.stack,
+        errorData: {
+          caller: "EditEnvironmentModal",
+          function: "handleCreateChildEnvironment"
+        }
+      });
+      setValidationError(e2.message);
+    } finally {
+      setIsCreateChildEnvironmentLoading(false);
+    }
+  };
+  const handlePromoteChildEnvironment = async () => {
+    if (developmentEnvironmentConfirm?.action !== "promote") return;
+    const childEnvironmentToPromote = developmentEnvironmentConfirm.environment;
+    const promoteClientId = clientRecordId(childEnvironmentToPromote);
+    if (!promoteClientId) {
+      setValidationError("Cannot promote: missing target environment id.");
+      return;
+    }
+    setDevelopmentEnvironmentConfirm(null);
+    setIsPromoteChildEnvironmentLoading(true);
+    try {
+      const response = await quillFetchWithToken({
+        client: {
+          queryEndpoint: state.queryEndpoint,
+          clientId: promoteClientId,
+          withCredentials: !!state.withCredentials,
+          queryHeaders: state.queryHeaders
+        },
+        task: "promote",
+        metadata: {
+          clientId: promoteClientId,
+          forcePromote: true
+        },
+        adminMode: true
+      });
+      if (response.status === "error" || response.error) {
+        throw new Error(response.error);
+      }
+      const hasActiveSandbox = state.sandboxSessionId != null || state.sandboxClientId != null;
+      if (hasActiveSandbox && sourceClientId) {
+        setClient(
+          { clientId: sourceClientId },
+          true,
+          true,
+          true
+        );
+      }
+      await refreshClientsList(sourceClientId);
+      setIsOpen(false);
+    } catch (e2) {
+      eventTracking?.logError?.({
+        type: "bug",
+        // TODO: determine type
+        severity: "high",
+        message: "Error promoting child environment",
+        errorMessage: e2.message,
+        errorStack: e2.stack,
+        errorData: {
+          caller: "EditEnvironmentModal",
+          function: "handlePromoteChildEnvironment"
+        }
+      });
+      setValidationError(e2.message);
+    } finally {
+      setIsPromoteChildEnvironmentLoading(false);
+    }
+  };
   const handleDeleteEnvironment = async () => {
     if (state.clients.length === 1) {
       alert("You cannot delete the only environment");
@@ -22029,8 +22154,9 @@ function EditEnvironmentModal({
       }
     }
   };
-  const isEnvironmentModalLoading = isDeleteEnvironmentLoading || isSaveEnvironmentLoading;
-  const environmentLoadingLabel = isDeleteEnvironmentLoading ? "Deleting environment..." : "Saving environment...";
+  const isEnvironmentModalLoading = isDeleteEnvironmentLoading || isSaveEnvironmentLoading || isCreateChildEnvironmentLoading || isPromoteChildEnvironmentLoading;
+  const environmentLoadingLabel = isDeleteEnvironmentLoading ? "Deleting environment..." : isCreateChildEnvironmentLoading ? "Creating child environment..." : isPromoteChildEnvironmentLoading ? "Promoting environment..." : "Saving environment...";
+  const isDevelopmentEnvironmentConfirmLoading = developmentEnvironmentConfirm?.action === "promote" ? isPromoteChildEnvironmentLoading : isCreateChildEnvironmentLoading;
   return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
       ModalComponent,
@@ -22043,6 +22169,9 @@ function EditEnvironmentModal({
           setSelectedEnvironmentName(state.client.name);
           setIsSaveEnvironmentLoading(false);
           setIsDeleteEnvironmentLoading(false);
+          setIsCreateChildEnvironmentLoading(false);
+          setIsPromoteChildEnvironmentLoading(false);
+          setDevelopmentEnvironmentConfirm(null);
         },
         style: {
           minWidth: "600px"
@@ -22213,38 +22342,115 @@ function EditEnvironmentModal({
                   disabled: isEnvironmentModalLoading
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(import_jsx_runtime52.Fragment, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(CardSection, { children: "Danger Zone" }),
-                /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
-                  "div",
-                  {
-                    style: {
-                      display: "flex",
-                      flexDirection: "column",
-                      width: "fit-content",
-                      gap: 16
-                    },
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
-                        SecondaryButtonComponent,
-                        {
-                          onClick: () => setIsConnectDatabaseModalOpen(true),
-                          label: "Edit Database Connection",
-                          disabled: isEnvironmentModalLoading
-                        }
-                      ),
-                      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
-                        SecondaryButtonComponent,
-                        {
-                          onClick: handleDeleteEnvironment,
-                          label: "Delete Environment",
-                          disabled: isEnvironmentModalLoading
-                        }
-                      )
-                    ]
-                  }
-                )
-              ] }),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(CardSection, { children: "Danger Zone" }),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    width: "fit-content",
+                    gap: 16
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: () => setIsConnectDatabaseModalOpen(true),
+                        label: "Edit Database Connection",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: handleDeleteEnvironment,
+                        label: "Delete Environment",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(CardSection, { children: "Development Environments" }),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    width: "fit-content",
+                    gap: 16
+                  },
+                  children: [
+                    relatedChildEnvironments.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      "table",
+                      {
+                        style: {
+                          borderCollapse: "collapse",
+                          width: "100%",
+                          minWidth: 280,
+                          fontFamily: state.theme.fontFamily,
+                          fontSize: 14,
+                          color: state.theme.primaryTextColor
+                        },
+                        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("tbody", { children: relatedChildEnvironments.map((env) => {
+                          const envId = clientRecordId(env);
+                          const cellBorder = `1px solid ${state.theme.borderColor ?? "#e7e7e7"}`;
+                          return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("tr", { children: [
+                            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                              "td",
+                              {
+                                style: {
+                                  border: cellBorder,
+                                  padding: "8px 12px",
+                                  fontWeight: 500
+                                },
+                                children: env.name
+                              }
+                            ),
+                            /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                              "td",
+                              {
+                                style: {
+                                  border: cellBorder,
+                                  padding: "8px 12px",
+                                  width: 1,
+                                  whiteSpace: "nowrap"
+                                },
+                                children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                                  ButtonComponent,
+                                  {
+                                    label: "Promote",
+                                    onClick: () => setDevelopmentEnvironmentConfirm({
+                                      action: "promote",
+                                      environment: env
+                                    }),
+                                    disabled: isEnvironmentModalLoading || developmentEnvironmentConfirm != null,
+                                    style: {
+                                      height: 32,
+                                      paddingLeft: 12,
+                                      paddingRight: 12
+                                    }
+                                  }
+                                )
+                              }
+                            )
+                          ] }, envId ?? env.name);
+                        }) })
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: () => setDevelopmentEnvironmentConfirm({ action: "create" }),
+                        label: "+ Create New",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    ) })
+                  ]
+                }
+              ),
               /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("div", { style: { height: 18 } }),
               /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
                 "div",
@@ -22483,6 +22689,117 @@ function EditEnvironmentModal({
         )
       }
     ),
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+      ModalComponent,
+      {
+        isOpen: developmentEnvironmentConfirm != null,
+        onClose: () => {
+          if (isDevelopmentEnvironmentConfirmLoading) return;
+          setDevelopmentEnvironmentConfirm(null);
+        },
+        style: {
+          width: 480
+        },
+        children: /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              gap: 20,
+              width: "100%",
+              padding: 24
+            },
+            children: [
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(CardSection, { children: developmentEnvironmentConfirm?.action === "promote" ? "Promote Environment Changes" : "Create child environment" }),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 12,
+                    fontFamily: state.theme.fontFamily,
+                    fontSize: 14,
+                    lineHeight: 1.6,
+                    color: state.theme.primaryTextColor
+                  },
+                  children: [
+                    developmentEnvironmentConfirm?.action === "promote" ? /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("p", { style: { margin: 0 }, children: [
+                      "Promoting",
+                      " ",
+                      /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("strong", { children: [
+                        developmentEnvironmentConfirm.environment?.name ?? "this environment",
+                        "\xA0into\xA0",
+                        sourceEnvironmentName ?? "the current environment"
+                      ] }),
+                      " ",
+                      "will replicate the development environment's state into the current environment."
+                    ] }) : /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("p", { style: { margin: 0 }, children: [
+                      "Creating a child development environment for",
+                      " ",
+                      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("strong", { children: sourceEnvironmentName ?? "the current environment" }),
+                      " ",
+                      "will create an environment you can use to preview changes before promoting them into the currently active environment."
+                    ] }),
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      "p",
+                      {
+                        style: {
+                          margin: 0,
+                          padding: "12px 14px",
+                          borderRadius: 6,
+                          border: `1px solid ${state.theme.borderColor ?? "#e7e7e7"}`,
+                          backgroundColor: state.theme.hoverBackgroundColor ?? "#f7f7f7",
+                          color: "#DC2626"
+                        },
+                        children: "This is not a sandbox operation and will immediately apply to the live environment. Your current active session will be discarded."
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "row",
+                    justifyContent: "flex-end",
+                    gap: 16,
+                    width: "100%"
+                  },
+                  children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      SecondaryButtonComponent,
+                      {
+                        label: "Cancel",
+                        onClick: () => setDevelopmentEnvironmentConfirm(null),
+                        disabled: isDevelopmentEnvironmentConfirmLoading
+                      }
+                    ),
+                    /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+                      ButtonComponent,
+                      {
+                        label: "Confirm",
+                        onClick: () => {
+                          if (developmentEnvironmentConfirm?.action === "promote") {
+                            handlePromoteChildEnvironment();
+                          } else if (developmentEnvironmentConfirm?.action === "create") {
+                            handleCreateChildEnvironment();
+                          }
+                        },
+                        disabled: isDevelopmentEnvironmentConfirmLoading
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
     /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
       ModalComponent,
       {
@@ -23153,7 +23470,8 @@ function SavedQueriesModal({
   ) });
 }
 function SavedQueryTile({ report }) {
-  const { state, dispatch, getToken } = useAdmin();
+  const { state, dispatch, getToken, eventTracking } = useAdmin();
+  const { reload } = (0, import_react56.useDashboardInternal)(SAVED_QUERIES_DASHBOARD);
   (0, import_react55.useEffect)(() => {
     async function getIsOpenableByReportBuilder() {
       const hello = await parseQuillReportToQuillReportInternal(
@@ -23178,6 +23496,14 @@ function SavedQueryTile({ report }) {
       payload: report?.queryString
     });
   };
+  const handleDelete = async () => {
+    if (await deleteReport(report.id, state, getToken, eventTracking)) {
+      reload(SAVED_QUERIES_DASHBOARD, true, {
+        report: { id: report.id },
+        action: "delete"
+      });
+    }
+  };
   if (!report.queryString) {
     return null;
   }
@@ -23211,7 +23537,8 @@ function SavedQueryTile({ report }) {
             label: "Open in SQL Editor \u2197",
             onClick: handleOpenReportInSQLEditor
           }
-        )
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(SecondaryButtonPrimitive_default, { label: "Delete", onClick: handleDelete })
       ]
     }
   );

package/dist/index.d.cts

@@ -180,6 +180,7 @@ interface BasePivot {
     triggerButtonText?: string;
     rowLimit?: number;
     columnValues?: string[];
+    dateBucket?: 'day' | 'week' | 'month' | 'year';
 }
 interface SingleAggregationPivot extends BasePivot {
     aggregationType: AggregationType;

package/dist/index.d.ts

@@ -180,6 +180,7 @@ interface BasePivot {
     triggerButtonText?: string;
     rowLimit?: number;
     columnValues?: string[];
+    dateBucket?: 'day' | 'week' | 'month' | 'year';
 }
 interface SingleAggregationPivot extends BasePivot {
     aggregationType: AggregationType;

package/dist/index.js

@@ -9505,7 +9505,7 @@ async function getClientTenantIds({
 // src/public_components/DashboardManager.tsx
 import { useCallback as useCallback10, useEffect as useEffect33, useRef as useRef25, useState as useState37 } from "react";
 import {
-  useDashboardInternal as useDashboardInternal5,
+  useDashboardInternal as useDashboardInternal6,
   useDashboards as useDashboards5
 } from "@quillsql/react";
 
@@ -21599,6 +21599,7 @@ function EditEnvironmentModal({
     state,
     dispatch,
     refreshClientsList,
+    setClient,
     getToken,
     quillFetchWithToken,
     eventTracking
@@ -21610,6 +21611,12 @@ function EditEnvironmentModal({
   const [isSubmitTenantLoading, setSubmitTenantLoading] = useState28(false);
   const [isSaveEnvironmentLoading, setIsSaveEnvironmentLoading] = useState28(false);
   const [isDeleteEnvironmentLoading, setIsDeleteEnvironmentLoading] = useState28(false);
+  const [isCreateChildEnvironmentLoading, setIsCreateChildEnvironmentLoading] = useState28(false);
+  const [
+    isPromoteChildEnvironmentLoading,
+    setIsPromoteChildEnvironmentLoading
+  ] = useState28(false);
+  const [developmentEnvironmentConfirm, setDevelopmentEnvironmentConfirm] = useState28(null);
   const [validationError, setValidationError] = useState28(
     void 0
   );
@@ -21617,6 +21624,26 @@ function EditEnvironmentModal({
   const connectionDetails = useMemo14(() => {
     return getDatabaseConnectionFormat(state.client?.databaseType || "");
   }, [state.client?.databaseType]);
+  const sourceClientId = useMemo14(() => {
+    if (state.sandboxParentClientId != null) {
+      return String(state.sandboxParentClientId);
+    }
+    return clientRecordId(state.client);
+  }, [state.sandboxParentClientId, state.client]);
+  const relatedChildEnvironments = useMemo14(() => {
+    const parentClientId = state.client?.sandboxParentClientId != null ? String(state.client.sandboxParentClientId) : sourceClientId;
+    if (!parentClientId) return [];
+    return state.clients.filter(
+      (c2) => c2.sandboxParentClientId != null && String(c2.sandboxParentClientId) === parentClientId
+    );
+  }, [state.clients, state.client?.sandboxParentClientId, sourceClientId]);
+  const sourceEnvironmentName = useMemo14(() => {
+    if (!sourceClientId) return state.client?.name;
+    const sourceClient = state.clients.find(
+      (c2) => clientRecordId(c2) === sourceClientId
+    );
+    return sourceClient?.name ?? state.client?.name;
+  }, [sourceClientId, state.clients, state.client?.name]);
   const [tenantToEdit, setTenantToEdit] = useState28(
     void 0
   );
@@ -22015,6 +22042,104 @@ function EditEnvironmentModal({
       setFetchSchemasLoading(false);
     }
   };
+  const handleCreateChildEnvironment = async () => {
+    if (!sourceClientId) return;
+    setDevelopmentEnvironmentConfirm(null);
+    setIsCreateChildEnvironmentLoading(true);
+    try {
+      const response = await quillFetchWithToken({
+        client: {
+          queryEndpoint: state.queryEndpoint,
+          clientId: sourceClientId,
+          withCredentials: !!state.withCredentials,
+          queryHeaders: state.queryHeaders
+        },
+        task: "create-sandbox",
+        metadata: {
+          clientId: sourceClientId,
+          permanentSandbox: true
+        },
+        adminMode: true
+      });
+      if (response.status === "error") {
+        throw new Error(response.error);
+      }
+      await refreshClientsList(sourceClientId);
+    } catch (e2) {
+      eventTracking?.logError?.({
+        type: "bug",
+        // TODO: determine type
+        severity: "high",
+        message: "Error creating child environment",
+        errorMessage: e2.message,
+        errorStack: e2.stack,
+        errorData: {
+          caller: "EditEnvironmentModal",
+          function: "handleCreateChildEnvironment"
+        }
+      });
+      setValidationError(e2.message);
+    } finally {
+      setIsCreateChildEnvironmentLoading(false);
+    }
+  };
+  const handlePromoteChildEnvironment = async () => {
+    if (developmentEnvironmentConfirm?.action !== "promote") return;
+    const childEnvironmentToPromote = developmentEnvironmentConfirm.environment;
+    const promoteClientId = clientRecordId(childEnvironmentToPromote);
+    if (!promoteClientId) {
+      setValidationError("Cannot promote: missing target environment id.");
+      return;
+    }
+    setDevelopmentEnvironmentConfirm(null);
+    setIsPromoteChildEnvironmentLoading(true);
+    try {
+      const response = await quillFetchWithToken({
+        client: {
+          queryEndpoint: state.queryEndpoint,
+          clientId: promoteClientId,
+          withCredentials: !!state.withCredentials,
+          queryHeaders: state.queryHeaders
+        },
+        task: "promote",
+        metadata: {
+          clientId: promoteClientId,
+          forcePromote: true
+        },
+        adminMode: true
+      });
+      if (response.status === "error" || response.error) {
+        throw new Error(response.error);
+      }
+      const hasActiveSandbox = state.sandboxSessionId != null || state.sandboxClientId != null;
+      if (hasActiveSandbox && sourceClientId) {
+        setClient(
+          { clientId: sourceClientId },
+          true,
+          true,
+          true
+        );
+      }
+      await refreshClientsList(sourceClientId);
+      setIsOpen(false);
+    } catch (e2) {
+      eventTracking?.logError?.({
+        type: "bug",
+        // TODO: determine type
+        severity: "high",
+        message: "Error promoting child environment",
+        errorMessage: e2.message,
+        errorStack: e2.stack,
+        errorData: {
+          caller: "EditEnvironmentModal",
+          function: "handlePromoteChildEnvironment"
+        }
+      });
+      setValidationError(e2.message);
+    } finally {
+      setIsPromoteChildEnvironmentLoading(false);
+    }
+  };
   const handleDeleteEnvironment = async () => {
     if (state.clients.length === 1) {
       alert("You cannot delete the only environment");
@@ -22061,8 +22186,9 @@ function EditEnvironmentModal({
       }
     }
   };
-  const isEnvironmentModalLoading = isDeleteEnvironmentLoading || isSaveEnvironmentLoading;
-  const environmentLoadingLabel = isDeleteEnvironmentLoading ? "Deleting environment..." : "Saving environment...";
+  const isEnvironmentModalLoading = isDeleteEnvironmentLoading || isSaveEnvironmentLoading || isCreateChildEnvironmentLoading || isPromoteChildEnvironmentLoading;
+  const environmentLoadingLabel = isDeleteEnvironmentLoading ? "Deleting environment..." : isCreateChildEnvironmentLoading ? "Creating child environment..." : isPromoteChildEnvironmentLoading ? "Promoting environment..." : "Saving environment...";
+  const isDevelopmentEnvironmentConfirmLoading = developmentEnvironmentConfirm?.action === "promote" ? isPromoteChildEnvironmentLoading : isCreateChildEnvironmentLoading;
   return /* @__PURE__ */ jsxs37(Fragment13, { children: [
     /* @__PURE__ */ jsx52(
       ModalComponent,
@@ -22075,6 +22201,9 @@ function EditEnvironmentModal({
           setSelectedEnvironmentName(state.client.name);
           setIsSaveEnvironmentLoading(false);
           setIsDeleteEnvironmentLoading(false);
+          setIsCreateChildEnvironmentLoading(false);
+          setIsPromoteChildEnvironmentLoading(false);
+          setDevelopmentEnvironmentConfirm(null);
         },
         style: {
           minWidth: "600px"
@@ -22245,38 +22374,115 @@ function EditEnvironmentModal({
                   disabled: isEnvironmentModalLoading
                 }
               ) }),
-              /* @__PURE__ */ jsxs37(Fragment13, { children: [
-                /* @__PURE__ */ jsx52(CardSection, { children: "Danger Zone" }),
-                /* @__PURE__ */ jsxs37(
-                  "div",
-                  {
-                    style: {
-                      display: "flex",
-                      flexDirection: "column",
-                      width: "fit-content",
-                      gap: 16
-                    },
-                    children: [
-                      /* @__PURE__ */ jsx52(
-                        SecondaryButtonComponent,
-                        {
-                          onClick: () => setIsConnectDatabaseModalOpen(true),
-                          label: "Edit Database Connection",
-                          disabled: isEnvironmentModalLoading
-                        }
-                      ),
-                      /* @__PURE__ */ jsx52(
-                        SecondaryButtonComponent,
-                        {
-                          onClick: handleDeleteEnvironment,
-                          label: "Delete Environment",
-                          disabled: isEnvironmentModalLoading
-                        }
-                      )
-                    ]
-                  }
-                )
-              ] }),
+              /* @__PURE__ */ jsx52(CardSection, { children: "Danger Zone" }),
+              /* @__PURE__ */ jsxs37(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    width: "fit-content",
+                    gap: 16
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx52(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: () => setIsConnectDatabaseModalOpen(true),
+                        label: "Edit Database Connection",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    ),
+                    /* @__PURE__ */ jsx52(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: handleDeleteEnvironment,
+                        label: "Delete Environment",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsx52(CardSection, { children: "Development Environments" }),
+              /* @__PURE__ */ jsxs37(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    width: "fit-content",
+                    gap: 16
+                  },
+                  children: [
+                    relatedChildEnvironments.length > 0 && /* @__PURE__ */ jsx52(
+                      "table",
+                      {
+                        style: {
+                          borderCollapse: "collapse",
+                          width: "100%",
+                          minWidth: 280,
+                          fontFamily: state.theme.fontFamily,
+                          fontSize: 14,
+                          color: state.theme.primaryTextColor
+                        },
+                        children: /* @__PURE__ */ jsx52("tbody", { children: relatedChildEnvironments.map((env) => {
+                          const envId = clientRecordId(env);
+                          const cellBorder = `1px solid ${state.theme.borderColor ?? "#e7e7e7"}`;
+                          return /* @__PURE__ */ jsxs37("tr", { children: [
+                            /* @__PURE__ */ jsx52(
+                              "td",
+                              {
+                                style: {
+                                  border: cellBorder,
+                                  padding: "8px 12px",
+                                  fontWeight: 500
+                                },
+                                children: env.name
+                              }
+                            ),
+                            /* @__PURE__ */ jsx52(
+                              "td",
+                              {
+                                style: {
+                                  border: cellBorder,
+                                  padding: "8px 12px",
+                                  width: 1,
+                                  whiteSpace: "nowrap"
+                                },
+                                children: /* @__PURE__ */ jsx52(
+                                  ButtonComponent,
+                                  {
+                                    label: "Promote",
+                                    onClick: () => setDevelopmentEnvironmentConfirm({
+                                      action: "promote",
+                                      environment: env
+                                    }),
+                                    disabled: isEnvironmentModalLoading || developmentEnvironmentConfirm != null,
+                                    style: {
+                                      height: 32,
+                                      paddingLeft: 12,
+                                      paddingRight: 12
+                                    }
+                                  }
+                                )
+                              }
+                            )
+                          ] }, envId ?? env.name);
+                        }) })
+                      }
+                    ),
+                    /* @__PURE__ */ jsx52("div", { children: /* @__PURE__ */ jsx52(
+                      SecondaryButtonComponent,
+                      {
+                        onClick: () => setDevelopmentEnvironmentConfirm({ action: "create" }),
+                        label: "+ Create New",
+                        disabled: isEnvironmentModalLoading
+                      }
+                    ) })
+                  ]
+                }
+              ),
               /* @__PURE__ */ jsx52("div", { style: { height: 18 } }),
               /* @__PURE__ */ jsxs37(
                 "div",
@@ -22515,6 +22721,117 @@ function EditEnvironmentModal({
         )
       }
     ),
+    /* @__PURE__ */ jsx52(
+      ModalComponent,
+      {
+        isOpen: developmentEnvironmentConfirm != null,
+        onClose: () => {
+          if (isDevelopmentEnvironmentConfirmLoading) return;
+          setDevelopmentEnvironmentConfirm(null);
+        },
+        style: {
+          width: 480
+        },
+        children: /* @__PURE__ */ jsxs37(
+          "div",
+          {
+            style: {
+              display: "flex",
+              flexDirection: "column",
+              gap: 20,
+              width: "100%",
+              padding: 24
+            },
+            children: [
+              /* @__PURE__ */ jsx52(CardSection, { children: developmentEnvironmentConfirm?.action === "promote" ? "Promote Environment Changes" : "Create child environment" }),
+              /* @__PURE__ */ jsxs37(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "column",
+                    gap: 12,
+                    fontFamily: state.theme.fontFamily,
+                    fontSize: 14,
+                    lineHeight: 1.6,
+                    color: state.theme.primaryTextColor
+                  },
+                  children: [
+                    developmentEnvironmentConfirm?.action === "promote" ? /* @__PURE__ */ jsxs37("p", { style: { margin: 0 }, children: [
+                      "Promoting",
+                      " ",
+                      /* @__PURE__ */ jsxs37("strong", { children: [
+                        developmentEnvironmentConfirm.environment?.name ?? "this environment",
+                        "\xA0into\xA0",
+                        sourceEnvironmentName ?? "the current environment"
+                      ] }),
+                      " ",
+                      "will replicate the development environment's state into the current environment."
+                    ] }) : /* @__PURE__ */ jsxs37("p", { style: { margin: 0 }, children: [
+                      "Creating a child development environment for",
+                      " ",
+                      /* @__PURE__ */ jsx52("strong", { children: sourceEnvironmentName ?? "the current environment" }),
+                      " ",
+                      "will create an environment you can use to preview changes before promoting them into the currently active environment."
+                    ] }),
+                    /* @__PURE__ */ jsx52(
+                      "p",
+                      {
+                        style: {
+                          margin: 0,
+                          padding: "12px 14px",
+                          borderRadius: 6,
+                          border: `1px solid ${state.theme.borderColor ?? "#e7e7e7"}`,
+                          backgroundColor: state.theme.hoverBackgroundColor ?? "#f7f7f7",
+                          color: "#DC2626"
+                        },
+                        children: "This is not a sandbox operation and will immediately apply to the live environment. Your current active session will be discarded."
+                      }
+                    )
+                  ]
+                }
+              ),
+              /* @__PURE__ */ jsxs37(
+                "div",
+                {
+                  style: {
+                    display: "flex",
+                    flexDirection: "row",
+                    justifyContent: "flex-end",
+                    gap: 16,
+                    width: "100%"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsx52(
+                      SecondaryButtonComponent,
+                      {
+                        label: "Cancel",
+                        onClick: () => setDevelopmentEnvironmentConfirm(null),
+                        disabled: isDevelopmentEnvironmentConfirmLoading
+                      }
+                    ),
+                    /* @__PURE__ */ jsx52(
+                      ButtonComponent,
+                      {
+                        label: "Confirm",
+                        onClick: () => {
+                          if (developmentEnvironmentConfirm?.action === "promote") {
+                            handlePromoteChildEnvironment();
+                          } else if (developmentEnvironmentConfirm?.action === "create") {
+                            handleCreateChildEnvironment();
+                          }
+                        },
+                        disabled: isDevelopmentEnvironmentConfirmLoading
+                      }
+                    )
+                  ]
+                }
+              )
+            ]
+          }
+        )
+      }
+    ),
     /* @__PURE__ */ jsx52(
       ModalComponent,
       {
@@ -23086,7 +23403,7 @@ function ReportCodeDetail({
 
 // src/modals/SavedQueriesModal.tsx
 import { useCallback as useCallback8, useEffect as useEffect29, useMemo as useMemo16, useRef as useRef20, useState as useState31 } from "react";
-import { DashboardLegacy as DashboardLegacy2 } from "@quillsql/react";
+import { DashboardLegacy as DashboardLegacy2, useDashboardInternal as useDashboardInternal4 } from "@quillsql/react";
 import { Highlight as Highlight4, themes as themes4 } from "prism-react-renderer";
 import { jsx as jsx55, jsxs as jsxs40 } from "react/jsx-runtime";
 import { createElement as createElement4 } from "react";
@@ -23192,7 +23509,8 @@ function SavedQueriesModal({
   ) });
 }
 function SavedQueryTile({ report }) {
-  const { state, dispatch, getToken } = useAdmin();
+  const { state, dispatch, getToken, eventTracking } = useAdmin();
+  const { reload } = useDashboardInternal4(SAVED_QUERIES_DASHBOARD);
   useEffect29(() => {
     async function getIsOpenableByReportBuilder() {
       const hello = await parseQuillReportToQuillReportInternal(
@@ -23217,6 +23535,14 @@ function SavedQueryTile({ report }) {
       payload: report?.queryString
     });
   };
+  const handleDelete = async () => {
+    if (await deleteReport(report.id, state, getToken, eventTracking)) {
+      reload(SAVED_QUERIES_DASHBOARD, true, {
+        report: { id: report.id },
+        action: "delete"
+      });
+    }
+  };
   if (!report.queryString) {
     return null;
   }
@@ -23250,7 +23576,8 @@ function SavedQueryTile({ report }) {
             label: "Open in SQL Editor \u2197",
             onClick: handleOpenReportInSQLEditor
           }
-        )
+        ),
+        /* @__PURE__ */ jsx55(SecondaryButtonPrimitive_default, { label: "Delete", onClick: handleDelete })
       ]
     }
   );
@@ -23322,7 +23649,7 @@ import {
 } from "react";
 import {
   Chart as Chart2,
-  useDashboardInternal as useDashboardInternal4,
+  useDashboardInternal as useDashboardInternal5,
   useAllReports
 } from "@quillsql/react";
 import equal2 from "fast-deep-equal";
@@ -24074,7 +24401,7 @@ var InternalDashboard = ({
     dashboardFilters: populatedDashboardFilters,
     reload,
     setSectionOrder
-  } = useDashboardInternal4(
+  } = useDashboardInternal5(
     name,
     filters?.map((f) => convertCustomFilter(f)) ?? []
     // .concat(
@@ -29149,7 +29476,7 @@ function DashboardManager({
     },
     [dispatch]
   );
-  const { data: dashboardConfig, reload: reloadDashboard } = useDashboardInternal5(state.selectedDashboard, userFilters);
+  const { data: dashboardConfig, reload: reloadDashboard } = useDashboardInternal6(state.selectedDashboard, userFilters);
   const { dashboards, isLoading: dashboardsLoading } = useDashboards5();
   useLongLoading(dashboardsLoading, {
     origin: "DashboardManager",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@quillsql/admin",
-  "version": "1.8.8",
+  "version": "1.8.9",
   "description": "Admin tools for Quill",
   "type": "module",
   "exports": {