2018-01-08 21:08:01 +02:00
|
|
|
import React from 'react';
|
|
|
|
import { Margin } from 'styled-components-spacing';
|
2018-01-12 19:40:23 +02:00
|
|
|
import ReduxForm from 'declarative-redux-form';
|
|
|
|
import { stopSubmit, destroy } from 'redux-form';
|
2018-01-12 17:25:26 +02:00
|
|
|
import remcalc from 'remcalc';
|
2018-01-12 19:40:23 +02:00
|
|
|
import { connect } from 'react-redux';
|
|
|
|
import { graphql, compose } from 'react-apollo';
|
|
|
|
import intercept from 'apr-intercept';
|
|
|
|
import constantCase from 'constant-case';
|
|
|
|
import get from 'lodash.get';
|
|
|
|
import omit from 'lodash.omit';
|
|
|
|
import uniqBy from 'lodash.uniqby';
|
2018-01-08 21:08:01 +02:00
|
|
|
|
2018-01-12 17:25:26 +02:00
|
|
|
import { ViewContainer, H2, Button, Divider } from 'joyent-ui-toolkit';
|
2018-01-08 21:08:01 +02:00
|
|
|
|
|
|
|
import Name from '@containers/create-instance/name';
|
2018-01-09 20:14:20 +02:00
|
|
|
import Image from '@containers/create-instance/image';
|
2018-01-11 15:27:16 +02:00
|
|
|
import Package from '@containers/create-instance/package';
|
2018-01-09 17:59:04 +02:00
|
|
|
import Tags from '@containers/create-instance/tags';
|
|
|
|
import Metadata from '@containers/create-instance/metadata';
|
2018-01-11 17:54:24 +02:00
|
|
|
import Networks from '@containers/create-instance/networks';
|
2018-01-09 17:59:04 +02:00
|
|
|
import Firewall from '@containers/create-instance/firewall';
|
2018-01-11 22:26:42 +02:00
|
|
|
import CNS from '@containers/create-instance/cns';
|
2018-01-09 17:59:04 +02:00
|
|
|
import Affinity from '@containers/create-instance/affinity';
|
2018-01-12 19:40:23 +02:00
|
|
|
import CreateInstanceMutation from '@graphql/create-instance.gql';
|
|
|
|
import parseError from '@state/parse-error';
|
2018-01-08 21:08:01 +02:00
|
|
|
|
2018-01-12 19:40:23 +02:00
|
|
|
const CreateInstance = ({ step, handleSubmit, ...props }) => (
|
2018-01-08 21:08:01 +02:00
|
|
|
<ViewContainer>
|
|
|
|
<Margin top={4} bottom={4}>
|
|
|
|
<H2>Create Instances</H2>
|
|
|
|
</Margin>
|
2018-01-09 20:14:20 +02:00
|
|
|
<Margin bottom={4}>
|
2018-01-10 16:39:46 +02:00
|
|
|
<Name {...props} expanded={step === 'name'} />
|
2018-01-09 20:14:20 +02:00
|
|
|
</Margin>
|
|
|
|
<Margin bottom={4}>
|
2018-01-10 16:39:46 +02:00
|
|
|
<Image {...props} expanded={step === 'image'} />
|
|
|
|
</Margin>
|
2018-01-11 15:27:16 +02:00
|
|
|
<Margin bottom={4}>
|
|
|
|
<Package {...props} expanded={step === 'package'} />
|
|
|
|
</Margin>
|
2018-01-10 16:39:46 +02:00
|
|
|
<Margin bottom={4}>
|
|
|
|
<Tags {...props} expanded={step === 'tags'} />
|
|
|
|
</Margin>
|
|
|
|
<Margin bottom={4}>
|
|
|
|
<Metadata {...props} expanded={step === 'metadata'} />
|
2018-01-09 20:14:20 +02:00
|
|
|
</Margin>
|
2018-01-11 17:54:24 +02:00
|
|
|
<Margin bottom={4}>
|
|
|
|
<Networks {...props} expanded={step === 'networks'} />
|
|
|
|
</Margin>
|
2018-01-09 17:59:04 +02:00
|
|
|
<Margin bottom={5}>
|
|
|
|
<Firewall {...props} expanded={step === 'firewall'} />
|
|
|
|
</Margin>
|
2018-01-11 22:26:42 +02:00
|
|
|
<Margin bottom={4}>
|
|
|
|
<CNS {...props} expanded={step === 'cns'} />
|
|
|
|
</Margin>
|
2018-01-12 17:25:26 +02:00
|
|
|
<Margin bottom={4}>
|
|
|
|
<Affinity {...props} expanded={step === 'affinity'} />
|
|
|
|
</Margin>
|
|
|
|
{step === 'done' || step === 'affinity' ? (
|
|
|
|
<Divider height={remcalc(1)} />
|
|
|
|
) : null}
|
|
|
|
<Margin top={7} bottom={10}>
|
2018-01-12 19:40:23 +02:00
|
|
|
<ReduxForm form="create-instance" onSubmit={handleSubmit}>
|
|
|
|
{({ handleSubmit, submitting }) => (
|
|
|
|
<form onSubmit={handleSubmit}>
|
|
|
|
<Button disabled={step !== 'done'} loading={submitting}>
|
|
|
|
Deploy
|
|
|
|
</Button>
|
|
|
|
</form>
|
|
|
|
)}
|
|
|
|
</ReduxForm>
|
2018-01-12 17:25:26 +02:00
|
|
|
</Margin>
|
2018-01-08 21:08:01 +02:00
|
|
|
</ViewContainer>
|
|
|
|
);
|
2018-01-12 19:40:23 +02:00
|
|
|
|
|
|
|
export default compose(
|
|
|
|
graphql(CreateInstanceMutation, { name: 'createInstance' }),
|
|
|
|
connect(({ form, values }, ownProps) => {
|
|
|
|
const name = get(
|
|
|
|
form,
|
|
|
|
'create-instance-name.values.name',
|
|
|
|
'<instance-name>'
|
|
|
|
);
|
|
|
|
|
|
|
|
const firewall = get(
|
|
|
|
form,
|
|
|
|
'CREATE-INSTANCE-FIREWALL.values.enabled',
|
|
|
|
false
|
|
|
|
);
|
|
|
|
|
|
|
|
const image = get(
|
|
|
|
form,
|
|
|
|
'create-instance-image.values.image',
|
|
|
|
'<instance-image>'
|
|
|
|
);
|
|
|
|
|
|
|
|
const pkg = get(
|
|
|
|
form,
|
|
|
|
'create-instance-package.values.package',
|
|
|
|
'<instance-image>'
|
|
|
|
);
|
|
|
|
|
|
|
|
const networks = get(
|
|
|
|
form,
|
|
|
|
'CREATE-INSTANCE-NETWORKS.values',
|
|
|
|
'<instance-image>'
|
|
|
|
);
|
|
|
|
|
|
|
|
const metadata = get(values, 'create-instance-metadata', []);
|
|
|
|
const receivedTags = get(values, 'create-instance-tags', []);
|
|
|
|
const affinity = get(values, 'create-instance-affinity', []);
|
|
|
|
const cns = get(values, 'create-instance-cns-enabled', true);
|
|
|
|
const cnsServices = get(values, 'create-instance-cns-services', null);
|
|
|
|
|
|
|
|
const tags = receivedTags.map(a => omit(a, 'expanded'));
|
|
|
|
|
|
|
|
tags.push({ name: 'triton.cns.disable', value: !cns });
|
|
|
|
|
|
|
|
if (cnsServices && cns) {
|
|
|
|
tags.push({ name: 'triton.cns.services', value: cnsServices.join(',') });
|
|
|
|
}
|
|
|
|
|
|
|
|
const affRules = affinity
|
|
|
|
.map(aff => ({
|
|
|
|
conditional: aff['rule-instance-conditional'],
|
|
|
|
placement: aff['rule-instance-placement'],
|
|
|
|
identity: aff['rule-type'],
|
|
|
|
key: aff['rule-instance-tag-key'],
|
|
|
|
pattern: aff['rule-instance-tag-value-pattern'],
|
|
|
|
value:
|
|
|
|
aff['rule-type'] === 'name'
|
|
|
|
? aff['rule-instance-name']
|
|
|
|
: aff['rule-instance-tag-value']
|
|
|
|
}))
|
|
|
|
.map(({ conditional, placement, identity, key, pattern, value }) => {
|
|
|
|
const type = constantCase(
|
|
|
|
`${conditional}_${placement === 'same' ? 'equal' : 'not_equal'}`
|
|
|
|
);
|
|
|
|
|
|
|
|
const patterns = {
|
|
|
|
equalling: value => value,
|
|
|
|
'not-equalling': `/^!${value}$/`,
|
|
|
|
containing: `/${value}/`,
|
|
|
|
starting: `/^${value}/`,
|
|
|
|
ending: `/${value}$/`
|
|
|
|
};
|
|
|
|
|
|
|
|
const _key = identity === 'name' ? 'instance' : key;
|
|
|
|
const _value = patterns[pattern](value);
|
|
|
|
|
|
|
|
return {
|
|
|
|
type,
|
|
|
|
key: _key,
|
|
|
|
value: _value
|
|
|
|
};
|
|
|
|
});
|
|
|
|
|
|
|
|
return {
|
|
|
|
forms: Object.keys(form), // improve this
|
|
|
|
name: name.toLowerCase(),
|
|
|
|
pkg,
|
|
|
|
image,
|
|
|
|
affinity: affRules,
|
|
|
|
metadata: metadata.map(a => omit(a, 'expanded')),
|
|
|
|
tags: uniqBy(tags, 'name'),
|
|
|
|
firewall_enabled: firewall,
|
|
|
|
networks: Object.keys(networks).filter(network => networks[network])
|
|
|
|
};
|
|
|
|
}),
|
|
|
|
connect(null, (dispatch, ownProps) => {
|
|
|
|
const {
|
|
|
|
name,
|
|
|
|
pkg,
|
|
|
|
image,
|
|
|
|
affinity,
|
|
|
|
metadata,
|
|
|
|
tags,
|
|
|
|
firewall_enabled,
|
|
|
|
networks,
|
|
|
|
forms,
|
|
|
|
createInstance,
|
|
|
|
history
|
|
|
|
} = ownProps;
|
|
|
|
|
|
|
|
return {
|
|
|
|
handleSubmit: async () => {
|
|
|
|
const [err, res] = await intercept(
|
|
|
|
createInstance({
|
|
|
|
variables: {
|
|
|
|
name,
|
|
|
|
package: pkg,
|
|
|
|
image,
|
|
|
|
affinity,
|
|
|
|
metadata,
|
|
|
|
tags,
|
|
|
|
firewall_enabled,
|
|
|
|
networks
|
|
|
|
}
|
|
|
|
})
|
|
|
|
);
|
|
|
|
|
|
|
|
if (err) {
|
|
|
|
return dispatch(
|
|
|
|
stopSubmit(TABLE_FORM_NAME, {
|
|
|
|
_error: parseError(err)
|
|
|
|
})
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
dispatch(forms.map(name => destroy(name)));
|
|
|
|
|
|
|
|
history.push(`/instances/${res.data.createMachine.name}`);
|
|
|
|
}
|
|
|
|
};
|
|
|
|
})
|
|
|
|
)(CreateInstance);
|