@postgres.ai/shared 4.1.2 → 4.2.0-pr-1200

package/pages/Clone/stores/Main.ts

@@ -1,215 +0,0 @@
-/*--------------------------------------------------------------------------
- * Copyright (c) 2019-2021, Postgres.ai, Nikolay Samokhvalov nik@postgres.ai
- * All Rights Reserved. Proprietary and confidential.
- * Unauthorized copying of this file, via any medium is strictly prohibited
- *--------------------------------------------------------------------------
- */
-
-import { makeAutoObservable } from 'mobx'
-
-import { GetInstance } from '@postgres.ai/shared/types/api/endpoints/getInstance'
-import { GetClone } from '@postgres.ai/shared/types/api/endpoints/getClone'
-import { ResetClone } from '@postgres.ai/shared/types/api/endpoints/resetClone'
-import { DestroyClone } from '@postgres.ai/shared/types/api/endpoints/destroyClone'
-import { UpdateClone } from '@postgres.ai/shared/types/api/endpoints/updateClone'
-import {
-  SnapshotsStore,
-  SnapshotsApi,
-} from '@postgres.ai/shared/stores/Snapshots'
-import { Clone } from '@postgres.ai/shared/types/api/entities/clone'
-import { Instance } from '@postgres.ai/shared/types/api/entities/instance'
-import { checkIsCloneStable } from '@postgres.ai/shared/utils/clone'
-import { getTextFromUnknownApiError } from '@postgres.ai/shared/utils/api'
-import { InitWS } from '@postgres.ai/shared/types/api/endpoints/initWS'
-
-const UNSTABLE_CLONE_UPDATE_TIMEOUT = 1000
-
-export type Api = SnapshotsApi & {
-  getInstance: GetInstance
-  getClone: GetClone
-  resetClone: ResetClone
-  destroyClone: DestroyClone
-  updateClone: UpdateClone
-  initWS?: InitWS
-}
-
-type Error = {
-  title?: string
-  message: string
-}
-
-export class MainStore {
-  instance: Instance | null = null
-  instanceError: Error | null = null
-
-  clone: Clone | null = null
-  cloneError: Error | null = null
-
-  readonly snapshots: SnapshotsStore
-
-  isResettingClone = false
-  resetCloneError: string | null = null
-
-  isDestroyingClone = false
-  destroyCloneError: string | null = null
-
-  isUpdatingClone = false
-  updateCloneError: string | null = null
-
-  isReloading = false
-
-  private cloneUpdateTimeout?: number
-
-  private readonly api: Api
-
-  constructor(api: Api) {
-    this.snapshots = new SnapshotsStore(api)
-    this.api = api
-
-    makeAutoObservable(this)
-  }
-
-  get isCloneStable() {
-    if (!this.clone) return false
-    return checkIsCloneStable(this.clone)
-  }
-
-  load = async (instanceId: string, cloneId: string) => {
-    const [isInstanceOk, isCloneOk, isSnapshotsLoaded] = await Promise.all([
-      this.loadInstance(instanceId),
-      this.loadClone(instanceId, cloneId),
-      this.snapshots.load(instanceId),
-    ])
-
-    return isInstanceOk && isCloneOk && isSnapshotsLoaded
-  }
-
-  reload = async () => {
-    if (!this.instance || !this.clone) return false
-    this.isReloading = true
-    const isSuccess = await this.load(this.instance.id, this.clone.id)
-    this.isReloading = false
-    return isSuccess
-  }
-
-  private loadInstance = async (instanceId: string) => {
-    const { response, error } = await this.api.getInstance({
-      instanceId,
-    })
-
-    if (response) {
-      this.instance = response
-    } else {
-      this.instanceError = {
-        title: 'Error',
-        message: `Instance "${instanceId}" not found`,
-      }
-    }
-
-    if (error) {
-      this.instanceError = {
-        message: await getTextFromUnknownApiError(error),
-      }
-    }
-
-    return Boolean(response)
-  }
-
-  private loadClone = async (instanceId: string, cloneId: string) => {
-    window.clearTimeout(this.cloneUpdateTimeout)
-
-    const { response, error } = await this.api.getClone({ instanceId, cloneId })
-
-    if (response) {
-      this.clone = response
-
-      if (!this.isCloneStable)
-        this.cloneUpdateTimeout = window.setTimeout(
-          () => this.loadClone(instanceId, cloneId),
-          UNSTABLE_CLONE_UPDATE_TIMEOUT,
-        )
-    }
-
-    if (error) {
-      if (error.status === 404) {
-        this.cloneError = {
-          title: 'Error',
-          message: `Clone "${cloneId}" not found`,
-        }
-      } else {
-        this.cloneError = {
-          message: await getTextFromUnknownApiError(error),
-        }
-      }
-    }
-
-    return Boolean(response)
-  }
-
-  resetClone = async (snapshotId: string) => {
-    if (!this.instance || !this.clone) return false
-
-    this.isResettingClone = true
-
-    const { response, error } = await this.api.resetClone({
-      instanceId: this.instance.id,
-      cloneId: this.clone.id,
-      snapshotId,
-    })
-
-    if (response) await this.loadClone(this.instance.id, this.clone.id)
-
-    if (error) this.resetCloneError = await getTextFromUnknownApiError(error)
-
-    this.isResettingClone = false
-
-    return Boolean(response)
-  }
-
-  destroyClone = async () => {
-    if (!this.instance || !this.clone) return false
-
-    this.isDestroyingClone = true
-
-    const { response, error } = await this.api.destroyClone({
-      instanceId: this.instance.id,
-      cloneId: this.clone.id,
-    })
-
-    if (error) this.destroyCloneError = await getTextFromUnknownApiError(error)
-
-    this.isDestroyingClone = false
-
-    return Boolean(response)
-  }
-
-  updateCloneProtection = async (durationMinutes: number | null) => {
-    if (!this.instance || !this.clone) return
-
-    this.isUpdatingClone = true
-
-    const prevIsProtected = this.clone.protected
-    const isProtected = durationMinutes !== null
-
-    this.clone.protected = isProtected
-
-    const { response, error } = await this.api.updateClone({
-      instanceId: this.instance.id,
-      cloneId: this.clone.id,
-      clone: {
-        isProtected,
-        protectionDurationMinutes: durationMinutes ?? undefined,
-      },
-    })
-
-    if (response) {
-      await this.loadClone(this.instance.id, this.clone.id)
-    } else {
-      this.clone.protected = prevIsProtected
-    }
-
-    if (error) this.updateCloneError = await getTextFromUnknownApiError(error)
-
-    this.isUpdatingClone = false
-  }
-}

package/pages/Clone/useCreatedStores.ts

@@ -1,11 +0,0 @@
-import { useMemo } from 'react'
-
-import { MainStore } from './stores/Main'
-
-import { Host } from './context'
-
-export const useCreatedStores = (host: Host) => ({
-  main: useMemo(() => new MainStore(host.api), []),
-})
-
-export type Stores = ReturnType<typeof useCreatedStores>

package/pages/Clone/utils/index.ts

@@ -1,15 +0,0 @@
-export const getCliResetCloneCommand = (cloneId: string) => {
-  return `dblab clone reset ${cloneId ? cloneId : `<CLONE_ID>`}`
-}
-
-export const getCliDestroyCloneCommand = (cloneId: string) => {
-  return `dblab clone destroy ${cloneId ? cloneId : `<CLONE_ID>`}`
-}
-
-export const getCliProtectedCloneCommand = (enabled: boolean) => {
-  return `dblab clone update --protected ${enabled ? '' : 'false'}`
-}
-
-export const getCreateSnapshotCommand = (cloneId: string) => {
-  return `dblab branch snapshot --clone-id ${cloneId}`
-}

package/pages/CreateBranch/index.tsx

@@ -1,322 +0,0 @@
-/*--------------------------------------------------------------------------
- * Copyright (c) 2019-2021, Postgres.ai, Nikolay Samokhvalov nik@postgres.ai
- * All Rights Reserved. Proprietary and confidential.
- * Unauthorized copying of this file, via any medium is strictly prohibited
- *--------------------------------------------------------------------------
- */
-
-import cn from 'classnames'
-import { useHistory } from 'react-router'
-import { observer } from 'mobx-react-lite'
-import React, { useEffect, useState } from 'react'
-import { TextField, makeStyles } from '@material-ui/core'
-
-import { Button } from '@postgres.ai/shared/components/Button'
-import { ResponseMessage } from '@postgres.ai/shared/pages/Instance/Configuration/ResponseMessage'
-import { Select } from '@postgres.ai/shared/components/Select'
-import { CreateBranchFormValues } from '@postgres.ai/shared/types/api/endpoints/createBranch'
-import { SectionTitle } from '@postgres.ai/shared/components/SectionTitle'
-import { ErrorStub } from '@postgres.ai/shared/components/ErrorStub'
-import { SyntaxHighlight } from '@postgres.ai/shared/components/SyntaxHighlight'
-import { StubSpinner } from '@postgres.ai/shared/components/StubSpinnerFlex'
-import { Spinner } from '@postgres.ai/shared/components/Spinner'
-
-import { useForm } from './useForm'
-import { MainStoreApi } from './stores/Main'
-import { useCreatedStores } from './useCreatedStores'
-import { getCliBranchListCommand, getCliCreateBranchCommand } from './utils'
-import { Snapshot } from '@postgres.ai/shared/types/api/entities/snapshot'
-import { InstanceTabs, TABS_INDEX } from "../Instance/Tabs";
-
-interface CreateBranchProps {
-  instanceId: string
-  api: MainStoreApi
-  routes: {
-    branch: (branchName: string) => string
-  }
-  elements: {
-    breadcrumbs: React.ReactNode
-  }
-  isPlatform?: boolean
-  hideBranchingFeatures?: boolean
-}
-
-const useStyles = makeStyles(
-  {
-    wrapper: {
-      display: 'flex',
-      gap: '60px',
-      maxWidth: '1200px',
-      fontSize: '14px',
-      marginTop: '20px',
-
-      '@media (max-width: 1300px)': {
-        flexDirection: 'column',
-        gap: '20px',
-      },
-    },
-    container: {
-      maxWidth: '100%',
-      flex: '1 1 0',
-      minWidth: 0,
-
-      '&  p,span': {
-        fontSize: 14,
-      },
-    },
-    snippetContainer: {
-      flex: '1 1 0',
-      minWidth: 0,
-      boxShadow: 'rgba(0, 0, 0, 0.1) 0px 4px 12px',
-      padding: '10px 20px 10px 20px',
-      height: 'max-content',
-      borderRadius: '4px',
-    },
-    marginBottom: {
-      marginBottom: '8px',
-    },
-    marginBottom2x: {
-      marginBottom: '16px',
-    },
-    marginTop: {
-      marginTop: '8px',
-    },
-    title: {
-      marginTop: '8px',
-      lineHeight: '26px'
-    },
-    form: {
-      marginTop: '16px',
-    },
-    spinner: {
-      marginLeft: '8px',
-      color: '#fff',
-    },
-    snapshotOverflow: {
-      width: '100%',
-      wordWrap: 'break-word',
-      whiteSpace: 'initial',
-    },
-  },
-  { index: 1 },
-)
-
-export const CreateBranchPage = observer(
-  ({ instanceId, api, elements, routes, isPlatform, hideBranchingFeatures }: CreateBranchProps) => {
-    const stores = useCreatedStores(api)
-    const classes = useStyles()
-    const history = useHistory()
-    const [branchSnapshots, setBranchSnapshots] = useState<Snapshot[]>([])
-    const [selectedBranchKey, setSelectedBranchKey] = useState<string>('main|')
-
-    const {
-      load,
-      branchesList,
-      getBranchesError,
-      createBranch,
-      createBranchError,
-      isBranchesLoading,
-      isCreatingBranch,
-      getSnapshots,
-      snapshotsError,
-    } = stores.main
-
-    const handleSubmit = async (values: CreateBranchFormValues) => {
-      await createBranch({
-        ...values,
-        instanceId,
-      }).then((branch) => {
-        if (branch && branch?.name) {
-          history.push(routes.branch(branch.name))
-        }
-      })
-    }
-
-    const fetchSnapshots = async (branchName: string, dataset?: string) => {
-      await getSnapshots(instanceId, branchName, dataset).then((response) => {
-        if (response) {
-          setBranchSnapshots(response)
-          formik.setFieldValue('snapshotID', response[0]?.id)
-        }
-      })
-    }
-
-    const handleParentBranchChange = async (
-      e: React.ChangeEvent<HTMLInputElement>,
-    ) => {
-      const compositeKey = e.target.value
-      const [branchName, dataset] = compositeKey.split('|')
-
-      setSelectedBranchKey(compositeKey)
-      formik.setFieldValue('baseBranch', branchName)
-      await fetchSnapshots(branchName, dataset)
-    }
-
-    const [{ formik }] = useForm(handleSubmit)
-
-      useEffect(() => {
-          load(instanceId);
-      }, [instanceId]);
-
-      useEffect(() => {
-          if (!branchesList?.length) return;
-          const selected = branchesList.find(b => b.name === formik.values.baseBranch);
-          if (!selected) return;
-          const compositeKey = `${selected.name}|${selected.baseDataset || ''}`;
-          setSelectedBranchKey(compositeKey);
-          fetchSnapshots(selected.name, selected.baseDataset);
-      }, [branchesList]);
-
-    if (isBranchesLoading) {
-      return <StubSpinner />
-    }
-
-    return (
-      <>
-        {elements.breadcrumbs}
-        <SectionTitle tag="h1" level={1} text="Create branch" className={classes.title}>
-          <InstanceTabs
-            tab={TABS_INDEX.BRANCHES}
-            isPlatform={isPlatform}
-            instanceId={instanceId}
-            hasLogs={api.initWS !== undefined}
-            hideInstanceTabs={hideBranchingFeatures}
-          />
-        </SectionTitle>
-        <div className={classes.wrapper}>
-          <div className={classes.container}>
-            {(snapshotsError || getBranchesError) && (
-              <div className={classes.marginTop}>
-                <ErrorStub
-                  message={snapshotsError?.message || getBranchesError?.message}
-                />
-              </div>
-            )}
-            <div className={classes.form}>
-              <TextField
-                label="Branch name"
-                variant="outlined"
-                required
-                fullWidth
-                size="small"
-                InputLabelProps={{
-                  shrink: true,
-                }}
-                value={formik.values.branchName}
-                error={Boolean(formik.errors.branchName)}
-                helperText={formik.errors.branchName}
-                className={classes.marginBottom}
-                onChange={(e) =>
-                  formik.setFieldValue('branchName', e.target.value)
-                }
-              />
-              <p className={cn(classes.marginTop, classes.marginBottom)}>
-                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.
-              </p>
-              <Select
-                fullWidth
-                label="Parent branch"
-                value={selectedBranchKey}
-                disabled={!branchesList || formik.isSubmitting}
-                onChange={handleParentBranchChange}
-                error={Boolean(formik.errors.baseBranch)}
-                items={
-                  branchesList
-                    ? branchesList.map((branch) => {
-                        const displayName = branch.baseDataset
-                          ? `${branch.name} (${branch.baseDataset})`
-                          : branch.name
-                        const compositeValue = `${branch.name}|${branch.baseDataset || ''}`
-                        return {
-                          value: compositeValue,
-                          children: displayName,
-                        }
-                      })
-                    : []
-                }
-              />
-              <strong>Snapshot ID</strong>
-              <p className={cn(classes.marginTop, classes.marginBottom)}>
-                Choose an existing snapshot. This snapshot will be memorized as
-                a forking point for the new branch; it cannot be deleted while
-                the branch exists.
-              </p>
-              <Select
-                fullWidth
-                className={classes.marginBottom2x}
-                label="Snapshot ID"
-                value={formik.values.snapshotID}
-                disabled={!branchesList || formik.isSubmitting}
-                onChange={(e) =>
-                  formik.setFieldValue('snapshotID', e.target.value)
-                }
-                error={Boolean(formik.errors.baseBranch)}
-                items={
-                  branchSnapshots
-                    ? branchSnapshots.map((snapshot, i) => {
-                        const isLatest = i === 0
-                        return {
-                          value: snapshot.id,
-                          children: (
-                            <div>
-                              <strong className={classes.snapshotOverflow}>
-                                {snapshot?.id} {isLatest && <span>Latest</span>}
-                              </strong>
-                              {snapshot?.dataStateAt && (
-                                <p>Data state at: {snapshot?.dataStateAt}</p>
-                              )}
-                            </div>
-                          ),
-                        }
-                      })
-                    : []
-                }
-              />
-              <Button
-                variant="primary"
-                size="medium"
-                className={classes.marginTop}
-                onClick={formik.submitForm}
-              >
-                Create branch
-                {isCreatingBranch && (
-                  <Spinner size="sm" className={classes.spinner} />
-                )}
-              </Button>
-              {createBranchError && (
-                <ResponseMessage type={'error'} message={createBranchError} />
-              )}
-            </div>
-          </div>{' '}
-          <div className={classes.snippetContainer}>
-            <SectionTitle tag="h1" level={1} text="The same using CLI" />
-            <p className={classes.marginTop}>
-              Alternatively, you can create a new branch using CLI. Fill the
-              form, copy the command below and paste it into your terminal.
-            </p>
-            <SyntaxHighlight
-              content={getCliCreateBranchCommand(
-                formik.values.branchName,
-                formik.values.baseBranch,
-              )}
-            />
-            <SectionTitle
-              className={classes.marginTop}
-              tag="h2"
-              level={2}
-              text={'Get branches using CLI'}
-            />
-            <p className={classes.marginTop}>
-              You can get a list of all branches using CLI. Copy the command
-              below and paste it into your terminal.
-            </p>
-            <SyntaxHighlight content={getCliBranchListCommand()} />
-          </div>
-        </div>
-      </>
-    )
-  },
-)

package/pages/CreateBranch/stores/Main.ts

@@ -1,99 +0,0 @@
-/*--------------------------------------------------------------------------
- * Copyright (c) 2019-2021, Postgres.ai, Nikolay Samokhvalov nik@postgres.ai
- * All Rights Reserved. Proprietary and confidential.
- * Unauthorized copying of this file, via any medium is strictly prohibited
- *--------------------------------------------------------------------------
- */
-
-import { makeAutoObservable } from 'mobx'
-
-import { GetBranches } from '@postgres.ai/shared/types/api/endpoints/getBranches'
-import {
-  CreateBranch,
-  CreateBranchFormValues,
-} from '@postgres.ai/shared/types/api/endpoints/createBranch'
-import { Branch } from '@postgres.ai/shared/types/api/endpoints/getBranches'
-import { GetSnapshots } from '@postgres.ai/shared/types/api/endpoints/getSnapshots'
-import { InitWS } from '@postgres.ai/shared/types/api/endpoints/initWS'
-
-type Error = {
-  title?: string
-  message: string
-}
-
-export type MainStoreApi = {
-  getBranches: GetBranches
-  createBranch: CreateBranch
-  getSnapshots: GetSnapshots
-  initWS?: InitWS
-}
-
-export class MainStore {
-  snapshotsError: Error | null = null
-  getBranchesError: Error | null = null
-  createBranchError: string | null = null
-
-  isBranchesLoading = false
-  isCreatingBranch = false
-
-  branchesList: Branch[] = []
-  private readonly api: MainStoreApi
-
-  constructor(api: MainStoreApi) {
-    this.api = api
-    makeAutoObservable(this)
-  }
-
-  load = async (instanceId: string) => {
-    await this.getBranches(instanceId).then((response) => {
-      if (response) {
-        this.branchesList = response
-      }
-    })
-  }
-
-  createBranch = async (values: CreateBranchFormValues) => {
-    if (!this.api.createBranch) return
-
-    this.isCreatingBranch = true
-    this.createBranchError = null
-
-    const { response, error } = await this.api.createBranch(values)
-
-    this.isCreatingBranch = false
-
-    if (error)
-      this.createBranchError = await error.json().then((err) => err.details)
-
-    return response
-  }
-
-  getBranches = async (instanceId: string) => {
-    if (!this.api.getBranches) return
-    this.isBranchesLoading = true
-
-    const { response, error } = await this.api.getBranches(instanceId)
-
-    this.isBranchesLoading = false
-
-    if (error) this.getBranchesError = await error.json().then((err) => err)
-
-    return response
-  }
-
-  getSnapshots = async (instanceId: string, branchName?: string, dataset?: string) => {
-    if (!this.api.getSnapshots) return
-
-    const { response, error } = await this.api.getSnapshots({
-      instanceId,
-      branchName,
-      dataset,
-    })
-
-    if (error) {
-      this.snapshotsError = await error.json().then((err) => err)
-    }
-
-    return response
-  }
-}

package/pages/CreateBranch/useCreatedStores.ts

@@ -1,11 +0,0 @@
-import { useMemo } from 'react'
-
-import { MainStore, MainStoreApi } from './stores/Main'
-
-export const useCreatedStores = (api: MainStoreApi) => ({
-  main: useMemo(() => new MainStore(api), []),
-})
-
-export type Stores = ReturnType<typeof useCreatedStores>
-
-export type { MainStoreApi }