@postgres.ai/shared 4.0.2-pr-1149.1 → 4.0.2-pr-1200

package/pages/Instance/Configuration/useForm.js

@@ -4,14 +4,64 @@
  * Unauthorized copying of this file, via any medium is strictly prohibited
  *--------------------------------------------------------------------------
  */
+import { useMemo, useState } from 'react';
 import { useFormik } from 'formik';
 import * as Yup from 'yup';
+import { ConnectionStringError, connectionStringFromFields, connectionStringToFields, } from './connectionString';
+// Logical-mode required fields. Validation skips the source-connection block
+// when retrievalMode is "physical" — that branch uses tool-specific inputs
+// instead of a connection URL.
 const Schema = Yup.object().shape({
     dockerImage: Yup.string().required('Docker image is required'),
-    dbname: Yup.string().required('Dbname is required'),
-    host: Yup.string().required('Host is required'),
-    port: Yup.string().required('Port is required'),
-    username: Yup.string().required('Username is required'),
+    dbname: Yup.string().when('retrievalMode', {
+        is: 'logical',
+        then: (s) => s.required('Dbname is required'),
+    }),
+    host: Yup.string().when('retrievalMode', {
+        is: 'logical',
+        then: (s) => s.required('Host is required'),
+    }),
+    port: Yup.string().when('retrievalMode', {
+        is: 'logical',
+        then: (s) => s.required('Port is required'),
+    }),
+    username: Yup.string().when('retrievalMode', {
+        is: 'logical',
+        then: (s) => s.required('Username is required'),
+    }),
+    physicalEnvs: Yup.array()
+        .of(Yup.object().shape({
+        key: Yup.string(),
+        value: Yup.string(),
+    }))
+        .test('unique-keys', '', function (envs) {
+        if (!envs)
+            return true;
+        const positions = new Map();
+        envs.forEach((row, i) => {
+            var _a, _b;
+            const trimmed = ((_a = row === null || row === void 0 ? void 0 : row.key) !== null && _a !== void 0 ? _a : '').trim();
+            if (!trimmed)
+                return;
+            const list = (_b = positions.get(trimmed)) !== null && _b !== void 0 ? _b : [];
+            list.push(i);
+            positions.set(trimmed, list);
+        });
+        const dupes = [];
+        for (const indices of positions.values()) {
+            if (indices.length < 2)
+                continue;
+            for (const i of indices) {
+                dupes.push(this.createError({
+                    path: `${this.path}[${i}].key`,
+                    message: 'Duplicate key',
+                }));
+            }
+        }
+        if (dupes.length === 0)
+            return true;
+        return new Yup.ValidationError(dupes);
+    }),
 });
 export const useForm = (onSubmit) => {
     const formik = useFormik({
@@ -38,12 +88,71 @@ export const useForm = (onSubmit) => {
             pgRestoreCustomOptions: '',
             dumpIgnoreErrors: false,
             restoreIgnoreErrors: false,
+            retrievalMode: 'logical',
+            physicalTool: '',
+            physicalDockerImage: '',
+            physicalSyncEnabled: false,
+            physicalWalgBackupName: '',
+            physicalPgbackrestStanza: '',
+            physicalPgbackrestDelta: false,
+            physicalEnvs: [],
         },
         validationSchema: Schema,
         onSubmit,
         validateOnBlur: false,
         validateOnChange: false,
     });
+    const [originalPortWasUnset, setOriginalPortWasUnset] = useState(false);
+    const [portDirty, setPortDirty] = useState(false);
+    const [connectionStringError, setConnectionStringError] = useState(null);
+    const connectionString = useMemo(() => connectionStringFromFields({
+        host: formik.values.host,
+        port: formik.values.port || '5432',
+        username: formik.values.username,
+        dbname: formik.values.dbname,
+    }, { omitDefaultPort: originalPortWasUnset && !portDirty }), [
+        formik.values.host,
+        formik.values.port,
+        formik.values.username,
+        formik.values.dbname,
+        originalPortWasUnset,
+        portDirty,
+    ]);
+    const onConnectionStringChange = (s) => {
+        if (!s.trim()) {
+            setConnectionStringError(null);
+            formik.setValues({
+                ...formik.values,
+                host: '',
+                port: '',
+                username: '',
+                dbname: '',
+            });
+            return;
+        }
+        try {
+            const parsed = connectionStringToFields(s);
+            setConnectionStringError(null);
+            if (parsed.portWasExplicit)
+                setPortDirty(true);
+            formik.setValues({
+                ...formik.values,
+                host: parsed.fields.host,
+                port: parsed.fields.port,
+                username: parsed.fields.username,
+                dbname: parsed.fields.dbname,
+            });
+        }
+        catch (err) {
+            if (err instanceof ConnectionStringError)
+                setConnectionStringError(err.message);
+            else
+                throw err;
+        }
+    };
+    const markPortInitialState = (wasUnset) => setOriginalPortWasUnset(wasUnset);
+    const markPortDirty = () => setPortDirty(true);
+    const omitPortOnSubmit = originalPortWasUnset && !portDirty;
     const formatDatabaseArray = (database) => {
         let databases = [];
         const splitDatabaseArray = database.split(/[,(\s)(\n)(\r)(\t)(\r\n)]/);
@@ -71,5 +180,17 @@ export const useForm = (onSubmit) => {
         formik.values.port &&
         formik.values.username &&
         formik.values.dbname;
-    return [{ formik, connectionData, isConnectionDataValid }];
+    return [
+        {
+            formik,
+            connectionData,
+            isConnectionDataValid,
+            connectionString,
+            connectionStringError,
+            onConnectionStringChange,
+            markPortInitialState,
+            markPortDirty,
+            omitPortOnSubmit,
+        },
+    ];
 };

package/pages/Instance/Configuration/utils/index.js

@@ -1,22 +1,6 @@
 import { dockerImageOptions } from '../configOptions';
+import { dockerImagesConfig, genericImagePrefix } from '../dockerCatalog';
 const seContainerRegistry = 'se-images';
-const genericImagePrefix = 'postgresai/extended-postgres';
-// Predefined list of Docker images for UI display
-// This list is shown to users for convenient selection
-// IMPORTANT: if user specified an image in config that's not in this list,
-// it will be automatically added via createEnhancedDockerImages()
-const dockerImagesConfig = {
-    '9.6': ['0.5.3', '0.5.2', '0.5.1'],
-    '10': ['0.5.3', '0.5.2', '0.5.1'],
-    '11': ['0.5.3', '0.5.2', '0.5.1'],
-    '12': ['0.5.3', '0.5.2', '0.5.1'],
-    '13': ['0.5.3', '0.5.2', '0.5.1'],
-    '14': ['0.5.3', '0.5.2', '0.5.1'],
-    '15': ['0.5.3', '0.5.2', '0.5.1'],
-    '16': ['0.5.3', '0.5.2', '0.5.1'],
-    '17': ['0.5.3', '0.5.2', '0.5.1'],
-    '18': ['0.6.1'],
-};
 export const uniqueChipValue = (values) => {
     const splitChipArray = values.split(/[,(\s)(\n)(\r)(\t)(\r\n)]/);
     let databaseArray = [];

package/pages/Instance/Info/Snapshots/Calendar/Day/index.js

@@ -16,7 +16,7 @@ const useStyles = makeStyles({
         position: 'relative',
         cursor: 'default',
         flex: `0 0 ${CELL_SIZE}px`,
-        background: '#f4f4f4',
+        background: 'rgba(128, 128, 128, 0.1)',
         height: `${CELL_SIZE}px`,
         display: 'flex',
         borderRadius: `${CELL_SIZE / 2}px`,
@@ -26,7 +26,7 @@ const useStyles = makeStyles({
         fontSize: '12px',
     },
     rootHasSnapshots: {
-        background: colors.secondary2.lightLight,
+        background: 'rgba(15, 135, 157, 0.32)',
         cursor: 'pointer',
     },
     rootCurrent: {
@@ -41,7 +41,7 @@ const useStyles = makeStyles({
         right: '-6px',
         position: 'absolute',
         fontSize: '8px',
-        backgroundColor: colors.white,
+        backgroundColor: 'inherit',
         border: `1px solid ${colors.secondary2.lightLight}`,
         borderRadius: '8px',
         height: '16px',

package/pages/Instance/Info/Snapshots/Calendar/utils.d.ts

@@ -17,6 +17,9 @@ export declare const getCalendar: (monthStartDate: Date, snapshots: Snapshot[])
             logicalSize: number;
             message: string;
             branch: string;
+            protected: boolean;
+            protectedTill?: string | undefined;
+            deleteAt?: string | undefined;
         }[];
         isBreak: boolean;
         isDisabled: boolean;

package/pages/Instance/Info/Snapshots/utils.d.ts

@@ -16,6 +16,9 @@ export declare const getEdgeSnapshots: (snapshots: Snapshot[]) => {
         logicalSize: number;
         message: string;
         branch: string;
+        protected: boolean;
+        protectedTill?: string | undefined;
+        deleteAt?: string | undefined;
     };
     lastSnapshot: {
         createdAtDate: Date;
@@ -30,5 +33,8 @@ export declare const getEdgeSnapshots: (snapshots: Snapshot[]) => {
         logicalSize: number;
         message: string;
         branch: string;
+        protected: boolean;
+        protectedTill?: string | undefined;
+        deleteAt?: string | undefined;
     };
 };

package/pages/Instance/Snapshots/components/SnapshotsList/index.js

@@ -41,6 +41,16 @@ const useStyles = makeStyles({
     header: {
         fontWeight: 500,
     },
+    protectedBadge: {
+        marginLeft: '8px',
+        padding: '1px 6px',
+        fontSize: '11px',
+        fontWeight: 400,
+        color: '#1a7f37',
+        border: '1px solid #1a7f37',
+        borderRadius: '4px',
+        whiteSpace: 'nowrap',
+    },
     infoContent: {
         fontSize: '12px',
         color: '#808080',
@@ -113,7 +123,7 @@ const SnapshotListItem = ({ snapshot, setSnapshotModal, openClonesModal, }) => {
     const timeAgo = formatDistanceSafe(snapshot.createdAtDate);
     const history = useHistory();
     const host = useHost();
-    return (_jsx("div", { className: classes.commitItem, children: _jsxs("div", { className: classes.gridContainer, children: [_jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: snapshot.message || '-' }), _jsx("div", { className: classes.infoContent, title: snapshot.dataStateAt, children: timeAgo })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Pool" }), _jsx("div", { className: classes.infoContent, children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Number of clones" }), _jsx("div", { className: classes.infoContent, children: (_b = snapshot.numClones) !== null && _b !== void 0 ? _b : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Logical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.logicalSize ? formatBytesIEC(snapshot.logicalSize) : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Physical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.physicalSize
+    return (_jsx("div", { className: classes.commitItem, children: _jsxs("div", { className: classes.gridContainer, children: [_jsxs("div", { className: classes.infoBlock, children: [_jsxs("div", { className: classes.header, children: [snapshot.message || '-', snapshot.protected && (_jsx("span", { className: classes.protectedBadge, title: "Protected from deletion", children: "Protected" }))] }), _jsx("div", { className: classes.infoContent, title: snapshot.dataStateAt, children: timeAgo })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Pool" }), _jsx("div", { className: classes.infoContent, children: (_a = snapshot.pool) !== null && _a !== void 0 ? _a : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Number of clones" }), _jsx("div", { className: classes.infoContent, children: (_b = snapshot.numClones) !== null && _b !== void 0 ? _b : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Logical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.logicalSize ? formatBytesIEC(snapshot.logicalSize) : '-' })] }), _jsxs("div", { className: classes.infoBlock, children: [_jsx("div", { className: classes.header, children: "Physical Size" }), _jsx("div", { className: classes.infoContent, children: snapshot.physicalSize
                                 ? formatBytesIEC(snapshot.physicalSize)
                                 : '-' })] }), _jsxs("div", { className: classes.actionsContainer, onClick: (e) => e.stopPropagation(), children: [_jsx("div", { className: classes.snapshotId, children: snapshot.id }), _jsx("div", { className: classes.copyButtonContainer, title: "Copy snapshot ID", children: _jsx(IconButton, { className: classes.copyButton, onClick: (e) => {
                                     e.stopPropagation();

package/pages/Instance/Snapshots/index.js

@@ -37,6 +37,9 @@ const useStyles = makeStyles({
         transform: 'translate(-50%, -50%)',
     },
 }, { index: 1 });
+// listRefreshIntervalMs is how often the snapshot list is silently refreshed so background
+// auto-deletion does not leave stale rows in the list.
+const listRefreshIntervalMs = 30000;
 export const Snapshots = observer(({ instanceId }) => {
     var _a;
     const host = useHost();
@@ -80,9 +83,14 @@ export const Snapshots = observer(({ instanceId }) => {
         fetchInitialData();
     }, []);
     useEffect(() => {
-        if (selectedBranch) {
-            stores.main.reloadSnapshots(selectedBranch === 'All branches' ? '' : selectedBranch);
-        }
+        if (!selectedBranch)
+            return;
+        const branchName = selectedBranch === 'All branches' ? '' : selectedBranch;
+        stores.main.reloadSnapshots(branchName);
+        const intervalId = setInterval(() => {
+            stores.main.reloadSnapshots(branchName, true);
+        }, listRefreshIntervalMs);
+        return () => clearInterval(intervalId);
     }, [selectedBranch]);
     if (!instance && !snapshots.isLoading)
         return _jsx(_Fragment, {});

package/pages/Instance/Snapshots/utils/index.d.ts

@@ -13,4 +13,7 @@ export declare const groupSnapshotsByCreatedAtDate: (snapshots: Snapshot[]) => {
     logicalSize: number;
     message: string;
     branch: string;
+    protected: boolean;
+    protectedTill?: string | undefined;
+    deleteAt?: string | undefined;
 }[][];

package/pages/Instance/Tabs/styles.js

@@ -1,6 +1,5 @@
 import { makeStyles } from '@material-ui/core';
-import { colors } from '@postgres.ai/shared/styles/colors';
-export const useTabsStyles = makeStyles({
+export const useTabsStyles = makeStyles((theme) => ({
     tabsRoot: {
         minHeight: 0,
         marginTop: '-8px',
@@ -21,7 +20,7 @@ export const useTabsStyles = makeStyles({
             height: '18px',
         },
         '& a': {
-            color: colors.black,
+            color: theme.palette.text.primary,
             textDecoration: 'none',
             '@media (max-width: 700px)': {
                 display: 'flex',
@@ -39,18 +38,19 @@ export const useTabsStyles = makeStyles({
         height: '3px',
     },
     tabRoot: {
+        color: theme.palette.text.primary,
         fontWeight: 400,
         minWidth: 0,
         minHeight: 0,
         width: '100%',
         padding: '6px 16px',
-        borderBottom: `3px solid ${colors.consoleStroke}`,
+        borderBottom: `3px solid ${theme.palette.divider}`,
         '& + $tabRoot': {
             marginLeft: '10px',
         },
         '&.Mui-disabled': {
             opacity: 1,
-            color: colors.pgaiDarkGray,
+            color: theme.palette.text.disabled,
         },
         '@media (max-width: 700px)': {
             width: 'max-content',
@@ -59,4 +59,4 @@ export const useTabsStyles = makeStyles({
     tabHidden: {
         display: 'none',
     },
-}, { index: 1 });
+}), { index: 1 });

package/pages/Instance/index.js

@@ -67,7 +67,6 @@ export const Instance = observer((props) => {
     };
     const isInstanceIntegrated = instanceRetrieval ||
         (!isLoadingInstance && !isLoadingInstanceRetrieval && instance && (instance === null || instance === void 0 ? void 0 : instance.url) && !instanceError);
-    const isConfigurationActive = (instanceRetrieval === null || instanceRetrieval === void 0 ? void 0 : instanceRetrieval.mode) !== 'physical';
     useEffect(() => {
         load(instanceId, isPlatform);
     }, [instanceId]);
@@ -79,14 +78,13 @@ export const Instance = observer((props) => {
         var _a, _b;
         if (instance &&
             ((_b = (_a = instance.state) === null || _a === void 0 ? void 0 : _a.retrieving) === null || _b === void 0 ? void 0 : _b.status) === 'pending' &&
-            isConfigurationActive &&
             !hasBeenRedirected) {
             setActiveTab(TABS_INDEX.CONFIGURATION);
             setHasBeenRedirected(true);
         }
     }, [instance, hasBeenRedirected]);
     return (_jsx(HostProvider, { value: props, children: _jsxs(StoresProvider, { value: stores, children: [props.elements.breadcrumbs, _jsx(SectionTitle, { text: props.title, level: 1, tag: "h1", className: classes.title, rightContent: _jsx(Button, { onClick: () => load(props.instanceId, isPlatform), isDisabled: !instance && !instanceError, className: classes.reloadButton, children: "Reload info" }), children: isInstanceIntegrated && (_jsx(InstanceTabs, { instanceId: props.instanceId, tab: activeTab, onTabChange: (tabID) => setActiveTab(tabID), isPlatform: isPlatform, hasLogs: api.initWS !== undefined, hideInstanceTabs: props.hideBranchingFeatures })) }), instanceError && (_jsx(ErrorStub, { ...instanceError, className: classes.errorStub })), isInstanceIntegrated ? (_jsxs(_Fragment, { children: [_jsxs(TabPanel, { value: activeTab, index: TABS_INDEX.OVERVIEW, children: [!instanceError && (_jsx("div", { className: classes.content, children: instance && ((_b = (_a = instance.state) === null || _a === void 0 ? void 0 : _a.retrieving) === null || _b === void 0 ? void 0 : _b.status) ? (_jsxs(_Fragment, { children: [_jsx(Clones, {}), _jsx(Info, { hideBranchingFeatures: props.hideBranchingFeatures })] })) : (_jsx(StubSpinner, {})) })), _jsx(ClonesModal, {}), _jsx(SnapshotsModal, {})] }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.CLONES, children: activeTab === TABS_INDEX.CLONES && (_jsx("div", { className: classes.content, children: !instanceError &&
-                                    (instance ? _jsx(Clones, { onlyRenderList: true }) : _jsx(StubSpinner, {})) })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.LOGS, children: activeTab === TABS_INDEX.LOGS && (_jsx(Logs, { api: api, instanceId: props.instanceId })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.CONFIGURATION, children: activeTab === TABS_INDEX.CONFIGURATION && (_jsx(Configuration, { instanceId: instanceId, switchActiveTab: switchTab, isConfigurationActive: isConfigurationActive, reload: () => load(props.instanceId), disableConfigModification: (_c = instance === null || instance === void 0 ? void 0 : instance.state) === null || _c === void 0 ? void 0 : _c.engine.disableConfigModification })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.SNAPSHOTS, children: activeTab === TABS_INDEX.SNAPSHOTS && (_jsx(Snapshots, { instanceId: instanceId })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.BRANCHES, children: activeTab === TABS_INDEX.BRANCHES && (_jsx(Branches, { instanceId: instanceId })) })] })) : !isLoadingInstance && !isLoadingInstanceRetrieval && !instanceError ? (_jsx(TabPanel, { value: activeTab, index: activeTab, children: _jsx(InactiveInstance, { instance: instance, org: (_d = props.elements.breadcrumbs) === null || _d === void 0 ? void 0 : _d.props.org }) })) : (!instanceError && (_jsx(TabPanel, { value: activeTab, index: activeTab, children: _jsx("div", { className: classes.content, children: _jsx(StubSpinner, {}) }) })))] }) }));
+                                    (instance ? _jsx(Clones, { onlyRenderList: true }) : _jsx(StubSpinner, {})) })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.LOGS, children: activeTab === TABS_INDEX.LOGS && (_jsx(Logs, { api: api, instanceId: props.instanceId })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.CONFIGURATION, children: activeTab === TABS_INDEX.CONFIGURATION && (_jsx(Configuration, { instanceId: instanceId, switchActiveTab: switchTab, reload: () => load(props.instanceId), disableConfigModification: (_c = instance === null || instance === void 0 ? void 0 : instance.state) === null || _c === void 0 ? void 0 : _c.engine.disableConfigModification })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.SNAPSHOTS, children: activeTab === TABS_INDEX.SNAPSHOTS && (_jsx(Snapshots, { instanceId: instanceId })) }), _jsx(TabPanel, { value: activeTab, index: TABS_INDEX.BRANCHES, children: activeTab === TABS_INDEX.BRANCHES && (_jsx(Branches, { instanceId: instanceId })) })] })) : !isLoadingInstance && !isLoadingInstanceRetrieval && !instanceError ? (_jsx(TabPanel, { value: activeTab, index: activeTab, children: _jsx(InactiveInstance, { instance: instance, org: (_d = props.elements.breadcrumbs) === null || _d === void 0 ? void 0 : _d.props.org }) })) : (!instanceError && (_jsx(TabPanel, { value: activeTab, index: activeTab, children: _jsx("div", { className: classes.content, children: _jsx(StubSpinner, {}) }) })))] }) }));
 });
 function TabPanel(props) {
     const { children, value, index, ...other } = props;

package/pages/Instance/stores/Main.d.ts

@@ -5,6 +5,7 @@ import { Config } from '@postgres.ai/shared/types/api/entities/config';
 import { GetConfig } from '@postgres.ai/shared/types/api/endpoints/getConfig';
 import { UpdateConfig } from '@postgres.ai/shared/types/api/endpoints/updateConfig';
 import { TestDbSource } from '@postgres.ai/shared/types/api/endpoints/testDbSource';
+import { ProbeSource } from '@postgres.ai/shared/types/api/endpoints/probeSource';
 import { RefreshInstance } from '@postgres.ai/shared/types/api/endpoints/refreshInstance';
 import { DestroyClone } from '@postgres.ai/shared/types/api/endpoints/destroyClone';
 import { ResetClone } from '@postgres.ai/shared/types/api/endpoints/resetClone';
@@ -35,6 +36,7 @@ export declare type Api = {
     getConfig?: GetConfig;
     updateConfig?: UpdateConfig;
     testDbSource?: TestDbSource;
+    probeSource?: ProbeSource;
     getFullConfig?: GetFullConfig;
     getSeImages?: GetSeImages;
     getEngine?: GetEngine;
@@ -78,7 +80,7 @@ export declare class MainStore {
     get isDisabledInstance(): boolean;
     load: (instanceId: string, isPlatform?: boolean) => void;
     reload: (instanceId: string) => void;
-    reloadSnapshots: (branchName?: string) => Promise<void>;
+    reloadSnapshots: (branchName?: string, silent?: boolean) => Promise<void>;
     reloadInstanceRetrieval: () => Promise<void>;
     private loadInstanceRetrieval;
     private loadInstance;
@@ -104,6 +106,17 @@ export declare class MainStore {
         dockerTag?: string | undefined;
         dockerImageType?: string | undefined;
         debug: boolean | undefined;
+        retrievalMode: import("@postgres.ai/shared/types/api/entities/config").RetrievalMode;
+        physicalTool: string;
+        physicalDockerImage: string;
+        physicalSyncEnabled: boolean;
+        physicalWalgBackupName: string;
+        physicalPgbackrestStanza: string;
+        physicalPgbackrestDelta: boolean;
+        physicalEnvs: {
+            key: string;
+            value: string;
+        }[];
         dockerImage: string | undefined;
     } | null | undefined>;
     updateConfig: (values: Config, instanceId: string) => Promise<Response | null | undefined>;
@@ -127,11 +140,18 @@ export declare class MainStore {
             message: string;
         };
     } | undefined>;
+    probeSource: (values: {
+        url: string;
+        password: string;
+    }) => Promise<{
+        response: import("@postgres.ai/shared/types/api/endpoints/probeSource").ProposedConfig | null;
+        error: import("@postgres.ai/shared/types/api/endpoints/probeSource").ProbeSourceError | null;
+    } | undefined>;
     resetClone: (cloneId: string, snapshotId: string) => Promise<boolean | undefined>;
     destroyClone: (cloneId: string) => Promise<boolean | undefined>;
     private liveUpdateInstance;
     reloadClones: () => Promise<void>;
-    getBranches: (instanceId: string) => Promise<import("@postgres.ai/shared/types/api/endpoints/getBranches").Branch[] | null | undefined>;
+    getBranches: (instanceId: string, silent?: boolean) => Promise<import("@postgres.ai/shared/types/api/endpoints/getBranches").Branch[] | null | undefined>;
     deleteBranch: (branchName: string, instanceId: string) => Promise<{
         response: Response | null;
         error: globalThis.Error | null;

package/pages/Instance/stores/Main.js

@@ -80,10 +80,10 @@ export class MainStore {
                 }
             });
         };
-        this.reloadSnapshots = async (branchName) => {
+        this.reloadSnapshots = async (branchName, silent) => {
             if (!this.instance)
                 return;
-            await this.snapshots.reload(this.instance.id, branchName);
+            await this.snapshots.reload(this.instance.id, branchName, silent);
         };
         this.reloadInstanceRetrieval = async () => {
             if (!this.instance)
@@ -164,15 +164,17 @@ export class MainStore {
             return response;
         };
         this.getFullConfig = async (instanceId) => {
-            var _a, _b, _c, _d, _e;
+            var _a, _b, _c, _d, _e, _f;
             if (!this.api.getFullConfig)
                 return;
             const { response, error } = await this.api.getFullConfig(instanceId);
             if (response) {
                 this.fullConfig = response;
                 const splitYML = this.fullConfig.split('---');
-                this.platformUrl = (_b = (_a = splitYML[0]) === null || _a === void 0 ? void 0 : _a.split('url: ')[1]) === null || _b === void 0 ? void 0 : _b.split('\n')[0];
-                this.uiVersion = (_e = (_d = (_c = splitYML[0]) === null || _c === void 0 ? void 0 : _c.split('dockerImage: "postgresai/ce-ui:')[2]) === null || _d === void 0 ? void 0 : _d.split('\n')[0]) === null || _e === void 0 ? void 0 : _e.replace(/['"]+/g, '');
+                const platformSection = (_b = (_a = splitYML[0]) === null || _a === void 0 ? void 0 : _a.split('\nplatform:')[1]) !== null && _b !== void 0 ? _b : '';
+                const rawPlatformUrl = (_c = platformSection.split('url: ')[1]) === null || _c === void 0 ? void 0 : _c.split('\n')[0];
+                this.platformUrl = rawPlatformUrl === null || rawPlatformUrl === void 0 ? void 0 : rawPlatformUrl.replace(/['"]+/g, '').trim().split(/\s+/)[0];
+                this.uiVersion = (_f = (_e = (_d = splitYML[0]) === null || _d === void 0 ? void 0 : _d.split('dockerImage: "postgresai/ce-ui:')[2]) === null || _e === void 0 ? void 0 : _e.split('\n')[0]) === null || _f === void 0 ? void 0 : _f.replace(/['"]+/g, '');
             }
             if (error)
                 this.getFullConfigError = await error
@@ -216,6 +218,15 @@ export class MainStore {
                 error,
             };
         };
+        this.probeSource = async (values) => {
+            if (!this.api.probeSource)
+                return;
+            const { response, error } = await this.api.probeSource(values);
+            return {
+                response,
+                error,
+            };
+        };
         this.resetClone = async (cloneId, snapshotId) => {
             if (!this.instance || !this.api.resetClone)
                 return;
@@ -263,13 +274,19 @@ export class MainStore {
             await this.loadInstanceRetrieval(this.instance.id);
             this.isReloadingClones = false;
         };
-        this.getBranches = async (instanceId) => {
+        this.getBranches = async (instanceId, silent) => {
             if (!this.api.getBranches)
                 return;
-            this.isBranchesLoading = true;
+            if (!silent)
+                this.isBranchesLoading = true;
             const { response, error } = await this.api.getBranches(instanceId);
-            this.isBranchesLoading = false;
-            if (error)
+            if (!silent)
+                this.isBranchesLoading = false;
+            if (response)
+                this.getBranchesError = null;
+            // a silent background refresh must not replace the rendered list with an error stub on a
+            // transient failure; errors surface only on a foreground load.
+            if (error && !silent)
                 this.getBranchesError = await error.json().then((err) => err);
             return response;
         };

package/pages/Snapshots/Snapshot/index.js

@@ -13,11 +13,15 @@ import { makeStyles, Button, TextField, IconButton, Table, TableHead, TableRow,
 import { ErrorStub } from '@postgres.ai/shared/components/ErrorStub';
 import { PageSpinner } from '@postgres.ai/shared/components/PageSpinner';
 import { SectionTitle } from '@postgres.ai/shared/components/SectionTitle';
+import { Select } from '@postgres.ai/shared/components/Select';
+import { Spinner } from '@postgres.ai/shared/components/Spinner';
 import { DestroySnapshotModal } from '@postgres.ai/shared/pages/Snapshots/Snapshot/DestorySnapshotModal';
 import { HorizontalScrollContainer } from '@postgres.ai/shared/components/HorizontalScrollContainer';
 import { Tooltip } from '@postgres.ai/shared/components/Tooltip';
 import { icons } from '@postgres.ai/shared/styles/icons';
 import { formatBytesIEC } from '@postgres.ai/shared/utils/units';
+import { parseDate } from '@postgres.ai/shared/utils/date';
+import { protectionOptions, getProtectionSelectValue, } from '@postgres.ai/shared/utils/protection';
 import { styles } from '@postgres.ai/shared/styles/styles';
 import { SyntaxHighlight } from '@postgres.ai/shared/components/SyntaxHighlight';
 import { TableBodyCell, TableBodyCellMenu, TableHeaderCell, } from '@postgres.ai/shared/components/Table';
@@ -71,6 +75,13 @@ const useStyles = makeStyles(() => ({
     summary: {
         marginTop: 20,
     },
+    protectionControl: {
+        display: 'flex',
+        alignItems: 'center',
+        marginTop: '8px',
+        marginBottom: '8px',
+        maxWidth: 525,
+    },
     text: {
         marginTop: '4px',
     },
@@ -129,11 +140,18 @@ export const SnapshotPage = observer((props) => {
     const history = useHistory();
     const stores = useCreatedStores(props.api);
     const [isOpenDestroyModal, setIsOpenDestroyModal] = useState(false);
-    const { snapshot, branchSnapshot, isSnapshotsLoading, snapshotError, branchSnapshotError, load, } = stores.main;
+    const { snapshot, branchSnapshot, isSnapshotsLoading, isUpdatingSnapshot, updateSnapshotProtection, updateSnapshotError, snapshotError, branchSnapshotError, load, } = stores.main;
     const afterSubmitClick = () => {
         history.push(props.routes.snapshots());
         load(props.snapshotId, props.instanceId);
     };
+    const protectedTillDate = (snapshot === null || snapshot === void 0 ? void 0 : snapshot.protectedTill)
+        ? parseDate(snapshot.protectedTill)
+        : null;
+    const handleProtectionChange = (e) => {
+        const value = e.target.value;
+        updateSnapshotProtection(props.snapshotId, props.instanceId, value === 'none' ? null : parseInt(value, 10));
+    };
     const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0;}' }), props.elements.breadcrumbs, _jsx(SectionTitle, { className: classes.title, tag: "h1", level: 1, text: `Snapshot ${props.snapshotId}`, children: _jsx(InstanceTabs, { tab: TABS_INDEX.SNAPSHOTS, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBranchingFeatures }) })] }));
     useEffect(() => {
         load(props.snapshotId, props.instanceId);
@@ -147,7 +165,15 @@ export const SnapshotPage = observer((props) => {
                                                         ? formatBytesIEC(snapshot.logicalSize)
                                                         : '-'] }), _jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Physical data diff size:" }), (snapshot === null || snapshot === void 0 ? void 0 : snapshot.physicalSize)
                                                         ? formatBytesIEC(snapshot.physicalSize)
-                                                        : '-'] }), (branchSnapshot === null || branchSnapshot === void 0 ? void 0 : branchSnapshot.message) && (_jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Message:" }), branchSnapshot.message] }))] }), _jsx("br", {}), _jsx("p", { children: _jsx("strong", { children: "Snapshot info" }) }), (snapshot === null || snapshot === void 0 ? void 0 : snapshot.pool) && (_jsxs("div", { className: classes.copyFieldContainer, children: [_jsx(TextField, { variant: "outlined", label: "snapshot pool", value: snapshot.pool, className: classes.textField, margin: "normal", fullWidth: true, InputLabelProps: {
+                                                        : '-'] }), (branchSnapshot === null || branchSnapshot === void 0 ? void 0 : branchSnapshot.message) && (_jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Message:" }), branchSnapshot.message] }))] }), _jsxs("div", { className: classes.summary, children: [_jsx("p", { children: _jsx("strong", { children: "Deletion protection" }) }), _jsxs("div", { className: classes.protectionControl, children: [_jsx(Select, { label: "Deletion protection", items: (snapshot === null || snapshot === void 0 ? void 0 : snapshot.protected) && protectedTillDate
+                                                            ? [
+                                                                {
+                                                                    value: 'current',
+                                                                    children: `Protected until ${protectedTillDate.toLocaleString()}`,
+                                                                },
+                                                                ...protectionOptions,
+                                                            ]
+                                                            : protectionOptions, value: getProtectionSelectValue(Boolean(snapshot === null || snapshot === void 0 ? void 0 : snapshot.protected), protectedTillDate), onChange: handleProtectionChange, disabled: isUpdatingSnapshot, fullWidth: true }), isUpdatingSnapshot && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), _jsx("p", { className: classes.text, children: "Protected snapshots cannot be deleted manually or automatically." }), updateSnapshotError && (_jsx(ErrorStub, { title: "Update error", message: updateSnapshotError, className: classes.marginTop }))] }), _jsx("br", {}), _jsx("p", { children: _jsx("strong", { children: "Snapshot info" }) }), (snapshot === null || snapshot === void 0 ? void 0 : snapshot.pool) && (_jsxs("div", { className: classes.copyFieldContainer, children: [_jsx(TextField, { variant: "outlined", label: "snapshot pool", value: snapshot.pool, className: classes.textField, margin: "normal", fullWidth: true, InputLabelProps: {
                                                     shrink: true,
                                                     style: styles.inputFieldLabel,
                                                 }, FormHelperTextProps: {

package/pages/Snapshots/Snapshot/stores/Main.d.ts

@@ -1,5 +1,6 @@
 import { SnapshotsStore, SnapshotsApi } from '@postgres.ai/shared/stores/Snapshots';
 import { DestroySnapshot } from '@postgres.ai/shared/types/api/endpoints/destroySnapshot';
+import { UpdateSnapshot } from '@postgres.ai/shared/types/api/endpoints/updateSnapshot';
 import { SnapshotDto } from '@postgres.ai/shared/types/api/entities/snapshot';
 import { GetBranchSnapshot } from '@postgres.ai/shared/types/api/endpoints/getBranchSnapshot';
 import { BranchSnapshotDto } from '@postgres.ai/shared/types/api/entities/branchSnapshot';
@@ -10,6 +11,7 @@ declare type Error = {
 };
 export declare type Api = SnapshotsApi & {
     destroySnapshot: DestroySnapshot;
+    updateSnapshot?: UpdateSnapshot;
     getBranchSnapshot?: GetBranchSnapshot;
     initWS?: InitWS;
 };
@@ -19,12 +21,15 @@ export declare class MainStore {
     snapshotError: Error | null;
     branchSnapshotError: Error | null;
     isSnapshotsLoading: boolean;
+    isUpdatingSnapshot: boolean;
+    updateSnapshotError: string | null;
     private readonly api;
     readonly snapshots: SnapshotsStore;
     constructor(api: Api);
     load: (snapshotId: string, instanceId: string) => Promise<void>;
     getSnapshot: (snapshotId: string, instanceId: string) => Promise<boolean | undefined>;
     getBranchSnapshot: (snapshotId: string, instanceId: string) => Promise<import("@postgres.ai/shared/types/api/entities/branchSnapshot").BranchSnapshotDTO | null | undefined>;
+    updateSnapshotProtection: (snapshotId: string, instanceId: string, durationMinutes: number | null) => Promise<void>;
     destroySnapshot: (snapshotId: string, forceDelete: boolean, instanceId: string) => Promise<{
         response: boolean | null;
         error: any;