2018-02-01 12:38:12 +02:00
|
|
|
|
/* eslint-disable camelcase */
|
2018-01-25 00:40:43 +02:00
|
|
|
|
import React, { Fragment } from 'react';
|
|
|
|
|
import intercept from 'apr-intercept';
|
|
|
|
|
import { connect } from 'react-redux';
|
|
|
|
|
import { compose, graphql } from 'react-apollo';
|
|
|
|
|
import ReduxForm from 'declarative-redux-form';
|
|
|
|
|
import { SubmissionError } from 'redux-form';
|
|
|
|
|
import { Margin } from 'styled-components-spacing';
|
|
|
|
|
import remcalc from 'remcalc';
|
2018-02-05 15:00:23 +02:00
|
|
|
|
import isBoolean from 'lodash.isboolean';
|
2018-01-25 00:40:43 +02:00
|
|
|
|
import get from 'lodash.get';
|
2017-09-20 12:30:53 +03:00
|
|
|
|
|
2018-01-25 00:40:43 +02:00
|
|
|
|
import {
|
|
|
|
|
ViewContainer,
|
|
|
|
|
Message,
|
|
|
|
|
MessageTitle,
|
|
|
|
|
MessageDescription,
|
|
|
|
|
StatusLoader,
|
|
|
|
|
Divider
|
|
|
|
|
} from 'joyent-ui-toolkit';
|
2017-09-20 12:30:53 +03:00
|
|
|
|
|
2018-01-25 00:40:43 +02:00
|
|
|
|
import {
|
2018-04-12 12:53:00 +03:00
|
|
|
|
TagRules,
|
|
|
|
|
DefaultRules,
|
2018-01-25 00:40:43 +02:00
|
|
|
|
ToggleFirewallForm,
|
|
|
|
|
ToggleInactiveForm,
|
2018-04-12 12:53:00 +03:00
|
|
|
|
Empty
|
|
|
|
|
} from 'joyent-ui-resource-widgets';
|
2018-01-25 00:40:43 +02:00
|
|
|
|
|
2018-04-12 12:53:00 +03:00
|
|
|
|
import Description from '@components/instances/description';
|
2018-01-25 00:40:43 +02:00
|
|
|
|
import GetFirewallRules from '@graphql/list-instance-fw-rules.gql';
|
|
|
|
|
import EnableFirewall from '@graphql/enable-instance-fw.gql';
|
|
|
|
|
import DisableFirewall from '@graphql/disable-instance-fw.gql';
|
|
|
|
|
import parseError from '@state/parse-error';
|
|
|
|
|
|
|
|
|
|
export const Firewall = ({
|
|
|
|
|
defaultRules = [],
|
|
|
|
|
tagRules = [],
|
2018-02-05 15:00:23 +02:00
|
|
|
|
enabled,
|
2018-01-25 00:40:43 +02:00
|
|
|
|
inactive = false,
|
|
|
|
|
loading = false,
|
|
|
|
|
loadingError = null,
|
|
|
|
|
mutationError = null,
|
|
|
|
|
handleEnabledToggle
|
|
|
|
|
}) => (
|
|
|
|
|
<ViewContainer main>
|
2018-04-12 12:53:00 +03:00
|
|
|
|
<Margin bottom={3}>
|
|
|
|
|
<Description href="https://docs.joyent.com/private-cloud/install/cns">
|
2018-01-25 00:40:43 +02:00
|
|
|
|
Cloud Firewall rules control traffic across instances. Enabling the
|
|
|
|
|
firewall adds a default set of rules and rules defined by your chosen
|
2018-04-12 12:53:00 +03:00
|
|
|
|
tags.
|
2018-01-25 00:40:43 +02:00
|
|
|
|
</Description>
|
|
|
|
|
</Margin>
|
|
|
|
|
{loading ? <StatusLoader /> : null}
|
|
|
|
|
{!loading && loadingError ? (
|
2018-04-12 12:53:00 +03:00
|
|
|
|
<Margin bottom={5}>
|
2018-01-30 18:04:03 +02:00
|
|
|
|
<Message error>
|
|
|
|
|
<MessageTitle>Ooops!</MessageTitle>
|
|
|
|
|
<MessageDescription>
|
|
|
|
|
An error occurred while loading your firewall rules
|
|
|
|
|
</MessageDescription>
|
|
|
|
|
</Message>
|
|
|
|
|
</Margin>
|
2018-01-25 00:40:43 +02:00
|
|
|
|
) : null}
|
|
|
|
|
{!loading && mutationError ? (
|
2018-04-12 12:53:00 +03:00
|
|
|
|
<Margin bottom={5}>
|
2018-01-30 18:04:03 +02:00
|
|
|
|
<Message error>
|
|
|
|
|
<MessageTitle>Ooops!</MessageTitle>
|
|
|
|
|
<MessageDescription>{mutationError}</MessageDescription>
|
|
|
|
|
</Message>
|
|
|
|
|
</Margin>
|
2018-01-25 00:40:43 +02:00
|
|
|
|
) : null}
|
|
|
|
|
<ReduxForm
|
|
|
|
|
form="fw-enabled"
|
|
|
|
|
destroyOnUnmount={false}
|
|
|
|
|
forceUnregisterOnUnmount={true}
|
2018-02-05 15:00:23 +02:00
|
|
|
|
{...{ initialValues: isBoolean(enabled) ? { enabled } : undefined }}
|
2018-01-25 00:40:43 +02:00
|
|
|
|
onSubmit={handleEnabledToggle}
|
|
|
|
|
>
|
|
|
|
|
{props =>
|
|
|
|
|
loading ? null : (
|
|
|
|
|
<Fragment>
|
2018-04-12 12:53:00 +03:00
|
|
|
|
<Margin bottom={5}>
|
2018-01-30 18:04:03 +02:00
|
|
|
|
<ToggleFirewallForm {...props} submitOnChange />
|
2018-01-25 00:40:43 +02:00
|
|
|
|
</Margin>
|
|
|
|
|
<Divider height={remcalc(1)} />
|
|
|
|
|
</Fragment>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
</ReduxForm>
|
|
|
|
|
<ReduxForm
|
|
|
|
|
form="fw-inactive"
|
|
|
|
|
destroyOnUnmount={false}
|
|
|
|
|
forceUnregisterOnUnmount={true}
|
|
|
|
|
initialValues={{ inactive }}
|
|
|
|
|
>
|
|
|
|
|
{props =>
|
|
|
|
|
!enabled || loading ? null : (
|
|
|
|
|
<Margin top={4}>
|
|
|
|
|
<ToggleInactiveForm {...props} />
|
|
|
|
|
</Margin>
|
|
|
|
|
)
|
|
|
|
|
}
|
|
|
|
|
</ReduxForm>
|
|
|
|
|
{!loading && !defaultRules.length && !tagRules.length ? (
|
|
|
|
|
<Margin top={5}>
|
2018-02-26 15:47:37 +02:00
|
|
|
|
<Empty borderTop>
|
|
|
|
|
Sorry, but we weren’t able to find any firewall rules.
|
|
|
|
|
</Empty>
|
2018-01-25 00:40:43 +02:00
|
|
|
|
</Margin>
|
|
|
|
|
) : null}
|
|
|
|
|
{!loading && enabled && defaultRules.length ? (
|
|
|
|
|
<Margin top={5}>
|
|
|
|
|
<DefaultRules rules={defaultRules} />
|
|
|
|
|
</Margin>
|
|
|
|
|
) : null}
|
|
|
|
|
{!loading && enabled && tagRules.length ? (
|
2018-04-12 12:53:00 +03:00
|
|
|
|
<Margin top={5}>
|
2018-01-25 00:40:43 +02:00
|
|
|
|
<TagRules rules={tagRules} />
|
|
|
|
|
</Margin>
|
|
|
|
|
) : null}
|
|
|
|
|
</ViewContainer>
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
export default compose(
|
|
|
|
|
graphql(EnableFirewall, { name: 'enableFirewall' }),
|
|
|
|
|
graphql(DisableFirewall, { name: 'disableFirewall' }),
|
|
|
|
|
graphql(GetFirewallRules, {
|
|
|
|
|
options: ({ match }) => ({
|
2018-02-20 02:35:31 +02:00
|
|
|
|
ssr: false,
|
2018-01-25 00:40:43 +02:00
|
|
|
|
variables: {
|
|
|
|
|
fetchPolicy: 'network-only',
|
2018-03-21 19:35:51 +02:00
|
|
|
|
id: get(match, 'params.instance')
|
2018-01-25 00:40:43 +02:00
|
|
|
|
}
|
|
|
|
|
}),
|
|
|
|
|
props: ({ data }) => {
|
2018-03-21 19:35:51 +02:00
|
|
|
|
const { loading, error, machine } = data;
|
2018-01-25 00:40:43 +02:00
|
|
|
|
|
2018-03-21 19:35:51 +02:00
|
|
|
|
const enabled = get(machine, 'firewall_enabled');
|
|
|
|
|
const rules = get(machine, 'firewall_rules', []);
|
2018-01-25 00:40:43 +02:00
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
enabled,
|
2018-03-28 18:32:09 +03:00
|
|
|
|
defaultRules: rules,
|
2018-01-25 00:40:43 +02:00
|
|
|
|
tagRules: rules.filter(({ rule_obj = {} }) => rule_obj.tags.length),
|
2018-03-21 19:35:51 +02:00
|
|
|
|
instance: machine,
|
2018-01-25 00:40:43 +02:00
|
|
|
|
loading,
|
|
|
|
|
loadingError: error
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
}),
|
|
|
|
|
connect(
|
|
|
|
|
(state, ownProps) => {
|
|
|
|
|
const { form } = state;
|
|
|
|
|
const { enabled, defaultRules, tagRules } = ownProps;
|
|
|
|
|
|
|
|
|
|
const inactive = get(form, `fw-inactive.values.inactive`, false);
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
inactive,
|
|
|
|
|
mutationError: get(form, `fw-enabled.error`, null),
|
|
|
|
|
enabled: get(form, `fw-enabled.values.enabled`, enabled),
|
|
|
|
|
defaultRules: defaultRules.filter(({ enabled }) => enabled || inactive),
|
|
|
|
|
tagRules: tagRules.filter(({ enabled }) => enabled || inactive)
|
|
|
|
|
};
|
|
|
|
|
},
|
|
|
|
|
(dispatch, ownProps) => {
|
|
|
|
|
const { instance, enableFirewall, disableFirewall } = ownProps;
|
|
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
handleEnabledToggle: async ({ enabled }) => {
|
2018-02-05 15:00:23 +02:00
|
|
|
|
const mutation = enabled ? disableFirewall : enableFirewall;
|
2018-01-25 00:40:43 +02:00
|
|
|
|
|
|
|
|
|
const [err] = await intercept(
|
|
|
|
|
mutation({
|
|
|
|
|
variables: {
|
|
|
|
|
id: instance.id
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
);
|
|
|
|
|
|
|
|
|
|
if (err) {
|
|
|
|
|
throw new SubmissionError({
|
|
|
|
|
_error: parseError(err)
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
)
|
|
|
|
|
)(Firewall);
|