95 lines
2.4 KiB
JavaScript
95 lines
2.4 KiB
JavaScript
|
import React from 'react';
|
||
|
import { reduxForm, SubmissionError } from 'redux-form';
|
||
|
import { connect } from 'react-redux';
|
||
|
import { compose, graphql } from 'react-apollo';
|
||
|
import find from 'lodash.find';
|
||
|
import get from 'lodash.get';
|
||
|
|
||
|
import {
|
||
|
Title,
|
||
|
ViewContainer,
|
||
|
StatusLoader,
|
||
|
Message,
|
||
|
MessageTitle,
|
||
|
MessageDescription
|
||
|
} from 'joyent-ui-toolkit';
|
||
|
|
||
|
import { CreateSnapshot as InstanceCreateSnapshot } from '@components/instances';
|
||
|
import CreateSnapshotMutation from '@graphql/create-snapshot.gql';
|
||
|
import GetInstance from '@graphql/get-instance.gql';
|
||
|
|
||
|
const CreateSnapshot = ({
|
||
|
match,
|
||
|
instance,
|
||
|
loading,
|
||
|
error,
|
||
|
handleSubmit,
|
||
|
handleCancel
|
||
|
}) => {
|
||
|
const _title = <Title>Create Snapshot</Title>;
|
||
|
const _loading = !(loading && !instance) ? null : <StatusLoader />;
|
||
|
|
||
|
const CreateSnapshotForm = reduxForm({
|
||
|
form: `create-snapshot-${match.params.instance}`
|
||
|
})(InstanceCreateSnapshot);
|
||
|
|
||
|
const _error = error &&
|
||
|
!instance &&
|
||
|
!_loading && (
|
||
|
<Message error>
|
||
|
<MessageTitle>Ooops!</MessageTitle>
|
||
|
<MessageDescription>
|
||
|
An error occurred while loading your instance
|
||
|
</MessageDescription>
|
||
|
</Message>
|
||
|
);
|
||
|
|
||
|
const _form = !loading &&
|
||
|
!_error && (
|
||
|
<CreateSnapshotForm onSubmit={handleSubmit} onCancel={handleCancel} />
|
||
|
);
|
||
|
|
||
|
return (
|
||
|
<ViewContainer center={Boolean(_loading)} main>
|
||
|
{_title}
|
||
|
{_loading}
|
||
|
{_error}
|
||
|
{_form}
|
||
|
</ViewContainer>
|
||
|
);
|
||
|
};
|
||
|
|
||
|
export default compose(
|
||
|
graphql(CreateSnapshotMutation, { name: 'createSnapshot' }),
|
||
|
graphql(GetInstance, {
|
||
|
options: ({ match }) => ({
|
||
|
variables: {
|
||
|
name: get(match, 'params.instance')
|
||
|
}
|
||
|
}),
|
||
|
props: ({ data: { loading, error, variables, ...rest } }) => ({
|
||
|
instance: find(get(rest, 'machines', []), ['name', variables.name]),
|
||
|
loading,
|
||
|
error
|
||
|
})
|
||
|
}),
|
||
|
connect(
|
||
|
null,
|
||
|
(dispatch, { history, location, instance, createSnapshot }) => ({
|
||
|
handleCancel: () => history.push(location.pathname.split(/\/\~/).shift()),
|
||
|
handleSubmit: ({ name }) =>
|
||
|
createSnapshot({
|
||
|
variables: { name, id: instance.id }
|
||
|
})
|
||
|
.catch(error => {
|
||
|
throw new SubmissionError({
|
||
|
_error: error.graphQLErrors
|
||
|
.map(({ message }) => message)
|
||
|
.join('\n')
|
||
|
});
|
||
|
})
|
||
|
.then(() => history.push(`/instances/${instance.name}/snapshots`))
|
||
|
})
|
||
|
)
|
||
|
)(CreateSnapshot);
|