Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

allow URL type for router and build config #1001

Merged
merged 2 commits into from
Dec 20, 2023
Merged

allow URL type for router and build config #1001

Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
0c21f85
allow URL type for router and build config
miles-grant-ibigroup Nov 20, 2023
ea3409b
type corrections
miles-grant-ibigroup Nov 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
106 changes: 78 additions & 28 deletions lib/manager/components/deployment/CustomConfig.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
/* eslint-disable complexity */
// @flow

import Icon from '@conveyal/woonerf/components/icon'
Expand All @@ -10,10 +11,10 @@ import {
Radio
} from 'react-bootstrap'
import { LinkContainer } from 'react-router-bootstrap'
import validator from 'validator'

import * as deploymentActions from '../../actions/deployments'
import {isValidJSONC} from '../../../common/util/json'

import type {
Deployment
} from '../../../types'
Expand All @@ -30,6 +31,11 @@ const SAMPLE_ROUTER_CONFIG = `{
}
}`

const CONFIG_OPTIONS = {
custom: 'custom',
url: 'url'
}

export default class CustomConfig extends Component<{
deployment: Deployment,
label: string,
Expand All @@ -38,24 +44,49 @@ export default class CustomConfig extends Component<{
}, {[string]: any}> {
state = {}

_toggleCustomConfig = (evt: SyntheticInputEvent<HTMLInputElement>) => {
const {deployment, updateDeployment} = this.props
const {name} = evt.target
const value = deployment[name]
? null
: name === 'customBuildConfig'
? SAMPLE_BUILD_CONFIG
: SAMPLE_ROUTER_CONFIG
updateDeployment(deployment, {[name]: value})
getName = (option?: string) => {
let {name} = this.props
if (option === CONFIG_OPTIONS.url) {
name += 'Url'
}
return name
}

_onChangeConfig = (evt: SyntheticInputEvent<HTMLInputElement>) =>
this.setState({[this.props.name]: evt.target.value})

_onSaveConfig = () => {
_toggleCustomConfig = (evt: SyntheticInputEvent<HTMLInputElement>, option?: string) => {
const {deployment, name, updateDeployment} = this.props
let value = 'https://'
if (name === 'customBuildConfig' && option === CONFIG_OPTIONS.custom) value = deployment[name] || SAMPLE_BUILD_CONFIG
if (name === 'customRouterConfig' && option === CONFIG_OPTIONS.custom) value = deployment[name] || SAMPLE_ROUTER_CONFIG

// If no option, clear everything
if (!option) {
updateDeployment(deployment, {[name + 'Url']: null, [name]: null})
}

// If custom content, clear URL
if (option === CONFIG_OPTIONS.custom) {
miles-grant-ibigroup marked this conversation as resolved.
Show resolved Hide resolved
updateDeployment(deployment, {[name + 'Url']: null, [name]: value})
}

// If custom URL, clear content
if (option === CONFIG_OPTIONS.url) {
updateDeployment(deployment, {[name + 'Url']: value})
miles-grant-ibigroup marked this conversation as resolved.
Show resolved Hide resolved
}
}

_onChangeConfig = (evt: SyntheticInputEvent<HTMLInputElement>, option?: string) => {
const name = this.getName(option)

this.setState({[name]: evt.target.value})
}

_onSaveConfig = (option?: string) => {
const {deployment, updateDeployment} = this.props
const name = this.getName(option)

const value = this.state[name]
if (!isValidJSONC(value)) return window.alert('Must provide valid JSON string.')
if (option === CONFIG_OPTIONS.custom && !isValidJSONC(value)) return window.alert('Must provide valid JSON string.')
else if (option === CONFIG_OPTIONS.url && !validator.isURL(value)) return window.alert('Must provide valid URL string.')
else {
updateDeployment(deployment, {[name]: value})
this.setState({[name]: undefined})
Expand All @@ -65,39 +96,48 @@ export default class CustomConfig extends Component<{
render () {
const {deployment, name, label} = this.props
const useCustom = deployment[name] !== null
const useCustomUrl = deployment[name + 'Url'] !== null
const value = this.state[name] || deployment[name]
const urlValue = this.state[name + 'Url'] || deployment[name + 'Url']
const validJSON = isValidJSONC(value)
const validURL = !!urlValue && validator.isURL(urlValue)
return (
<div>
<h5>{label} configuration</h5>
<FormGroup>
<Radio
checked={!useCustom}
checked={!useCustom && !useCustomUrl}
name={name}
onChange={this._toggleCustomConfig}
onChange={(e) => this._toggleCustomConfig(e)}
inline>
Project default
</Radio>
<Radio
checked={useCustom}
checked={useCustom && !useCustomUrl}
philip-cline marked this conversation as resolved.
Show resolved Hide resolved
name={name}
onChange={this._toggleCustomConfig}
onChange={e => this._toggleCustomConfig(e, CONFIG_OPTIONS.custom)}
inline>
Custom
</Radio>
<Radio
checked={useCustomUrl}
name={name}
onChange={e => this._toggleCustomConfig(e, CONFIG_OPTIONS.url)}
inline>
URL
</Radio>
</FormGroup>
<p>
{useCustom
? `Use custom JSON defined below for ${label} configuration.`
: `Use the ${label} configuration defined in the project deployment settings.`
}
{useCustom && `Use custom JSON defined below for ${label} configuration.`}
{useCustomUrl && `Download ${label} configuration from URL defined below.`}
{!useCustom && !useCustomUrl && `Use the ${label} configuration defined in the project deployment settings.`}
<span>{' '}
{useCustom
{useCustom || useCustomUrl
? <Button
style={{marginLeft: '15px'}}
bsSize='xsmall'
disabled={!this.state[name] || !validJSON}
onClick={this._onSaveConfig}>Save</Button>
disabled={!this.state[useCustomUrl ? name + 'Url' : name] || (useCustomUrl ? !validURL : !validJSON)}
onClick={() => this._onSaveConfig(useCustomUrl ? CONFIG_OPTIONS.url : CONFIG_OPTIONS.custom)}>Save</Button>
: <LinkContainer
to={`/project/${deployment.projectId}/settings/deployment`}>
<Button bsSize='xsmall'>
Expand All @@ -107,17 +147,27 @@ export default class CustomConfig extends Component<{
}
</span>
</p>
{useCustom &&
{useCustom && !useCustomUrl &&
<FormGroup validationState={validJSON ? null : 'error'}>
<FormControl
componentClass='textarea'
style={{height: '125px'}}
placeholder='{"blah": true}'
onChange={this._onChangeConfig}
onChange={e => this._onChangeConfig(e, CONFIG_OPTIONS.custom)}
value={value} />
{!validJSON && <HelpBlock>Must provide valid JSON string.</HelpBlock>}
</FormGroup>
}
{useCustomUrl &&
<FormGroup validationState={validURL ? null : 'error'}>
<FormControl
componentClass='input'
placeholder='http://example.com'
onChange={e => this._onChangeConfig(e, CONFIG_OPTIONS.url)}
value={urlValue} />
{!validURL && <HelpBlock>Must provide valid URL.</HelpBlock>}
</FormGroup>
}
</div>
)
}
Expand Down
Loading