64 lines
1.4 KiB
JavaScript
64 lines
1.4 KiB
JavaScript
|
import React from 'react';
|
||
|
|
import ReactJson from 'react-json-view';
|
||
|
|
import PropTypes from 'prop-types';
|
||
|
|
import { compose, graphql } from 'react-apollo';
|
||
|
|
import find from 'lodash.find';
|
||
|
|
import get from 'lodash.get';
|
||
|
|
|
||
|
|
import {
|
||
|
|
ViewContainer,
|
||
|
|
Title,
|
||
|
|
StatusLoader,
|
||
|
|
Message,
|
||
|
|
MessageDescription,
|
||
|
|
MessageTitle
|
||
|
|
} from 'joyent-ui-toolkit';
|
||
|
|
|
||
|
|
import ListDNS from '@graphql/list-dns.gql';
|
||
|
|
|
||
|
|
const DNS = ({ instance, loading, error }) => {
|
||
|
|
const { name, dns_names } = instance || {};
|
||
|
|
const _title = <Title>DNS</Title>;
|
||
|
|
const _loading = loading && !name && !dns_names && <StatusLoader />;
|
||
|
|
const _summary = !_loading && instance && <ReactJson src={dns_names} />;
|
||
|
|
|
||
|
|
const _error = error &&
|
||
|
|
!_loading &&
|
||
|
|
!instance && (
|
||
|
|
<Message error>
|
||
|
|
<MessageTitle>Ooops!</MessageTitle>
|
||
|
|
<MessageDescription>
|
||
|
|
An error occurred while loading your instance DNS
|
||
|
|
</MessageDescription>
|
||
|
|
</Message>
|
||
|
|
);
|
||
|
|
|
||
|
|
return (
|
||
|
|
<ViewContainer center={Boolean(_loading)} main>
|
||
|
|
{_title}
|
||
|
|
{_loading}
|
||
|
|
{_error}
|
||
|
|
{_summary}
|
||
|
|
</ViewContainer>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
|
||
|
|
DNS.propTypes = {
|
||
|
|
loading: PropTypes.bool
|
||
|
|
};
|
||
|
|
|
||
|
|
export default compose(
|
||
|
|
graphql(ListDNS, {
|
||
|
|
options: ({ match }) => ({
|
||
|
|
variables: {
|
||
|
|
name: get(match, 'params.instance')
|
||
|
|
}
|
||
|
|
}),
|
||
|
|
props: ({ data: { loading, error, variables, ...rest } }) => ({
|
||
|
|
instance: find(get(rest, 'machines', []), ['name', variables.name]),
|
||
|
|
loading,
|
||
|
|
error
|
||
|
|
})
|
||
|
|
})
|
||
|
|
)(DNS);
|