@postgres.ai/shared 4.0.0-pr-1028.10 → 4.0.0-pr-1028.12

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@postgres.ai/shared",
-  "version": "4.0.0-pr-1028.10",
+  "version": "4.0.0-pr-1028.12",
   "main": "index.js",
   "types": "index.d.ts",
   "peerDependencies": {

package/pages/Branches/Branch/index.d.ts

@@ -2,7 +2,7 @@
 import { Host } from './context';
 declare type Props = Host & {
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const BranchesPage: ((props: Props) => JSX.Element) & {
     displayName: string;

package/pages/Branches/Branch/index.js

@@ -131,7 +131,7 @@ export const BranchesPage = observer((props) => {
             return acc;
         }
     }, 0);
-    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0;}' }), props.elements.breadcrumbs, _jsx(SectionTitle, { className: classes.title, tag: "h1", level: 1, text: `Branch ${props.branchId}`, children: _jsx(InstanceTabs, { tab: TABS_INDEX.BRANCHES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBracnhingFeatures }) })] }));
+    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0;}' }), props.elements.breadcrumbs, _jsx(SectionTitle, { className: classes.title, tag: "h1", level: 1, text: `Branch ${props.branchId}`, children: _jsx(InstanceTabs, { tab: TABS_INDEX.BRANCHES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBranchingFeatures }) })] }));
     useEffect(() => {
         load(props.branchId, props.instanceId);
     }, []);

package/pages/Clone/index.d.ts

@@ -2,7 +2,7 @@
 import { Host } from './context';
 declare type Props = Host & {
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const Clone: ((props: Props) => JSX.Element) & {
     displayName: string;

package/pages/Clone/index.js

@@ -176,7 +176,7 @@ export const Clone = observer((props) => {
         stores.main.load(props.instanceId, props.cloneId);
     }, []);
     const { instance, snapshots, clone, isResettingClone, isDestroyingClone, isReloading, isUpdatingClone, isCloneStable, } = stores.main;
-    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0;}' }), props.elements.breadcrumbs, _jsx(SectionTitle, { className: classes.title, tag: "h1", level: 1, text: `Clone ${props.cloneId}`, children: _jsx(InstanceTabs, { tab: TABS_INDEX.CLONES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBracnhingFeatures }) })] }));
+    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0;}' }), props.elements.breadcrumbs, _jsx(SectionTitle, { className: classes.title, tag: "h1", level: 1, text: `Clone ${props.cloneId}`, children: _jsx(InstanceTabs, { tab: TABS_INDEX.CLONES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBranchingFeatures }) })] }));
     const cloneErrorMessage = ((_a = stores.main.instanceError) === null || _a === void 0 ? void 0 : _a.message) || ((_b = stores.main.cloneError) === null || _b === void 0 ? void 0 : _b.message);
     const cloneErrorTitle = ((_c = stores.main.instanceError) === null || _c === void 0 ? void 0 : _c.title) || ((_d = stores.main.cloneError) === null || _d === void 0 ? void 0 : _d.title);
     if (cloneErrorMessage && cloneErrorTitle)
@@ -220,8 +220,8 @@ export const Clone = observer((props) => {
         isReloading ||
         isUpdatingClone ||
         !isCloneStable;
-    return (_jsxs(_Fragment, { children: [headRendered, _jsxs("div", { className: classes.wrapper, children: [_jsxs("div", { className: classes.summary, children: [_jsxs("div", { className: classes.actions, children: [_jsxs(Button, { variant: "contained", color: "primary", onClick: requestResetClone, disabled: isDisabledControls, title: 'Reset clone', className: classes.actionButton, children: ["Reset clone", isResettingClone && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), _jsxs(Button, { variant: "contained", color: "primary", onClick: requestDestroyClone, disabled: isDisabledControls, title: 'Delete this clone', className: classes.actionButton, children: ["Delete clone", isDestroyingClone && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), !props.hideBracnhingFeatures && _jsxs(Button, { variant: "contained", color: "primary", onClick: createSnapshot, disabled: isDisabledControls, title: 'Create snapshot', className: classes.actionButton, children: ["Create snapshot", snapshots.snapshotDataLoading && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), _jsxs(Button, { variant: "outlined", color: "secondary", onClick: reloadClone, disabled: isDisabledControls, title: 'Refresh clone information', className: classes.actionButton, children: ["Reload info", isReloading && _jsx(Spinner, { size: "sm", className: classes.spinner })] })] }), stores.main.destroyCloneError ||
-                                (stores.main.resetCloneError && (_jsx(ErrorStub, { title: 'Resetting error', message: stores.main.resetCloneError, className: classes.errorStub }))), !props.hideBracnhingFeatures && _jsxs("div", { children: [_jsx("p", { children: _jsx("strong", { children: "Branch" }) }), _jsx("p", { className: classes.text, children: clone.branch })] }), _jsxs("div", { className: classes.title, children: [_jsx("p", { children: _jsx("strong", { children: "Created" }) }), _jsx("p", { className: classes.text, children: clone.createdAt })] }), _jsx("br", {}), _jsxs("div", { children: [_jsxs("p", { children: [_jsx("strong", { children: "Data state at" }), "\u00A0", _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx("strong", { children: "Data state time" }), " is a time at which data is\u00A0 recovered for this clone."] }), children: icons.infoIcon })] }), _jsx("p", { className: classes.text, children: (_e = clone.snapshot) === null || _e === void 0 ? void 0 : _e.dataStateAt })] }), _jsx("br", {}), _jsxs("div", { children: [_jsx("p", { children: _jsx("strong", { children: "Status" }) }), _jsx(Status, { rawClone: clone, className: classes.status })] }), _jsx("br", {}), _jsxs("div", { children: [_jsxs("p", { children: [_jsx("strong", { children: "Summary" }), "\u00A0", _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx("strong", { children: "Logical data size" }), " is a logical size of files in PGDATA which is being thin-cloned.", _jsx("br", {}), _jsx("br", {}), _jsx("strong", { children: "Physical data diff size" }), " is an actual size of a\u00A0 thin clone. On creation there is no diff between clone\u2019s\u00A0 and initial data state, all data blocks match. During work\u00A0 with the clone data diverges and data diff size increases.", _jsx("br", {}), _jsx("br", {}), _jsx("strong", { children: "Clone creation time" }), " is time which was\u00A0 spent to provision the clone."] }), children: icons.infoIcon })] }), _jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Logical data size:" }), ((_f = instance.state) === null || _f === void 0 ? void 0 : _f.dataSize)
+    return (_jsxs(_Fragment, { children: [headRendered, _jsxs("div", { className: classes.wrapper, children: [_jsxs("div", { className: classes.summary, children: [_jsxs("div", { className: classes.actions, children: [_jsxs(Button, { variant: "contained", color: "primary", onClick: requestResetClone, disabled: isDisabledControls, title: 'Reset clone', className: classes.actionButton, children: ["Reset clone", isResettingClone && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), _jsxs(Button, { variant: "contained", color: "primary", onClick: requestDestroyClone, disabled: isDisabledControls, title: 'Delete this clone', className: classes.actionButton, children: ["Delete clone", isDestroyingClone && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), !props.hideBranchingFeatures && _jsxs(Button, { variant: "contained", color: "primary", onClick: createSnapshot, disabled: isDisabledControls, title: 'Create snapshot', className: classes.actionButton, children: ["Create snapshot", snapshots.snapshotDataLoading && (_jsx(Spinner, { size: "sm", className: classes.spinner }))] }), _jsxs(Button, { variant: "outlined", color: "secondary", onClick: reloadClone, disabled: isDisabledControls, title: 'Refresh clone information', className: classes.actionButton, children: ["Reload info", isReloading && _jsx(Spinner, { size: "sm", className: classes.spinner })] })] }), stores.main.destroyCloneError ||
+                                (stores.main.resetCloneError && (_jsx(ErrorStub, { title: 'Resetting error', message: stores.main.resetCloneError, className: classes.errorStub }))), !props.hideBranchingFeatures && _jsxs("div", { children: [_jsx("p", { children: _jsx("strong", { children: "Branch" }) }), _jsx("p", { className: classes.text, children: clone.branch })] }), _jsxs("div", { className: classes.title, children: [_jsx("p", { children: _jsx("strong", { children: "Created" }) }), _jsx("p", { className: classes.text, children: clone.createdAt })] }), _jsx("br", {}), _jsxs("div", { children: [_jsxs("p", { children: [_jsx("strong", { children: "Data state at" }), "\u00A0", _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx("strong", { children: "Data state time" }), " is a time at which data is\u00A0 recovered for this clone."] }), children: icons.infoIcon })] }), _jsx("p", { className: classes.text, children: (_e = clone.snapshot) === null || _e === void 0 ? void 0 : _e.dataStateAt })] }), _jsx("br", {}), _jsxs("div", { children: [_jsx("p", { children: _jsx("strong", { children: "Status" }) }), _jsx(Status, { rawClone: clone, className: classes.status })] }), _jsx("br", {}), _jsxs("div", { children: [_jsxs("p", { children: [_jsx("strong", { children: "Summary" }), "\u00A0", _jsx(Tooltip, { content: _jsxs(_Fragment, { children: [_jsx("strong", { children: "Logical data size" }), " is a logical size of files in PGDATA which is being thin-cloned.", _jsx("br", {}), _jsx("br", {}), _jsx("strong", { children: "Physical data diff size" }), " is an actual size of a\u00A0 thin clone. On creation there is no diff between clone\u2019s\u00A0 and initial data state, all data blocks match. During work\u00A0 with the clone data diverges and data diff size increases.", _jsx("br", {}), _jsx("br", {}), _jsx("strong", { children: "Clone creation time" }), " is time which was\u00A0 spent to provision the clone."] }), children: icons.infoIcon })] }), _jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Logical data size:" }), ((_f = instance.state) === null || _f === void 0 ? void 0 : _f.dataSize)
                                                 ? formatBytesIEC(instance.state.dataSize)
                                                 : '-'] }), _jsxs("p", { className: classes.text, children: [_jsx("span", { className: classes.paramTitle, children: "Physical data diff size:" }), clone.metadata.cloneDiffSize
                                                 ? formatBytesIEC(clone.metadata.cloneDiffSize)

package/pages/CreateBranch/index.d.ts

@@ -10,9 +10,9 @@ interface CreateBranchProps {
         breadcrumbs: React.ReactNode;
     };
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 }
-export declare const CreateBranchPage: (({ instanceId, api, elements, routes, isPlatform, hideBracnhingFeatures }: CreateBranchProps) => JSX.Element) & {
+export declare const CreateBranchPage: (({ instanceId, api, elements, routes, isPlatform, hideBranchingFeatures }: CreateBranchProps) => JSX.Element) & {
     displayName: string;
 };
 export {};

package/pages/CreateBranch/index.js

@@ -76,7 +76,7 @@ const useStyles = makeStyles({
         whiteSpace: 'initial',
     },
 }, { index: 1 });
-export const CreateBranchPage = observer(({ instanceId, api, elements, routes, isPlatform, hideBracnhingFeatures }) => {
+export const CreateBranchPage = observer(({ instanceId, api, elements, routes, isPlatform, hideBranchingFeatures }) => {
     const stores = useCreatedStores(api);
     const classes = useStyles();
     const history = useHistory();
@@ -114,7 +114,7 @@ export const CreateBranchPage = observer(({ instanceId, api, elements, routes, i
     if (isBranchesLoading) {
         return _jsx(StubSpinner, {});
     }
-    return (_jsxs(_Fragment, { children: [elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create branch", className: classes.title, children: _jsx(InstanceTabs, { tab: TABS_INDEX.BRANCHES, isPlatform: isPlatform, instanceId: instanceId, hasLogs: api.initWS !== undefined, hideInstanceTabs: hideBracnhingFeatures }) }), _jsxs("div", { className: classes.wrapper, children: [_jsxs("div", { className: classes.container, children: [(snapshotsError || getBranchesError) && (_jsx("div", { className: classes.marginTop, children: _jsx(ErrorStub, { message: (snapshotsError === null || snapshotsError === void 0 ? void 0 : snapshotsError.message) || (getBranchesError === null || getBranchesError === void 0 ? void 0 : getBranchesError.message) }) })), _jsxs("div", { className: classes.form, children: [_jsx(TextField, { label: "Branch name", variant: "outlined", required: true, fullWidth: true, size: "small", InputLabelProps: {
+    return (_jsxs(_Fragment, { children: [elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create branch", className: classes.title, children: _jsx(InstanceTabs, { tab: TABS_INDEX.BRANCHES, isPlatform: isPlatform, instanceId: instanceId, hasLogs: api.initWS !== undefined, hideInstanceTabs: hideBranchingFeatures }) }), _jsxs("div", { className: classes.wrapper, children: [_jsxs("div", { className: classes.container, children: [(snapshotsError || getBranchesError) && (_jsx("div", { className: classes.marginTop, children: _jsx(ErrorStub, { message: (snapshotsError === null || snapshotsError === void 0 ? void 0 : snapshotsError.message) || (getBranchesError === null || getBranchesError === void 0 ? void 0 : getBranchesError.message) }) })), _jsxs("div", { className: classes.form, children: [_jsx(TextField, { label: "Branch name", variant: "outlined", required: true, fullWidth: true, size: "small", InputLabelProps: {
                                             shrink: true,
                                         }, value: formik.values.branchName, error: Boolean(formik.errors.branchName), className: classes.marginBottom, onChange: (e) => formik.setFieldValue('branchName', e.target.value) }), _jsx("p", { className: cn(classes.marginTop, classes.marginBottom), children: "Choose an existing branch. The new branch will initially point at the same snapshot as the parent branch but going further, their evolution paths will be independent - new snapshots can be created for both branches." }), _jsx(Select, { fullWidth: true, label: "Parent branch", value: formik.values.baseBranch, disabled: !branchesList || formik.isSubmitting, onChange: handleParentBranchChange, error: Boolean(formik.errors.baseBranch), items: branchesList
                                             ? branchesList.map((branch) => {

package/pages/CreateClone/index.d.ts

@@ -12,7 +12,7 @@ declare type Host = {
 };
 declare type Props = Host & {
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const CreateClone: ((props: Props) => JSX.Element) & {
     displayName: string;

package/pages/CreateClone/index.js

@@ -105,7 +105,7 @@ export const CreateClone = observer((props) => {
             return;
         history.push(props.routes.clone(stores.main.clone.id));
     }, [stores.main.clone, stores.main.isCloneStable]);
-    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0; }' }), props.elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create clone", className: styles.pageTitle, children: _jsx(InstanceTabs, { tab: TABS_INDEX.CLONES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBracnhingFeatures }) })] }));
+    const headRendered = (_jsxs(_Fragment, { children: [_jsx("style", { children: 'p { margin: 0; }' }), props.elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create clone", className: styles.pageTitle, children: _jsx(InstanceTabs, { tab: TABS_INDEX.CLONES, isPlatform: props.isPlatform, instanceId: props.instanceId, hasLogs: props.api.initWS !== undefined, hideInstanceTabs: props.hideBranchingFeatures }) })] }));
     // Initial loading spinner.
     if (!stores.main.instance || isLoadingSnapshots)
         return (_jsxs(_Fragment, { children: [headRendered, _jsx(StubSpinner, {})] }));

package/pages/CreateSnapshot/index.d.ts

@@ -10,9 +10,9 @@ interface CreateSnapshotProps {
         breadcrumbs: React.ReactNode;
     };
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 }
-export declare const CreateSnapshotPage: (({ instanceId, api, elements, routes, isPlatform, hideBracnhingFeatures }: CreateSnapshotProps) => JSX.Element) & {
+export declare const CreateSnapshotPage: (({ instanceId, api, elements, routes, isPlatform, hideBranchingFeatures }: CreateSnapshotProps) => JSX.Element) & {
     displayName: string;
 };
 export {};

package/pages/CreateSnapshot/index.js

@@ -71,7 +71,7 @@ const useStyles = makeStyles({
         lineHeight: '26px'
     },
 }, { index: 1 });
-export const CreateSnapshotPage = observer(({ instanceId, api, elements, routes, isPlatform, hideBracnhingFeatures }) => {
+export const CreateSnapshotPage = observer(({ instanceId, api, elements, routes, isPlatform, hideBranchingFeatures }) => {
     var _a, _b;
     const stores = useCreatedStores(api);
     const classes = useStyles();
@@ -104,7 +104,7 @@ export const CreateSnapshotPage = observer(({ instanceId, api, elements, routes,
             return;
         formik.setFieldValue('cloneID', cloneID);
     }, [history.location.search, formik.initialValues]);
-    return (_jsxs(_Fragment, { children: [elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create snapshot", className: classes.title, children: _jsx(InstanceTabs, { tab: TABS_INDEX.SNAPSHOTS, isPlatform: isPlatform, instanceId: instanceId, hasLogs: api.initWS !== undefined, hideInstanceTabs: hideBracnhingFeatures }) }), _jsxs("div", { className: classes.wrapper, children: [_jsx("div", { className: classes.container, children: _jsxs("div", { className: classes.marginTop2x, children: [_jsx("strong", { children: "Clone ID" }), _jsx("p", { className: classes.marginTop, children: "Choose a clone ID from the dropdown below. This will be the starting point for your new snapshot." }), _jsx(Select, { fullWidth: true, label: "Clone ID *", value: formik.values.cloneID, disabled: formik.isSubmitting, className: classes.marginBottom2x, onChange: (e) => formik.setFieldValue('cloneID', e.target.value), error: Boolean(formik.errors.cloneID), items: clonesList
+    return (_jsxs(_Fragment, { children: [elements.breadcrumbs, _jsx(SectionTitle, { tag: "h1", level: 1, text: "Create snapshot", className: classes.title, children: _jsx(InstanceTabs, { tab: TABS_INDEX.SNAPSHOTS, isPlatform: isPlatform, instanceId: instanceId, hasLogs: api.initWS !== undefined, hideInstanceTabs: hideBranchingFeatures }) }), _jsxs("div", { className: classes.wrapper, children: [_jsx("div", { className: classes.container, children: _jsxs("div", { className: classes.marginTop2x, children: [_jsx("strong", { children: "Clone ID" }), _jsx("p", { className: classes.marginTop, children: "Choose a clone ID from the dropdown below. This will be the starting point for your new snapshot." }), _jsx(Select, { fullWidth: true, label: "Clone ID *", value: formik.values.cloneID, disabled: formik.isSubmitting, className: classes.marginBottom2x, onChange: (e) => formik.setFieldValue('cloneID', e.target.value), error: Boolean(formik.errors.cloneID), items: clonesList
                                         ? clonesList.map((clone, i) => {
                                             var _a, _b;
                                             const isLatest = i === 0;

package/pages/Instance/Clones/ClonesList/index.d.ts

@@ -4,7 +4,7 @@ declare type Props = {
     clones?: Clone[];
     isDisabled: boolean;
     emptyStubText: string;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const ClonesList: (props: Props) => JSX.Element;
 export {};

package/pages/Instance/Clones/ClonesList/index.js

@@ -78,12 +78,12 @@ export const ClonesList = (props) => {
     };
     if (!((_b = state.clones) === null || _b === void 0 ? void 0 : _b.length))
         return _jsx("p", { className: styles.emptyStub, children: props.emptyStubText });
-    return (_jsxs(_Fragment, { children: [_jsx(HorizontalScrollContainer, { children: _jsxs(Table, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableHeaderCell, {}), _jsx(TableHeaderCell, { children: "Status" }), _jsx(TableHeaderCell, { children: "ID" }), !props.hideBracnhingFeatures && _jsx(TableHeaderCell, { children: _jsxs("div", { onClick: handleSortByBranch, className: cn(styles.interactiveRow, styles.verticalCentered), children: ["Branch", _jsx(ArrowDropDownIcon, { className: cn(state.sortByCreated === 'asc' && styles.hideSortIcon, state.sortByBranch === 'asc' && styles.sortIconUp, styles.sortIcon) })] }) }), _jsx(TableHeaderCell, { children: _jsx(Tooltip, { content: "When enabled, neither manual nor automated deletion of this clone is possible. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsxs("div", { className: styles.verticalCentered, children: ["Protected", _jsx(InfoIcon, { className: styles.infoIcon })] }) }) }), _jsx(TableHeaderCell, { children: _jsxs("div", { onClick: handleSortByCreated, className: cn(styles.interactiveRow, styles.verticalCentered), children: ["Created", _jsx(ArrowDropDownIcon, { className: cn(state.sortByBranch === 'asc' && styles.hideSortIcon, state.sortByCreated === 'asc' && styles.sortIconUp, styles.sortIcon) })] }) }), _jsx(TableHeaderCell, { children: "Port" }), _jsx(TableHeaderCell, { children: "DB user" }), _jsx(TableHeaderCell, { children: _jsx(Tooltip, { content: "Clone's own size \u2013 how much data was added or modified.", children: _jsxs("div", { className: styles.verticalCentered, children: ["Diff size", _jsx(InfoIcon, { className: styles.infoIcon })] }) }) }), _jsx(TableHeaderCell, { children: "Disk" }), _jsx(TableHeaderCell, { children: "Data state time" })] }) }), _jsx(TableBody, { children: state.clones.map((clone) => {
+    return (_jsxs(_Fragment, { children: [_jsx(HorizontalScrollContainer, { children: _jsxs(Table, { children: [_jsx(TableHead, { children: _jsxs(TableRow, { children: [_jsx(TableHeaderCell, {}), _jsx(TableHeaderCell, { children: "Status" }), _jsx(TableHeaderCell, { children: "ID" }), !props.hideBranchingFeatures && _jsx(TableHeaderCell, { children: _jsxs("div", { onClick: handleSortByBranch, className: cn(styles.interactiveRow, styles.verticalCentered), children: ["Branch", _jsx(ArrowDropDownIcon, { className: cn(state.sortByCreated === 'asc' && styles.hideSortIcon, state.sortByBranch === 'asc' && styles.sortIconUp, styles.sortIcon) })] }) }), _jsx(TableHeaderCell, { children: _jsx(Tooltip, { content: "When enabled, neither manual nor automated deletion of this clone is possible. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsxs("div", { className: styles.verticalCentered, children: ["Protected", _jsx(InfoIcon, { className: styles.infoIcon })] }) }) }), _jsx(TableHeaderCell, { children: _jsxs("div", { onClick: handleSortByCreated, className: cn(styles.interactiveRow, styles.verticalCentered), children: ["Created", _jsx(ArrowDropDownIcon, { className: cn(state.sortByBranch === 'asc' && styles.hideSortIcon, state.sortByCreated === 'asc' && styles.sortIconUp, styles.sortIcon) })] }) }), _jsx(TableHeaderCell, { children: "Port" }), _jsx(TableHeaderCell, { children: "DB user" }), _jsx(TableHeaderCell, { children: _jsx(Tooltip, { content: "Clone's own size \u2013 how much data was added or modified.", children: _jsxs("div", { className: styles.verticalCentered, children: ["Diff size", _jsx(InfoIcon, { className: styles.infoIcon })] }) }) }), _jsx(TableHeaderCell, { children: "Disk" }), _jsx(TableHeaderCell, { children: "Data state time" })] }) }), _jsx(TableBody, { children: state.clones.map((clone) => {
                                 var _a, _b;
                                 const clonePagePath = host.routes.clone(clone.id);
                                 return (_jsxs(TableRow, { hover: !props.isDisabled, onClick: props.isDisabled
                                         ? undefined
-                                        : () => history.push(clonePagePath), className: cn(!props.isDisabled && styles.interactiveRow), children: [_jsx(MenuCell, { clone: clone, onConnect: openConnectionModal, clonePagePath: clonePagePath }), _jsx(TableBodyCell, { children: _jsx(Tooltip, { content: clone.status.message, children: _jsx(Status, { type: getCloneStatusType(clone.status.code), children: getCloneStatusText(clone.status.code) }) }) }), _jsx(TableBodyCell, { children: clone.id }), !props.hideBracnhingFeatures && _jsx(TableBodyCell, { children: clone.branch }), _jsx(TableBodyCell, { children: clone.protected ? (_jsx(Tooltip, { content: "Clone is protected from manual and automated deletion. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsx(ShieldIcon, { className: styles.protectionIcon }) })) : (_jsx(Tooltip, { content: "Clone is not protected from deletion. To save disk space it will be automatically deleted if there is no activity for a long time.", children: _jsx(RenewableIcon, { className: styles.protectionIcon }) })) }), _jsxs(TableBodyCell, { children: [clone.createdAt, " (", isValidDate(clone.createdAtDate)
+                                        : () => history.push(clonePagePath), className: cn(!props.isDisabled && styles.interactiveRow), children: [_jsx(MenuCell, { clone: clone, onConnect: openConnectionModal, clonePagePath: clonePagePath }), _jsx(TableBodyCell, { children: _jsx(Tooltip, { content: clone.status.message, children: _jsx(Status, { type: getCloneStatusType(clone.status.code), children: getCloneStatusText(clone.status.code) }) }) }), _jsx(TableBodyCell, { children: clone.id }), !props.hideBranchingFeatures && _jsx(TableBodyCell, { children: clone.branch }), _jsx(TableBodyCell, { children: clone.protected ? (_jsx(Tooltip, { content: "Clone is protected from manual and automated deletion. Note that abandoned protected clones may lead to out-of-disk-space events because they hold old data, blocking cleanup and refresh processes.", children: _jsx(ShieldIcon, { className: styles.protectionIcon }) })) : (_jsx(Tooltip, { content: "Clone is not protected from deletion. To save disk space it will be automatically deleted if there is no activity for a long time.", children: _jsx(RenewableIcon, { className: styles.protectionIcon }) })) }), _jsxs(TableBodyCell, { children: [clone.createdAt, " (", isValidDate(clone.createdAtDate)
                                                     ? formatDistanceToNowStrict(clone.createdAtDate, {
                                                         addSuffix: true,
                                                     })

package/pages/Instance/Clones/index.d.ts

@@ -1,7 +1,7 @@
 /// <reference types="react" />
 interface ClonesProps {
     onlyRenderList?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 }
 export declare const Clones: ((props: ClonesProps) => JSX.Element | null) & {
     displayName: string;

package/pages/Instance/Clones/index.js

@@ -60,5 +60,5 @@ export const Clones = observer((props) => {
     const canCreateClone = hasSnapshots && !stores.main.isDisabledInstance;
     return (_jsxs("div", { className: classes.root, children: [!onlyRenderList && (_jsxs(_Fragment, { children: [_jsx(SectionTitle, { level: 2, tag: "h2", text: "Cloning summary" }), _jsx(Header, { expectedCloningTimeS: round(instance.state.cloning.expectedCloningTime, 2), logicalSize: instance.state.dataSize, clonesCount: instance.state.cloning.clones.length })] })), _jsx(SectionTitle, { level: 2, tag: "h3", text: `Clones (${instance.state.cloning.clones.length})`, rightContent: _jsxs(_Fragment, { children: [_jsx(Button, { theme: "primary", onClick: goToCloneAddPage, isDisabled: !canCreateClone, isLoading: isLoadingSnapshots, children: "Create clone" }), !hasSnapshots && (_jsx(Tooltip, { content: "No snapshots", children: _jsx("div", { style: { display: 'flex' }, children: _jsx(InfoIcon, { className: classes.infoIcon }) }) }))] }) }), _jsx(ClonesList, { clones: isShortList
                     ? instance.state.cloning.clones.slice(0, SHORT_LIST_SIZE)
-                    : instance.state.cloning.clones, isDisabled: stores.main.isDisabledInstance, emptyStubText: "This instance has no active clones.", hideBracnhingFeatures: props.hideBracnhingFeatures }), showListSizeButton && !onlyRenderList && (_jsx(Button, { className: classes.listSizeButton, onClick: toggleListSize, children: isShortList ? 'Show more' : 'Show less' }))] }));
+                    : instance.state.cloning.clones, isDisabled: stores.main.isDisabledInstance, emptyStubText: "This instance has no active clones.", hideBranchingFeatures: props.hideBranchingFeatures }), showListSizeButton && !onlyRenderList && (_jsx(Button, { className: classes.listSizeButton, onClick: toggleListSize, children: isShortList ? 'Show more' : 'Show less' }))] }));
 });

package/pages/Instance/Info/Retrieval/index.d.ts

@@ -1,4 +1,8 @@
 /// <reference types="react" />
-export declare const Retrieval: (() => JSX.Element | null) & {
+declare type RetrievalProps = {
+    hideBranchingFeatures?: boolean;
+};
+export declare const Retrieval: ((props: RetrievalProps) => JSX.Element | null) & {
     displayName: string;
 };
+export {};

package/pages/Instance/Info/Retrieval/index.js

@@ -27,7 +27,7 @@ const useStyles = makeStyles(() => ({
         },
     },
 }), { index: 1 });
-export const Retrieval = observer(() => {
+export const Retrieval = observer((props) => {
     var _a;
     const stores = useStores();
     const classes = useStyles();
@@ -45,7 +45,7 @@ export const Retrieval = observer(() => {
     const isVisible = mode !== 'physical' && !isRetrievalUnknown(mode);
     const isActive = mode === 'logical' && status === 'refreshing';
     const canCallFullRefresh = retrieving.status === 'finished' || retrieving.status === 'failed';
-    return (_jsxs(Section, { title: "Retrieval", children: [_jsx(Property, { name: "Status", children: _jsxs(Status, { type: getTypeByStatus(retrieving.status), children: [capitalize(retrieving.status), isVisible && (_jsx(_Fragment, { children: _jsx(Button, { theme: "primary", onClick: () => setIsModalOpen(true), isDisabled: !isActive, className: classes.detailsButton, children: "Show details" }) })), _jsx(Button, { theme: "secondary", onClick: () => setIsFullRefreshModalOpen(true), isDisabled: !canCallFullRefresh, className: classes.detailsButton, children: "Full refresh" })] }) }), _jsx(Property, { name: "Mode", children: retrieving.mode }), _jsx(Property, { name: "Last refresh", children: retrieving.lastRefresh
+    return (_jsxs(Section, { title: "Retrieval", children: [_jsx(Property, { name: "Status", children: _jsxs(Status, { type: getTypeByStatus(retrieving.status), children: [capitalize(retrieving.status), isVisible && (_jsx(_Fragment, { children: _jsx(Button, { theme: "primary", onClick: () => setIsModalOpen(true), isDisabled: !isActive, className: classes.detailsButton, children: "Show details" }) })), !props.hideBranchingFeatures && _jsx(Button, { theme: "secondary", onClick: () => setIsFullRefreshModalOpen(true), isDisabled: !canCallFullRefresh, className: classes.detailsButton, children: "Full refresh" })] }) }), _jsx(Property, { name: "Mode", children: retrieving.mode }), _jsx(Property, { name: "Last refresh", children: retrieving.lastRefresh
                     ? formatDateStd(retrieving.lastRefresh, { withDistance: true })
                     : '-' }), _jsx(Property, { name: "Next refresh", children: retrieving.nextRefresh
                     ? formatDateStd(retrieving.nextRefresh, { withDistance: true })

package/pages/Instance/Info/index.d.ts

@@ -1,2 +1,6 @@
 /// <reference types="react" />
-export declare const Info: () => JSX.Element;
+declare type InfoProps = {
+    hideBranchingFeatures?: boolean;
+};
+export declare const Info: (props: InfoProps) => JSX.Element;
+export {};

package/pages/Instance/Info/index.js

@@ -62,7 +62,7 @@ const useStyles = makeStyles((theme) => ({
         },
     },
 }), { index: 1 });
-export const Info = () => {
+export const Info = (props) => {
     const classes = useStyles();
     const width = useWindowDimensions();
     const [onHover, setOnHover] = useState(false);
@@ -72,5 +72,5 @@ export const Info = () => {
         setIsCollapsed(!isCollapsed);
         localStorage.setItem(SIDEBAR_COLLAPSED_PARAM, isCollapsed ? '0' : '1');
     };
-    return (_jsxs("div", { className: cn(classes.container, !isCollapsed ? classes.root : classes.collapsed), children: [!isMobileScreen && (_jsx(Button, { onMouseEnter: () => setOnHover(true), onMouseLeave: () => setOnHover(false), className: classes.collapseBtn, onClick: handleClick, isCollapsed: isCollapsed, type: "button", icon: isCollapsed ? (_jsx(ArrowLeft, { className: classes.arrowImage })) : (_jsx(ArrowRight, { className: classes.arrowImage })), children: onHover && 'Collapse' })), !isCollapsed && (_jsxs("div", { children: [_jsx(Status, {}), _jsx(Retrieval, {}), _jsx(Connection, {}), _jsx(Disks, {}), _jsx(Snapshots, {})] }))] }));
+    return (_jsxs("div", { className: cn(classes.container, !isCollapsed ? classes.root : classes.collapsed), children: [!isMobileScreen && (_jsx(Button, { onMouseEnter: () => setOnHover(true), onMouseLeave: () => setOnHover(false), className: classes.collapseBtn, onClick: handleClick, isCollapsed: isCollapsed, type: "button", icon: isCollapsed ? (_jsx(ArrowLeft, { className: classes.arrowImage })) : (_jsx(ArrowRight, { className: classes.arrowImage })), children: onHover && 'Collapse' })), !isCollapsed && (_jsxs("div", { children: [_jsx(Status, {}), _jsx(Retrieval, { hideBranchingFeatures: props.hideBranchingFeatures }), _jsx(Connection, {}), _jsx(Disks, {}), _jsx(Snapshots, {})] }))] }));
 };

package/pages/Instance/context.d.ts

@@ -21,7 +21,7 @@ export declare type Host = {
         breadcrumbs: React.ReactNode;
     };
     wsHost?: string;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
     renderCurrentTab?: number;
     isPlatform?: boolean;
     setProjectAlias?: (alias: string) => void;

package/pages/Instance/index.d.ts

@@ -2,7 +2,7 @@
 import { Host } from './context';
 import './styles.scss';
 declare type Props = Host & {
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const Instance: ((props: Props) => JSX.Element) & {
     displayName: string;

package/pages/Instance/index.js

@@ -85,7 +85,7 @@ export const Instance = observer((props) => {
             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.hideBracnhingFeatures })) }), 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, {})] })) : (_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 &&
+    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 && !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) {

package/pages/Snapshots/Snapshot/index.d.ts

@@ -2,7 +2,7 @@
 import { Host } from './context';
 declare type Props = Host & {
     isPlatform?: boolean;
-    hideBracnhingFeatures?: boolean;
+    hideBranchingFeatures?: boolean;
 };
 export declare const SnapshotPage: ((props: Props) => JSX.Element) & {
     displayName: string;

package/pages/Snapshots/Snapshot/index.js

@@ -134,7 +134,7 @@ export const SnapshotPage = observer((props) => {
         history.push(props.routes.snapshots());
         load(props.snapshotId, props.instanceId);
     };
-    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.hideBracnhingFeatures }) })] }));
+    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);
     }, []);