Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 170eb80

Browse filesBrowse files
agneumagneum
committed
Merge branch 'fix/clone-creating-incorrect-data' into 'master'
fix(shared): clone creating data; correct status detection - redirect after create (#326) See merge request postgres-ai/database-lab!449
2 parents 78c503b + fefb1fc commit 170eb80
Copy full SHA for 170eb80

File tree

7 files changed

+307
-223
lines changed
Filter options

7 files changed

+307
-223
lines changed

‎ui/packages/ce/src/App/Instance/Clones/CreateClone/index.tsx

Copy file name to clipboardExpand all lines: ui/packages/ce/src/App/Instance/Clones/CreateClone/index.tsx
+2Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { ROUTES } from 'config/routes'
66
import { getInstance } from 'api/instances/getInstance'
77
import { getSnapshots } from 'api/snapshots/getSnapshots'
88
import { createClone } from 'api/clones/createClone'
9+
import { getClone } from 'api/clones/getClone'
910

1011
export const CreateClone = () => {
1112
const routes = {
@@ -17,6 +18,7 @@ export const CreateClone = () => {
1718
getSnapshots,
1819
getInstance,
1920
createClone,
21+
getClone,
2022
}
2123

2224
const elements = {

‎ui/packages/platform/src/pages/CreateClone/index.tsx

Copy file name to clipboardExpand all lines: ui/packages/platform/src/pages/CreateClone/index.tsx
+2Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { ROUTES } from 'config/routes'
66
import { getInstance } from 'api/instances/getInstance'
77
import { getSnapshots } from 'api/snapshots/getSnapshots'
88
import { createClone } from 'api/clones/createClone'
9+
import { getClone } from 'api/clones/getClone'
910
import ConsoleBreadcrumbs from 'components/ConsoleBreadcrumbs'
1011

1112
type Params = {
@@ -36,6 +37,7 @@ export const CreateClone = () => {
3637
getSnapshots,
3738
getInstance,
3839
createClone,
40+
getClone,
3941
}
4042

4143
const elements = {

‎ui/packages/shared/pages/Clone/index.tsx

Copy file name to clipboardExpand all lines: ui/packages/shared/pages/Clone/index.tsx
+143-128Lines changed: 143 additions & 128 deletions
Original file line numberDiff line numberDiff line change
@@ -180,9 +180,7 @@ export const Clone = observer((props: Props) => {
180180
const headRendered = (
181181
<>
182182
{/* //TODO(Anton): make global reset styles. */}
183-
<style>
184-
{'p { margin: 0;}'}
185-
</style>
183+
<style>{'p { margin: 0;}'}</style>
186184

187185
{props.elements.breadcrumbs}
188186

@@ -259,6 +257,9 @@ export const Clone = observer((props: Props) => {
259257
const jdbcConnectionStr = getJdbcConnectionStr(clone)
260258
const psqlConnectionStr = getPsqlConnectionStr(clone)
261259

260+
const hasConnectionInfo =
261+
sshPortForwardingUrl || jdbcConnectionStr || psqlConnectionStr
262+
262263
// Controls.
263264
const isDisabledControls =
264265
isResettingClone ||
@@ -307,9 +308,7 @@ export const Clone = observer((props: Props) => {
307308
className={classes.actionButton}
308309
>
309310
Reload info
310-
{isReloading && (
311-
<Spinner size="sm" className={classes.spinner} />
312-
)}
311+
{isReloading && <Spinner size="sm" className={classes.spinner} />}
313312
</Button>
314313
</div>
315314

@@ -405,139 +404,155 @@ export const Clone = observer((props: Props) => {
405404
<span className={classes.paramTitle}>
406405
Physical data diff size:
407406
</span>
408-
{formatBytesIEC(clone.metadata.cloneDiffSize)}
407+
{clone.metadata.cloneDiffSize
408+
? formatBytesIEC(clone.metadata.cloneDiffSize)
409+
: '-'}
409410
</p>
410411

411412
<p className={classes.text}>
412413
<span className={classes.paramTitle}>Clone creation time:</span>
413-
{round(clone.metadata.cloningTime, 2)} s
414+
{clone.metadata.cloningTime
415+
? `${round(clone.metadata.cloningTime, 2)} s`
416+
: '-'}
414417
</p>
415418
</div>
416419

417420
<br />
418421

419-
<p>
420-
<strong>Connection info</strong>
421-
</p>
422-
423-
{sshPortForwardingUrl && (
424-
<div className={classes.fieldBlock}>
425-
In a separate console, set up SSH port forwarding (and keep it
426-
running):
427-
<div className={classes.copyFieldContainer}>
428-
<TextField
429-
variant="outlined"
430-
label="SSH port forwarding"
431-
value={sshPortForwardingUrl}
432-
className={classes.textField}
433-
margin="normal"
434-
fullWidth
435-
// @ts-ignore
436-
readOnly
437-
InputLabelProps={{
438-
shrink: true,
439-
style: styles.inputFieldLabel,
440-
}}
441-
FormHelperTextProps={{
442-
style: styles.inputFieldHelper,
443-
}}
444-
/>
445-
<IconButton
446-
className={classes.copyButton}
447-
aria-label="Copy"
448-
onClick={() => copyToClipboard(sshPortForwardingUrl)}
449-
>
450-
{icons.copyIcon}
451-
</IconButton>
452-
</div>
453-
</div>
422+
{hasConnectionInfo && (
423+
<>
424+
<p>
425+
<strong>Connection info</strong>
426+
</p>
427+
428+
{sshPortForwardingUrl && (
429+
<div className={classes.fieldBlock}>
430+
In a separate console, set up SSH port forwarding (and keep it
431+
running):
432+
<div className={classes.copyFieldContainer}>
433+
<TextField
434+
variant="outlined"
435+
label="SSH port forwarding"
436+
value={sshPortForwardingUrl}
437+
className={classes.textField}
438+
margin="normal"
439+
fullWidth
440+
// @ts-ignore
441+
readOnly
442+
InputLabelProps={{
443+
shrink: true,
444+
style: styles.inputFieldLabel,
445+
}}
446+
FormHelperTextProps={{
447+
style: styles.inputFieldHelper,
448+
}}
449+
/>
450+
<IconButton
451+
className={classes.copyButton}
452+
aria-label="Copy"
453+
onClick={() => copyToClipboard(sshPortForwardingUrl)}
454+
>
455+
{icons.copyIcon}
456+
</IconButton>
457+
</div>
458+
</div>
459+
)}
460+
461+
{psqlConnectionStr && (
462+
<div className={classes.fieldBlock}>
463+
<div className={classes.copyFieldContainer}>
464+
<TextField
465+
variant="outlined"
466+
id="psqlConnStr"
467+
label="psql connection string"
468+
value={psqlConnectionStr}
469+
className={classes.textField}
470+
margin="normal"
471+
fullWidth
472+
// @ts-ignore
473+
readOnly
474+
InputLabelProps={{
475+
shrink: true,
476+
style: styles.inputFieldLabel,
477+
}}
478+
FormHelperTextProps={{
479+
style: styles.inputFieldHelper,
480+
}}
481+
/>
482+
<IconButton
483+
className={classes.copyButton}
484+
aria-label="Copy"
485+
onClick={() => copyToClipboard(psqlConnectionStr)}
486+
>
487+
{icons.copyIcon}
488+
</IconButton>
489+
</div>
490+
&nbsp;
491+
<Tooltip
492+
content={
493+
<>
494+
Used to connect to Postgres using psql. Change DBNAME
495+
to&nbsp; name of the database you want to connect. Use
496+
PGPASSWORD&nbsp; environment variable to set database
497+
password or type&nbsp; it when prompted.
498+
</>
499+
}
500+
>
501+
<span className={classes.textFieldInfo}>
502+
{icons.infoIcon}
503+
</span>
504+
</Tooltip>
505+
</div>
506+
)}
507+
508+
{jdbcConnectionStr && (
509+
<div className={classes.fieldBlock}>
510+
<div className={classes.copyFieldContainer}>
511+
<TextField
512+
variant="outlined"
513+
label="JDBC connection string"
514+
value={jdbcConnectionStr}
515+
className={classes.textField}
516+
margin="normal"
517+
fullWidth
518+
// @ts-ignore
519+
readOnly
520+
InputLabelProps={{
521+
shrink: true,
522+
style: styles.inputFieldLabel,
523+
}}
524+
FormHelperTextProps={{
525+
style: styles.inputFieldHelper,
526+
}}
527+
/>
528+
<IconButton
529+
className={classes.copyButton}
530+
aria-label="Copy"
531+
onClick={() => copyToClipboard(jdbcConnectionStr)}
532+
>
533+
{icons.copyIcon}
534+
</IconButton>
535+
</div>
536+
&nbsp;
537+
<Tooltip
538+
content={
539+
<>
540+
Used to connect to Postgres using JDBC. Change DBNAME
541+
to&nbsp; name of the database you want to connect,
542+
change DBPASSWORD&nbsp; to the password you’ve used on
543+
clone creation.
544+
</>
545+
}
546+
>
547+
<span className={classes.textFieldInfo}>
548+
{icons.infoIcon}
549+
</span>
550+
</Tooltip>
551+
</div>
552+
)}
553+
</>
454554
)}
455555

456-
<div className={classes.fieldBlock}>
457-
<div className={classes.copyFieldContainer}>
458-
<TextField
459-
variant="outlined"
460-
id="psqlConnStr"
461-
label="psql connection string"
462-
value={psqlConnectionStr}
463-
className={classes.textField}
464-
margin="normal"
465-
fullWidth
466-
// @ts-ignore
467-
readOnly
468-
InputLabelProps={{
469-
shrink: true,
470-
style: styles.inputFieldLabel,
471-
}}
472-
FormHelperTextProps={{
473-
style: styles.inputFieldHelper,
474-
}}
475-
/>
476-
<IconButton
477-
className={classes.copyButton}
478-
aria-label="Copy"
479-
onClick={() => copyToClipboard(psqlConnectionStr)}
480-
>
481-
{icons.copyIcon}
482-
</IconButton>
483-
</div>
484-
&nbsp;
485-
<Tooltip
486-
content={
487-
<>
488-
Used to connect to Postgres using psql. Change DBNAME to&nbsp;
489-
name of the database you want to connect. Use PGPASSWORD&nbsp;
490-
environment variable to set database password or type&nbsp; it
491-
when prompted.
492-
</>
493-
}
494-
>
495-
<span className={classes.textFieldInfo}>{icons.infoIcon}</span>
496-
</Tooltip>
497-
</div>
498-
499-
<div className={classes.fieldBlock}>
500-
<div className={classes.copyFieldContainer}>
501-
<TextField
502-
variant="outlined"
503-
label="JDBC connection string"
504-
value={jdbcConnectionStr}
505-
className={classes.textField}
506-
margin="normal"
507-
fullWidth
508-
// @ts-ignore
509-
readOnly
510-
InputLabelProps={{
511-
shrink: true,
512-
style: styles.inputFieldLabel,
513-
}}
514-
FormHelperTextProps={{
515-
style: styles.inputFieldHelper,
516-
}}
517-
/>
518-
<IconButton
519-
className={classes.copyButton}
520-
aria-label="Copy"
521-
onClick={() => copyToClipboard(jdbcConnectionStr)}
522-
>
523-
{icons.copyIcon}
524-
</IconButton>
525-
</div>
526-
&nbsp;
527-
<Tooltip
528-
content={
529-
<>
530-
Used to connect to Postgres using JDBC. Change DBNAME to&nbsp;
531-
name of the database you want to connect, change
532-
DBPASSWORD&nbsp; to the password you’ve used on clone
533-
creation.
534-
</>
535-
}
536-
>
537-
<span className={classes.textFieldInfo}>{icons.infoIcon}</span>
538-
</Tooltip>
539-
</div>
540-
541556
<br />
542557

543558
<div className={classes.fieldBlock}>

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.