2017-10-11 19:59:59 +03:00
|
|
|
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 &&
|
2017-10-13 23:02:58 +03:00
|
|
|
!instance &&
|
|
|
|
!_loading && (
|
|
|
|
<Message error>
|
|
|
|
<MessageTitle>Ooops!</MessageTitle>
|
|
|
|
<MessageDescription>
|
|
|
|
An error occurred while loading your instance
|
|
|
|
</MessageDescription>
|
|
|
|
</Message>
|
|
|
|
);
|
2017-10-11 19:59:59 +03:00
|
|
|
|
|
|
|
const _form = !loading &&
|
2017-10-13 23:02:58 +03:00
|
|
|
!_error && (
|
|
|
|
<CreateSnapshotForm onSubmit={handleSubmit} onCancel={handleCancel} />
|
|
|
|
);
|
2017-10-11 19:59:59 +03:00
|
|
|
|
|
|
|
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 }) => ({
|
2017-10-13 23:02:58 +03:00
|
|
|
handleCancel: () => history.push(location.pathname.split(/\/~/).shift()),
|
2017-10-11 19:59:59 +03:00
|
|
|
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);
|