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
Sign up
Appearance settings

Commit 0c92529

Browse files
committed
Merge branch '475-custom-options-for-dle' into 'master'
feat (ui) add additional fields with customOptions in DLE (#475) Closes #475 See merge request postgres-ai/database-lab!661
2 parents b8c5e93 + 4407cea commit 0c92529

File tree

10 files changed

+297
-80
lines changed

10 files changed

+297
-80
lines changed

‎ui/packages/ce/src/api/configs/updateConfig.ts‎

Lines changed: 10 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,7 @@
1-
import { postUniqueDatabases } from '@postgres.ai/shared/pages/Configuration/utils'
1+
import {
2+
postUniqueCustomOptions,
3+
postUniqueDatabases,
4+
} from '@postgres.ai/shared/pages/Configuration/utils'
25
import { Config } from '@postgres.ai/shared/types/api/entities/config'
36
import { request } from 'helpers/request'
47

@@ -26,7 +29,8 @@ export const updateConfig = async (req: Config) => {
2629
logicalDump: {
2730
options: {
2831
databases: postUniqueDatabases(req.databases),
29-
parallelJobs: req.pg_dump,
32+
customOptions: postUniqueCustomOptions(req.pgDumpCustomOptions),
33+
parallelJobs: req.dumpParallelJobs,
3034
source: {
3135
connection: {
3236
dbname: req.dbname,
@@ -40,7 +44,10 @@ export const updateConfig = async (req: Config) => {
4044
},
4145
logicalRestore: {
4246
options: {
43-
parallelJobs: req.pg_restore,
47+
customOptions: postUniqueCustomOptions(
48+
req.pgRestoreCustomOptions,
49+
),
50+
parallelJobs: req.restoreParallelJobs,
4451
},
4552
},
4653
},

‎ui/packages/shared/pages/Configuration/InputWithTooltip/index.tsx‎

Lines changed: 13 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { Select } from '@postgres.ai/shared/components/Select'
66
import { InfoIcon } from '@postgres.ai/shared/icons/Info'
77
import { Tooltip } from '@postgres.ai/shared/components/Tooltip'
88

9-
import { uniqueDatabases } from '../utils'
9+
import { uniqueChipValue } from '../utils'
1010

1111
import styles from '../styles.module.scss'
1212

@@ -74,14 +74,15 @@ export const InputWithChip = ({
7474
onChange,
7575
tooltipText,
7676
disabled,
77-
handleDeleteDatabase,
77+
handleDeleteChip,
7878
}: {
7979
value: string
8080
onChange: (e: React.ChangeEvent<HTMLInputElement>) => void
8181
tooltipText: () => React.ReactNode
82-
handleDeleteDatabase: (
82+
handleDeleteChip: (
8383
event: React.FormEvent<HTMLInputElement>,
84-
database: string,
84+
uniqueValue: string,
85+
label: string
8586
) => void
8687
label: string
8788
id: string
@@ -115,19 +116,21 @@ export const InputWithChip = ({
115116
<InfoIcon className={styles.infoIcon} />
116117
</Tooltip>
117118
</Box>
118-
<div>
119+
<divclassName={styles.chipContainer}>
119120
{value &&
120-
uniqueDatabases(value)
121+
uniqueChipValue(value)
121122
.split(' ')
122-
.map((database, index) => {
123-
if (database !== '') {
123+
.map((uniqueValue, index) => {
124+
if (uniqueValue !== '') {
124125
return (
125126
<Chip
126127
key={index}
127128
className={styles.chip}
128-
label={database}
129+
label={uniqueValue}
129130
disabled={disabled}
130-
onDelete={(event) => handleDeleteDatabase(event, database)}
131+
onDelete={(event) =>
132+
handleDeleteChip(event, uniqueValue, id)
133+
}
131134
color="primary"
132135
/>
133136
)
Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
export const dockerImageOptions = [
2+
{
3+
name: 'Generic Postgres (postgresai/extended-postgres)',
4+
type: 'Generic Postgres',
5+
},
6+
{ name: 'Generic Postgres with PostGIS', type: 'postgis' },
7+
{ name: 'Amazon RDS for Postgres', type: 'rds' },
8+
{ name: 'Amazon RDS Aurora for Postgres', type: 'rdsAurora' },
9+
{ name: 'Heroku Postgres', type: 'heroku' },
10+
{ name: 'Supabase Postgres', type: 'supabase' },
11+
{ name: 'Custom image', type: 'custom' },
12+
]
13+
14+
export const defaultPgDumpOptions = [
15+
{
16+
optionType: 'Generic Postgres',
17+
addDefaultOptions: [],
18+
},
19+
{
20+
optionType: 'postgis',
21+
addDefaultOptions: [],
22+
},
23+
{
24+
optionType: 'rds',
25+
addDefaultOptions: [],
26+
},
27+
{
28+
optionType: 'rdsAurora',
29+
addDefaultOptions: [],
30+
},
31+
{
32+
optionType: 'heroku',
33+
addDefaultOptions: [],
34+
},
35+
{
36+
optionType: 'supabase',
37+
addDefaultOptions: [],
38+
},
39+
]
40+
41+
export const defaultPgRestoreOptions = [
42+
{
43+
optionType: 'Generic Postgres',
44+
addDefaultOptions: [],
45+
},
46+
{
47+
optionType: 'postgis',
48+
addDefaultOptions: [],
49+
},
50+
{
51+
optionType: 'rds',
52+
addDefaultOptions: ['---exclude-schema=awsdms'],
53+
},
54+
{
55+
optionType: 'rdsAurora',
56+
addDefaultOptions: ['---exclude-schema=awsdms'],
57+
},
58+
{
59+
optionType: 'heroku',
60+
addDefaultOptions: [],
61+
},
62+
{
63+
optionType: 'supabase',
64+
addDefaultOptions: [],
65+
},
66+
]

‎ui/packages/shared/pages/Configuration/imageOptions.ts‎

Lines changed: 0 additions & 12 deletions
This file was deleted.

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

Lines changed: 108 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -29,8 +29,12 @@ import { tooltipText } from './tooltipText'
2929
import { FormValues, useForm } from './useForm'
3030
import { ResponseMessage } from './ResponseMessage'
3131
import { ConfigSectionTitle, Header, ModalTitle } from './Header'
32-
import { imageOptions } from './imageOptions'
33-
import { formatDockerImageArray, uniqueDatabases } from './utils'
32+
import {
33+
dockerImageOptions,
34+
defaultPgDumpOptions,
35+
defaultPgRestoreOptions,
36+
} from './configOptions'
37+
import { formatDockerImageArray, FormValuesKey, uniqueChipValue } from './utils'
3438
import {
3539
SelectWithTooltip,
3640
InputWithChip,
@@ -39,6 +43,11 @@ import {
3943

4044
import styles from './styles.module.scss'
4145

46+
type PgOptionsType = {
47+
optionType: string
48+
addDefaultOptions: string[]
49+
}
50+
4251
const NON_LOGICAL_RETRIEVAL_MESSAGE =
4352
'Configuration editing is only available in logical mode'
4453
const PREVENT_MODIFYING_MESSAGE = 'Editing is disabled by admin'
@@ -149,34 +158,77 @@ export const Configuration = observer(
149158
setIsModalOpen(true)
150159
}
151160

152-
const handleDeleteDatabase = (
161+
const handleDeleteChip = (
153162
_: React.FormEvent<HTMLInputElement>,
154-
database: string,
163+
uniqueValue: string,
164+
id: string,
155165
) => {
156-
if (formik.values.databases) {
157-
let currentDatabases = uniqueDatabases(formik.values.databases)
158-
let curDividers = formik.values.databases.match(
166+
if (formik.values[id as FormValuesKey]) {
167+
let newValues = ''
168+
const currentValues = uniqueChipValue(
169+
String(formik.values[id as FormValuesKey]),
170+
)
171+
const splitValues = currentValues.split(' ')
172+
const curDividers = String(formik.values[id as FormValuesKey]).match(
159173
/[,(\s)(\n)(\r)(\t)(\r\n)]/gm,
160174
)
161-
let newDatabases = ''
162-
let splitDatabases = currentDatabases.split(' ')
163-
for (let i in splitDatabases) {
164-
if (curDividers && splitDatabases[i] !== database) {
165-
newDatabases =
166-
newDatabases +
167-
splitDatabases[i] +
175+
for (let i in splitValues) {
176+
if (curDividers && splitValues[i] !== uniqueValue) {
177+
newValues =
178+
newValues +
179+
splitValues[i] +
168180
(curDividers[i] ? curDividers[i] : '')
169181
}
170182
}
171-
formik.setFieldValue('databases',newDatabases)
183+
formik.setFieldValue(id,newValues)
172184
}
173185
}
174186

187+
const handleSelectPgOptions = (
188+
e: React.ChangeEvent<HTMLInputElement>,
189+
formikName: string,
190+
formikValue: string,
191+
initialValue: string | undefined,
192+
pgOptions: PgOptionsType[],
193+
) => {
194+
let pgValue = formikValue
195+
// set initial value on change
196+
formik.setFieldValue(formikName, initialValue)
197+
198+
const selectedPgOptions = pgOptions.filter(
199+
(pg) => e.target.value === pg.optionType,
200+
)
201+
202+
// add options to formik field
203+
selectedPgOptions.forEach((pg) => {
204+
pg.addDefaultOptions.forEach((addOption) => {
205+
if (!pgValue.includes(addOption)) {
206+
const addOptionWithSpace = addOption + ' '
207+
formik.setFieldValue(formikName, (pgValue += addOptionWithSpace))
208+
}
209+
})
210+
})
211+
}
212+
175213
const handleDockerImageSelect = (
176214
e: React.ChangeEvent<HTMLInputElement>,
177215
) => {
178216
const newDockerImages = formatDockerImageArray(e.target.value)
179217
setDockerImages(newDockerImages)
218+
handleSelectPgOptions(
219+
e,
220+
'pgDumpCustomOptions',
221+
formik.values.pgDumpCustomOptions,
222+
configData?.pgDumpCustomOptions,
223+
defaultPgDumpOptions,
224+
)
225+
handleSelectPgOptions(
226+
e,
227+
'pgRestoreCustomOptions',
228+
formik.values.pgRestoreCustomOptions,
229+
configData?.pgRestoreCustomOptions,
230+
defaultPgRestoreOptions,
231+
)
180232
formik.setFieldValue('dockerImageType', e.target.value)
181233

182234
// select latest Postgres version on dockerImage change
@@ -206,7 +258,7 @@ export const Configuration = observer(
206258
setConnectionRes(null)
207259
setSubmitMessage(null)
208260
getEngine().then((res) => {
209-
setDledition(res?.edition)
261+
setDledition(String(res?.edition))
210262
})
211263
}, [])
212264

@@ -265,7 +317,7 @@ export const Configuration = observer(
265317
error={Boolean(formik.errors.dockerImageType)}
266318
tooltipText={tooltipText.dockerImageType}
267319
disabled={isConfigurationDisabled}
268-
items={imageOptions.map((image) => {
320+
items={dockerImageOptions.map((image) => {
269321
return {
270322
value: image.type,
271323
children: image.name,
@@ -420,7 +472,7 @@ export const Configuration = observer(
420472
label="Databases"
421473
id="databases"
422474
tooltipText={tooltipText.databases}
423-
handleDeleteDatabase={handleDeleteDatabase}
475+
handleDeleteChip={handleDeleteChip}
424476
disabled={isConfigurationDisabled}
425477
onChange={(e) =>
426478
formik.setFieldValue('databases', e.target.value)
@@ -451,22 +503,54 @@ export const Configuration = observer(
451503
</Box>
452504
<InputWithTooltip
453505
label="pg_dump jobs"
454-
value={formik.values.pg_dump}
455-
tooltipText={tooltipText.pg_dump}
506+
value={formik.values.dumpParallelJobs}
507+
tooltipText={tooltipText.dumpParallelJobs}
456508
disabled={isConfigurationDisabled}
457509
onChange={(e) =>
458-
formik.setFieldValue('pg_dump', e.target.value)
510+
formik.setFieldValue('dumpParallelJobs', e.target.value)
459511
}
460512
/>
461513
<InputWithTooltip
462514
label="pg_restore jobs"
463-
value={formik.values.pg_restore}
464-
tooltipText={tooltipText.pg_restore}
515+
value={formik.values.restoreParallelJobs}
516+
tooltipText={tooltipText.restoreParallelJobs}
465517
disabled={isConfigurationDisabled}
466518
onChange={(e) =>
467-
formik.setFieldValue('pg_restore', e.target.value)
519+
formik.setFieldValue('restoreParallelJobs', e.target.value)
468520
}
469521
/>
522+
{dleEdition !== 'community' && (
523+
<>
524+
<InputWithChip
525+
value={formik.values.pgDumpCustomOptions}
526+
label="pg_dump customOptions"
527+
id="pgDumpCustomOptions"
528+
tooltipText={tooltipText.pgDumpCustomOptions}
529+
handleDeleteChip={handleDeleteChip}
530+
disabled={isConfigurationDisabled}
531+
onChange={(e) =>
532+
formik.setFieldValue(
533+
'pgDumpCustomOptions',
534+
e.target.value,
535+
)
536+
}
537+
/>
538+
<InputWithChip
539+
value={formik.values.pgRestoreCustomOptions}
540+
label="pg_restore customOptions"
541+
id="pgRestoreCustomOptions"
542+
tooltipText={tooltipText.pgRestoreCustomOptions}
543+
handleDeleteChip={handleDeleteChip}
544+
disabled={isConfigurationDisabled}
545+
onChange={(e) =>
546+
formik.setFieldValue(
547+
'pgRestoreCustomOptions',
548+
e.target.value,
549+
)
550+
}
551+
/>
552+
</>
553+
)}
470554
<Box>
471555
<Typography className={styles.subsection}>
472556
Subsection "retrieval.refresh"

‎ui/packages/shared/pages/Configuration/styles.module.scss‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@
1818
}
1919
}
2020

21+
.chipContainer {
22+
width: 350px;
23+
max-width: 100%;
24+
margin-bottom: 1.25rem;
25+
}
26+
2127
.databasesContainer {
2228
width: 350px;
2329
max-width: 100%;

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /