mirror of
https://github.com/yldio/copilot.git
synced 2024-11-14 15:20:06 +02:00
fix(cp-frontend): poll until dg is available when editing manifest
This commit is contained in:
parent
5a8eb965ff
commit
ae5eaba2c1
@ -36,7 +36,7 @@
|
||||
"prop-types": "^15.5.10",
|
||||
"react": "^15.6.1",
|
||||
"react-apollo": "^1.4.2",
|
||||
"react-bundle": "^1.0.3",
|
||||
"react-bundle": "^1.0.4",
|
||||
"react-codemirror": "^1.0.0",
|
||||
"react-dom": "^15.6.1",
|
||||
"react-redux": "^5.0.5",
|
||||
|
@ -1,4 +1,4 @@
|
||||
import React from 'react';
|
||||
import React, { Component } from 'react';
|
||||
import { Field } from 'redux-form';
|
||||
import styled from 'styled-components';
|
||||
import SimpleTable from 'react-simple-table';
|
||||
@ -73,11 +73,56 @@ const FilenameRemove = Button.extend`
|
||||
height: ${remcalc(48)};
|
||||
`;
|
||||
|
||||
const MEditor = ManifestEditor => ({ input, defaultValue }) =>
|
||||
<ManifestEditor mode="yaml" {...input} value={input.value || defaultValue} />;
|
||||
class ManifestEditorBundle extends Component {
|
||||
constructor() {
|
||||
super();
|
||||
|
||||
const EEditor = ManifestEditor => ({ input, defaultValue }) =>
|
||||
<ManifestEditor mode="ini" {...input} value={input.value || defaultValue} />;
|
||||
this.state = {};
|
||||
|
||||
this.handleRender = this.handleRender.bind(this);
|
||||
}
|
||||
handleRender(ManifestEditor) {
|
||||
if (ManifestEditor) {
|
||||
setTimeout(() => {
|
||||
this.setState({ ManifestEditor });
|
||||
}, 80);
|
||||
}
|
||||
|
||||
return <Dots2 />;
|
||||
}
|
||||
render() {
|
||||
if (!this.state.ManifestEditor) {
|
||||
return (
|
||||
<Bundle load={() => import('joyent-manifest-editor')}>
|
||||
{this.handleRender}
|
||||
</Bundle>
|
||||
);
|
||||
}
|
||||
|
||||
const { ManifestEditor } = this.state;
|
||||
const { children, ...rest } = this.props;
|
||||
|
||||
return (
|
||||
<ManifestEditor {...rest}>
|
||||
{children}
|
||||
</ManifestEditor>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
const MEditor = ({ input, defaultValue }) =>
|
||||
<ManifestEditorBundle
|
||||
mode="yaml"
|
||||
{...input}
|
||||
value={input.value || defaultValue}
|
||||
/>;
|
||||
|
||||
const EEditor = ({ input, defaultValue }) =>
|
||||
<ManifestEditorBundle
|
||||
mode="ini"
|
||||
{...input}
|
||||
value={input.value || defaultValue}
|
||||
/>;
|
||||
|
||||
export const Name = ({ handleSubmit, onCancel, dirty }) =>
|
||||
<form onSubmit={handleSubmit}>
|
||||
@ -103,16 +148,7 @@ export const Manifest = ({
|
||||
loading
|
||||
}) =>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<Bundle load={() => import('joyent-manifest-editor')}>
|
||||
{ManifestEditor =>
|
||||
ManifestEditor
|
||||
? <Field
|
||||
name="manifest"
|
||||
defaultValue={defaultValue}
|
||||
component={MEditor(ManifestEditor)}
|
||||
/>
|
||||
: <Dots2 />}
|
||||
</Bundle>
|
||||
<Field name="manifest" defaultValue={defaultValue} component={MEditor} />
|
||||
<ButtonsRow>
|
||||
<Button onClick={onCancel} secondary>Cancel</Button>
|
||||
<Button
|
||||
@ -147,16 +183,11 @@ export const Files = ({ loading, files, onRemoveFile }) => {
|
||||
<FormMeta left />
|
||||
<Filename name={name} onRemoveFile={() => onRemoveFile(id)} />
|
||||
</FormGroup>
|
||||
<Bundle load={() => import('joyent-manifest-editor')}>
|
||||
{ManifestEditor =>
|
||||
ManifestEditor
|
||||
? <Field
|
||||
name={`file-value-${id}`}
|
||||
defaultValue={value}
|
||||
component={EEditor(ManifestEditor)}
|
||||
/>
|
||||
: <Dots2 />}
|
||||
</Bundle>
|
||||
<Field
|
||||
name={`file-value-${id}`}
|
||||
defaultValue={value}
|
||||
component={EEditor}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
|
||||
@ -179,16 +210,7 @@ export const Environment = ({
|
||||
loading
|
||||
}) =>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<Bundle load={() => import('joyent-manifest-editor')}>
|
||||
{ManifestEditor =>
|
||||
ManifestEditor
|
||||
? <Field
|
||||
name="environment"
|
||||
defaultValue={defaultValue}
|
||||
component={EEditor(ManifestEditor)}
|
||||
/>
|
||||
: <Dots2 />}
|
||||
</Bundle>
|
||||
<Field name="environment" defaultValue={defaultValue} component={EEditor} />
|
||||
<Files files={files} onRemoveFile={onRemoveFile} loading={loading} />
|
||||
<ButtonsRow>
|
||||
<Button onClick={onCancel} secondary>Cancel</Button>
|
||||
|
@ -18,7 +18,12 @@ class DeploymentGroupDelete extends Component {
|
||||
);
|
||||
}
|
||||
|
||||
const { deploymentGroup, deleteDeploymentGroup, history, match } = this.props;
|
||||
const {
|
||||
deploymentGroup,
|
||||
deleteDeploymentGroup,
|
||||
history,
|
||||
match
|
||||
} = this.props;
|
||||
|
||||
const handleCloseClick = evt => {
|
||||
const closeUrl = match.url.split('/').slice(0, -2).join('/');
|
||||
@ -74,8 +79,9 @@ const DeploymentGroupGql = graphql(DeploymentGroupQuery, {
|
||||
})
|
||||
});
|
||||
|
||||
const DeploymentGroupDeleteWithData = compose(DeleteDeploymentGroupGql, DeploymentGroupGql)(
|
||||
DeploymentGroupDelete
|
||||
);
|
||||
const DeploymentGroupDeleteWithData = compose(
|
||||
DeleteDeploymentGroupGql,
|
||||
DeploymentGroupGql
|
||||
)(DeploymentGroupDelete);
|
||||
|
||||
export default DeploymentGroupDeleteWithData;
|
||||
|
@ -22,9 +22,9 @@ export default ({
|
||||
{error && <span>{error.toString()}</span>}
|
||||
<Progress stage={stage} create />
|
||||
<ManifestEditOrCreate
|
||||
create
|
||||
manifest={manifest}
|
||||
deploymentGroup={deploymentGroup}
|
||||
create
|
||||
/>
|
||||
</LayoutContainer>
|
||||
);
|
||||
|
@ -133,9 +133,9 @@ const DeploymentGroupList = ({
|
||||
<StyledLink to={`${match.path}/${slug}`}>
|
||||
<ServiceTitle>{name}</ServiceTitle>
|
||||
</StyledLink>
|
||||
<StyledIconButton to={`${match.url}/${slug}/delete`}>
|
||||
<BinIcon />
|
||||
</StyledIconButton>
|
||||
<StyledIconButton to={`${match.url}/${slug}/delete`}>
|
||||
<BinIcon />
|
||||
</StyledIconButton>
|
||||
</Box>
|
||||
</Col>
|
||||
);
|
||||
|
@ -1,6 +1,7 @@
|
||||
import React from 'react';
|
||||
import { compose, graphql } from 'react-apollo';
|
||||
import get from 'lodash.get';
|
||||
import forceArray from 'force-array';
|
||||
|
||||
import ManifestQuery from '@graphql/Manifest.gql';
|
||||
import DeploymentGroupBySlugQuery from '@graphql/DeploymentGroupBySlug.gql';
|
||||
@ -26,10 +27,10 @@ const Manifest = ({
|
||||
const _view = loading || !deploymentGroup
|
||||
? null
|
||||
: <ManifestEditOrCreate
|
||||
edit
|
||||
manifest={manifest}
|
||||
environment={environment}
|
||||
deploymentGroup={deploymentGroup}
|
||||
edit
|
||||
/>;
|
||||
|
||||
const _notice = !error &&
|
||||
@ -59,6 +60,7 @@ const Manifest = ({
|
||||
export default compose(
|
||||
graphql(ManifestQuery, {
|
||||
options: props => ({
|
||||
fetchPolicy: 'network-only',
|
||||
variables: {
|
||||
deploymentGroupSlug: props.match.params.deploymentGroup
|
||||
}
|
||||
@ -76,12 +78,20 @@ export default compose(
|
||||
slug: props.match.params.deploymentGroup
|
||||
}
|
||||
}),
|
||||
props: ({ data: { deploymentGroups, loading, error } }) => ({
|
||||
deploymentGroup: deploymentGroups && deploymentGroups.length
|
||||
? deploymentGroups[0]
|
||||
: null,
|
||||
loading,
|
||||
error
|
||||
})
|
||||
props: ({ data: { deploymentGroups, loading, error, startPolling, stopPolling } }) => {
|
||||
const dgs = forceArray(deploymentGroups);
|
||||
|
||||
if (!dgs.length) {
|
||||
startPolling(1000);
|
||||
} else {
|
||||
stopPolling();
|
||||
}
|
||||
|
||||
return {
|
||||
deploymentGroup: dgs[0],
|
||||
loading,
|
||||
error
|
||||
};
|
||||
}
|
||||
})
|
||||
)(Manifest);
|
||||
|
@ -39,7 +39,6 @@ const StyledFilter = styled(Input)`
|
||||
const handleAddService = () => console.log('Adding a service...');
|
||||
|
||||
const ServicesMenu = ({ location, history: { push } }) => {
|
||||
|
||||
const toggleValue = location.pathname.split('-').pop();
|
||||
|
||||
const handleToggle = evt => {
|
||||
|
@ -11,7 +11,7 @@ const state = {
|
||||
name: 'Instances'
|
||||
},
|
||||
{
|
||||
pathname: 'manifest',
|
||||
pathname: 'manifest/edit',
|
||||
name: 'Manifest'
|
||||
}
|
||||
],
|
||||
|
10
yarn.lock
10
yarn.lock
@ -7300,9 +7300,9 @@ react-broadcast@^0.1.2:
|
||||
dependencies:
|
||||
invariant "^2.2.1"
|
||||
|
||||
react-bundle@^1.0.3:
|
||||
version "1.0.3"
|
||||
resolved "https://registry.yarnpkg.com/react-bundle/-/react-bundle-1.0.3.tgz#12784de6a076070b150dcedfebfcdb80266b4deb"
|
||||
react-bundle@^1.0.4:
|
||||
version "1.0.4"
|
||||
resolved "https://registry.yarnpkg.com/react-bundle/-/react-bundle-1.0.4.tgz#ea03cae97be357ff8e290e785f4e30d0e065b920"
|
||||
dependencies:
|
||||
ispromise "^1.1.0"
|
||||
prop-types "^15.5.10"
|
||||
@ -9379,8 +9379,8 @@ unist-util-visit@^1.0.0, unist-util-visit@^1.1.0:
|
||||
resolved "https://registry.yarnpkg.com/unist-util-visit/-/unist-util-visit-1.1.3.tgz#ec268e731b9d277a79a5b5aa0643990e405d600b"
|
||||
|
||||
universalify@^0.1.0:
|
||||
version "0.1.0"
|
||||
resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.0.tgz#9eb1c4651debcc670cc94f1a75762332bb967778"
|
||||
version "0.1.1"
|
||||
resolved "https://registry.yarnpkg.com/universalify/-/universalify-0.1.1.tgz#fa71badd4437af4c148841e3b3b165f9e9e590b7"
|
||||
|
||||
unpipe@1.0.0, unpipe@~1.0.0:
|
||||
version "1.0.0"
|
||||
|
Loading…
Reference in New Issue
Block a user