/* eslint-disable camelcase */ import React, { Fragment } from 'react'; import { Field } from 'redux-form'; import { Margin, Padding } from 'styled-components-spacing'; import Flex, { FlexItem } from 'styled-flex-component'; import { Row, Col } from 'joyent-react-styled-flexboxgrid'; import { H3, FormGroup, FormLabel, Toggle, TagList, P, Strong, Card } from 'joyent-ui-toolkit'; import Tag from '@components/tags'; const capitalizeFirstLetter = string => string.charAt(0).toUpperCase() + string.slice(1); const Wildcards = { vmall: 'All VMs in DC', any: 'Any' }; const parsePartial = (p, index, style) => { if (p[0] === 'wildcard') { return (

{Wildcards[p[1]]}

); } if (p[0] === 'tag') { const value = Array.isArray(p[1]) ? p[1][1] : ''; const name = Array.isArray(p[1]) ? p[1][0] : p[1]; return ( ); } }; const Rule = ({ enabled, rule_obj }) => { const { action, protocol } = rule_obj; const style = { color: !enabled ? '#D8D8D8' : null }; const froms = rule_obj.from.map((p, index) => parsePartial(p, index, style)); const tos = rule_obj.to.map((p, index) => parsePartial(p, index, style)); return ( From: {froms} To: {tos} Protocol:

{protocol.name}

Ports:

{protocol.targets.join(';')}

Action:

{capitalizeFirstLetter(action)}

); }; export const Rules = ({ rules = [] }) => ( {rules.map(rule => ( ))} ); export const DefaultRules = ({ rules = [] }) => (

Default firewall rules

); export const TagRules = ({ rules = [] }) => (

Firewall rules from instance tags

); export const ToggleFirewallForm = ({ handleSubmit = () => null, submitOnChange = false, submitting = false, left = false }) => { const onChange = submitOnChange ? (...args) => setTimeout(() => handleSubmit(...args), 16) : undefined; return (
{left ? ( Enable Firewall ) : ( Enable Firewall )}
); }; export const ToggleInactiveForm = () => (
Show inactive rules
);