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 e09a7af

Browse files
committed
Merge branch 'oauth-fields-and-edit-page-for-projects' into 'master'
feat(ui): oauth checkboxes, edit form for instances See merge request postgres-ai/database-lab!703
2 parents 9228c4b + bca05e7 commit e09a7af

File tree

10 files changed

+296
-17
lines changed

10 files changed

+296
-17
lines changed

‎ui/packages/platform/src/actions/actions.js‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -61,6 +61,7 @@ const Actions = Reflux.createActions([{
6161
refresh: {},
6262
getDbLabInstances: ASYNC_ACTION,
6363
addDbLabInstance: ASYNC_ACTION,
64+
editDbLabInstance: ASYNC_ACTION,
6465
destroyDbLabInstance: ASYNC_ACTION,
6566
resetNewDbLabInstance: {},
6667
getDbLabInstanceStatus: ASYNC_ACTION,
@@ -772,6 +773,43 @@ Actions.addDbLabInstance.listen(function (token, instanceData) {
772773
});
773774
});
774775

776+
Actions.editDbLabInstance.listen(function (token, instanceData) {
777+
let action = this;
778+
779+
if (!api) {
780+
settings.init(function () {
781+
api = new Api(settings);
782+
});
783+
}
784+
785+
action.progressed();
786+
787+
timeoutPromise(REQUEST_TIMEOUT, api.editDbLabInstance(token, instanceData))
788+
.then(result => {
789+
result.json()
790+
.then(json => {
791+
if (json) {
792+
action.completed(
793+
{ data: json, orgId: instanceData.orgId, project: instanceData.project });
794+
} else {
795+
action.failed(new Error('wrong_reply'));
796+
}
797+
})
798+
.catch(err => {
799+
console.error(err);
800+
action.failed(new Error('wrong_reply'));
801+
});
802+
})
803+
.catch(err => {
804+
console.error(err);
805+
if (err && err.message && err.message === 'timeout') {
806+
action.failed(new Error('failed_fetch'));
807+
} else {
808+
action.failed(new Error('wrong_reply'));
809+
}
810+
});
811+
});
812+
775813
Actions.destroyDbLabInstance.listen(function (token, instanceId) {
776814
let action = this;
777815

‎ui/packages/platform/src/api/api.js‎

Lines changed: 36 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ function encodeData(data) {
1717
class Api {
1818
constructor(setting) {
1919
this.server = setting.server;
20-
this.apiServer = setting.apiServer;
20+
this.apiServer = setting.apiServer
2121
}
2222

2323
get(url, query, options) {
@@ -382,6 +382,22 @@ class Api {
382382
params.onboarding_text = orgData.onboarding_text;
383383
}
384384

385+
if (typeof orgData.oauth_allow_google !== 'undefined') {
386+
params.oauth_allow_google = orgData.oauth_allow_google;
387+
}
388+
389+
if (typeof orgData.oauth_allow_linkedin !== 'undefined') {
390+
params.oauth_allow_linkedin = orgData.oauth_allow_linkedin;
391+
}
392+
393+
if (typeof orgData.oauth_allow_github !== 'undefined') {
394+
params.oauth_allow_github = orgData.oauth_allow_github;
395+
}
396+
397+
if (typeof orgData.oauth_allow_gitlab !== 'undefined') {
398+
params.oauth_allow_gitlab = orgData.oauth_allow_gitlab;
399+
}
400+
385401
return this.patch(`${this.apiServer}/orgs?id=eq.` + orgId, params, {
386402
headers: headers
387403
});
@@ -488,6 +504,7 @@ class Api {
488504
org_id: instanceData.orgId,
489505
token: instanceData.instanceToken,
490506
project: instanceData.project,
507+
project_label: instanceData.projectLabel,
491508
use_tunnel: instanceData.useTunnel,
492509
ssh_server_url: instanceData.sshServerUrl
493510
};
@@ -497,6 +514,24 @@ class Api {
497514
});
498515
}
499516

517+
editDbLabInstance(token, instanceData) {
518+
let headers = {
519+
Authorization: 'Bearer ' + token,
520+
}
521+
let params = {
522+
instance_id: Number(instanceData.instanceId),
523+
project_name: instanceData.project,
524+
project_label: instanceData.projectLabel,
525+
use_tunnel: instanceData.useTunnel,
526+
ssh_server_url: instanceData.sshServerUrl,
527+
verify_token: instanceData.instanceToken,
528+
}
529+
530+
return this.post(`${this.apiServer}/rpc/dblab_instance_edit`, params, {
531+
headers: headers,
532+
})
533+
}
534+
500535
destroyDbLabInstance(token, instanceId) {
501536
let headers = {
502537
Authorization: 'Bearer ' + token

‎ui/packages/platform/src/components/DbLabInstanceForm/DbLabInstanceForm.tsx‎

Lines changed: 63 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,9 @@ interface DbLabInstanceFormState {
6565
url: string
6666
token: string | null
6767
useTunnel: boolean
68+
instanceID: string
6869
project: string
70+
project_label: string
6971
errorFields: string[]
7072
sshServerUrl: string
7173
}
@@ -78,7 +80,9 @@ class DbLabInstanceForm extends Component<
7880
url: 'https://',
7981
token: null,
8082
useTunnel: false,
83+
instanceID: '',
8184
project: this.props.project ? this.props.project : '',
85+
project_label: '',
8286
errorFields: [''],
8387
sshServerUrl: '',
8488
data: {
@@ -116,15 +120,28 @@ class DbLabInstanceForm extends Component<
116120
componentDidMount() {
117121
const that = this
118122
const { orgId } = this.props
123+
const url = window.location.href.split('/')
124+
const instanceID = url[url.length - 1]
119125

120126
this.unsubscribe = Store.listen(function () {
121-
that.setState({ data: this.data })
127+
that.setState({ data: this.data, instanceID: instanceID })
128+
122129
const auth = this.data && this.data.auth ? this.data.auth : null
123130
const projects =
124131
this.data && this.data.projects ? this.data.projects : null
125132
const dbLabInstances =
126133
this.data && this.data.dbLabInstances ? this.data.dbLabInstances : null
127134

135+
if (dbLabInstances.data) {
136+
that.setState({
137+
project_label: dbLabInstances.data[instanceID]?.project_label,
138+
token: dbLabInstances.data[instanceID]?.verify_token,
139+
useTunnel: dbLabInstances.data[instanceID]?.use_tunnel,
140+
url: dbLabInstances.data[instanceID]?.url,
141+
sshServerUrl: dbLabInstances.data[instanceID]?.ssh_server_url,
142+
})
143+
}
144+
128145
if (
129146
auth &&
130147
auth.token &&
@@ -188,9 +205,11 @@ class DbLabInstanceForm extends Component<
188205
this.state.token &&
189206
this.state.project
190207
) {
191-
Actions.addDbLabInstance(auth.token, {
208+
Actions[`${this.props.edit ? 'edit' : 'add'}DbLabInstance`](auth.token, {
192209
orgId: orgId,
193210
project: this.state.project,
211+
instanceId: this.props.edit ? this.state.instanceID : null,
212+
projectLabel: this.state.project_label,
194213
url: this.state.url,
195214
instanceToken: this.state.token,
196215
useTunnel: this.state.useTunnel,
@@ -260,15 +279,18 @@ class DbLabInstanceForm extends Component<
260279
{...this.props}
261280
breadcrumbs={[
262281
{ name: 'Database Lab Instances', url: 'instances' },
263-
{ name: 'Add instance' },
282+
{ name: this.props.edit ? 'Edit instance' : 'Add instance' },
264283
]}
265284
/>
266285
)
267286

268-
const pageTitle = <ConsolePageTitle title="Add instance" />
287+
const pageTitle = (
288+
<ConsolePageTitle
289+
title={this.props.edit ? 'Edit instance' : 'Add instance'}
290+
/>
291+
)
269292

270293
const permitted = !orgPermissions || orgPermissions.dblabInstanceCreate
271-
272294
const instancesLoaded = dbLabInstances && dbLabInstances.data
273295

274296
if (!projects || !projects.data || !instancesLoaded) {
@@ -299,7 +321,8 @@ class DbLabInstanceForm extends Component<
299321

300322
{!permitted && (
301323
<WarningWrapper>
302-
You do not have permission to add Database Lab instances.
324+
You do not have permission to {this.props.edit ? 'edit' : 'add'}{' '}
325+
Database Lab instances.
303326
</WarningWrapper>
304327
)}
305328

@@ -348,6 +371,38 @@ class DbLabInstanceForm extends Component<
348371
/>
349372
</div>
350373

374+
<div className={classes.fieldBlock}>
375+
<TextField
376+
disabled={!permitted}
377+
variant="outlined"
378+
id="project_label"
379+
label="Project label"
380+
value={this.state.project_label}
381+
className={classes.textField}
382+
onChange={(e) => {
383+
this.setState({
384+
project_label: e.target.value,
385+
})
386+
Actions.resetNewDbLabInstance()
387+
}}
388+
margin="normal"
389+
error={this.state.errorFields.indexOf('project_label') !== -1}
390+
fullWidth
391+
inputProps={{
392+
name: 'project_label',
393+
id: 'project_label',
394+
shrink: true,
395+
}}
396+
InputLabelProps={{
397+
shrink: true,
398+
style: styles.inputFieldLabel,
399+
}}
400+
FormHelperTextProps={{
401+
style: styles.inputFieldHelper,
402+
}}
403+
/>
404+
</div>
405+
351406
<div className={classes.fieldBlock}>
352407
<TextField
353408
disabled={!permitted}
@@ -458,6 +513,7 @@ class DbLabInstanceForm extends Component<
458513
<TextField
459514
variant="outlined"
460515
id="token"
516+
disabled={!permitted}
461517
label="SSH server URL"
462518
value={this.state.sshServerUrl}
463519
className={classes.textField}
@@ -528,7 +584,7 @@ class DbLabInstanceForm extends Component<
528584
disabled={isDataUpdating || !permitted}
529585
onClick={this.buttonHandler}
530586
>
531-
Add
587+
{this.props.edit ? 'Update' : 'Add'}
532588
</Button>
533589
&nbsp;&nbsp;
534590
<Button

‎ui/packages/platform/src/components/DbLabInstanceForm/DbLabInstanceFormWrapper.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import DbLabInstanceForm from 'components/DbLabInstanceForm/DbLabInstanceForm'
44
import { RouteComponentProps } from 'react-router'
55

66
export interface DbLabInstanceFormProps {
7+
edit?: boolean
78
orgId: number
89
project: string | undefined
910
history: RouteComponentProps['history']

‎ui/packages/platform/src/components/DbLabInstances/DbLabInstances.tsx‎

Lines changed: 30 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@ interface DbLabInstancesState {
6969
data: {
7070
[org: string]: {
7171
project_name: string
72+
project_label: string
7273
url: string
7374
use_tunnel: boolean
7475
isProcessing: boolean
@@ -207,7 +208,7 @@ class DbLabInstances extends Component<
207208
: null
208209

209210
if (anchorEl) {
210-
const instanceId = anchorEl.getAttribute('instanceid')
211+
const instanceId = anchorEl.getAttribute('aria-label')
211212
if (!instanceId) {
212213
return
213214
}
@@ -236,8 +237,7 @@ class DbLabInstances extends Component<
236237
/* eslint no-alert: 0 */
237238
if (
238239
window.confirm(
239-
'Are you sure you want to remove this' +
240-
' Database Lab instance?',
240+
'Are you sure you want to remove this Database Lab instance?',
241241
) === true
242242
) {
243243
Actions.destroyDbLabInstance(auth?.token, instanceId)
@@ -250,6 +250,16 @@ class DbLabInstances extends Component<
250250

251251
break
252252

253+
case 'editProject':
254+
this.props.history.push(
255+
Urls.linkDbLabInstanceEditProject(
256+
{ org: this.props.org, project: project },
257+
instanceId,
258+
),
259+
)
260+
261+
break
262+
253263
default:
254264
break
255265
}
@@ -322,7 +332,7 @@ class DbLabInstances extends Component<
322332
{projects.data.map((p) => {
323333
return (
324334
<MenuItem value={p.id} key={p.id}>
325-
{p.name}
335+
{p?.label||p.name}
326336
</MenuItem>
327337
)
328338
})}
@@ -401,7 +411,10 @@ class DbLabInstances extends Component<
401411
Clone multi-terabyte databases in seconds and use them to test your
402412
database migrations, optimize SQL, or deploy full-size staging apps.
403413
Start here to work with all Database Lab tools. Setup
404-
<GatewayLink href="https://postgres.ai/docs/database-lab" target="_blank">
414+
<GatewayLink
415+
href="https://postgres.ai/docs/database-lab"
416+
target="_blank"
417+
>
405418
documentation here
406419
</GatewayLink>
407420
.
@@ -438,7 +451,8 @@ class DbLabInstances extends Component<
438451
style={{ cursor: 'pointer' }}
439452
>
440453
<TableCell className={classes.cell}>
441-
{data.data[index].project_name}
454+
{data.data[index].project_label ||
455+
data.data[index].project_name}
442456
</TableCell>
443457

444458
<TableCell className={classes.cell}>
@@ -478,7 +492,7 @@ class DbLabInstances extends Component<
478492
<Spinner className={classes.inTableProgress} />
479493
) : null}
480494
<IconButton
481-
aria-label="more"
495+
aria-label={data.data[index].id}
482496
aria-controls="instance-menu"
483497
aria-haspopup="true"
484498
onClick={this.openMenu}
@@ -509,19 +523,26 @@ class DbLabInstances extends Component<
509523
>
510524
<MenuItem
511525
key={1}
526+
onClick={(event) => this.menuHandler(event, 'editProject')}
527+
disabled={!addPermitted}
528+
>
529+
Edit
530+
</MenuItem>
531+
<MenuItem
532+
key={2}
512533
onClick={(event) => this.menuHandler(event, 'addclone')}
513534
>
514535
Create clone
515536
</MenuItem>
516537
<MenuItem
517-
key={2}
538+
key={3}
518539
onClick={(event) => this.menuHandler(event, 'refresh')}
519540
>
520541
Refresh
521542
</MenuItem>
522543
<MenuItem
523544
disabled={!deletePermitted}
524-
key={3}
545+
key={4}
525546
onClick={(event) => this.menuHandler(event, 'destroy')}
526547
>
527548
Remove

0 commit comments

Comments
(0)

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