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 styled from 'styled-components';
import remcalc from 'remcalc';
import is from 'styled-is';
import {
H3,
FormGroup,
FormLabel,
Toggle,
Divider,
Row,
Col,
TagList,
P
} from 'joyent-ui-toolkit';
import Tag from '@components/tags';
import Empty from '@components/empty';
const capitalizeFirstLetter = string =>
string.charAt(0).toUpperCase() + string.slice(1);
const Box = styled.div`
display: inline-block;
background-color: ${props => props.theme.white};
border: ${remcalc(1)} solid ${props => props.theme.grey};
min-width: 100%;
${is('disabled')`
color: ${props => props.theme.greyDark}
`};
`;
const Wildcards = {
vmall: 'All VMs in DC',
any: 'Any'
};
const parsePartial = (p, index) => {
if (p[0] === 'wildcard') {
return (
Default firewall rules
Firewall rules from instance tags