Skip to content

Commit

Permalink
Added new provider for Workload status
Browse files Browse the repository at this point in the history
  • Loading branch information
David Santia committed Aug 27, 2021
1 parent a2d5808 commit ea7ddc6
Show file tree
Hide file tree
Showing 9 changed files with 295 additions and 80 deletions.
153 changes: 83 additions & 70 deletions components/status-page.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import 'web-animations-js';

import Network from '../utilities/network';
import NRQLHelper from '../utilities/nrql-helper';
import WorkloadHelper from '../utilities/workload-helper';
import RSSHelper from '../utilities/rss-helper';
import StatuspalHelper from '../utilities/statuspal-helper';
import CurrentIncidents from './current-incidents';
Expand All @@ -23,6 +24,7 @@ import GitHubLogo from '../assets/logo-github.svg';
import NewRelicLogo from '../assets/logo-new-relic.png';
import JiraLogo from '../assets/logo-jira.png';
import GoogleCloudProviderLogo from '../assets/logo-google-cloud.svg';
import TextFieldWrapper from "../nerdlets/status-page-dashboard/TextFieldWrapper/TextFieldWrapper";

const createOption = label => ({
label,
Expand Down Expand Up @@ -53,6 +55,7 @@ const PROVIDERS = [
];

const NRQL_PROVIDER_NAME = 'nrql';
const WORKLOAD_PROVIDER_NAME = 'workload';
const RSS_PROVIDER_NAME = 'rss';
const STATUSPAL_PROVIDER_NAME = 'statusPal';

Expand Down Expand Up @@ -81,6 +84,7 @@ export default class StatusPage extends React.PureComponent {
editedServiceName: this.props.hostname.serviceName,
editedHostName: this.props.hostname.hostName,
editedNrqlQuery: this.props.hostname.nrqlQuery,
editedWorkloadGuid: this.props.hostname.workloadGuid,
editedSubDomain: this.props.hostname.subDomain,
editedHostProvider: this.props.hostname.provider,
editedHostLogo: this.props.hostname.hostLogo,
Expand Down Expand Up @@ -113,6 +117,7 @@ export default class StatusPage extends React.PureComponent {
editedHostProvider,
editedHostName,
editedNrqlQuery,
editedWorkloadGuid,
editedSubDomain
} = this.state;

Expand All @@ -123,6 +128,14 @@ export default class StatusPage extends React.PureComponent {
accountId
);

this.StatusPageNetwork.pollCurrentIncidents(this.setData);
} else if (editedHostProvider === WORKLOAD_PROVIDER_NAME) {
this.StatusPageNetwork = new WorkloadHelper(
editedWorkloadGuid,
refreshRate,
accountId
);

this.StatusPageNetwork.pollCurrentIncidents(this.setData);
} else if (editedHostProvider === RSS_PROVIDER_NAME) {
this.StatusPageNetwork = new RSSHelper(editedHostName, refreshRate);
Expand Down Expand Up @@ -180,7 +193,10 @@ export default class StatusPage extends React.PureComponent {
autoSetLogo(hostname) {
const { serviceName, hostName, hostLogo, provider } = hostname;

if (provider === NRQL_PROVIDER_NAME) {
if (
provider === NRQL_PROVIDER_NAME ||
provider === WORKLOAD_PROVIDER_NAME
) {
if (hostLogo) {
return <img src={hostLogo} className="service-logo" alt="nrql" />;
} else {
Expand Down Expand Up @@ -355,6 +371,7 @@ export default class StatusPage extends React.PureComponent {
hostname: hostname,
provider: provider,
nrqlQuery: this.state.editedNrqlQuery,
workloadGuid: this.state.editedWorkloadGuid,
subDomain: this.state.editedSubDomain,
accountId: this.props.accountId,
timelineItemIndex: selectedIndex
Expand Down Expand Up @@ -487,6 +504,70 @@ export default class StatusPage extends React.PureComponent {
renderSettings() {
const { hostname } = this.props;

const providerSettings = (() => {
if (hostname.provider === NRQL_PROVIDER_NAME) {
return (
<TextField
label="NRQL"
placeholder="Put your NRQL query here"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedNrqlQuery: event.target.value
}))
}
defaultValue={hostname.nrqlQuery}
/>
);
} else if (hostname.provider === WORKLOAD_PROVIDER_NAME) {
return (
<TextField
label="Workload"
placeholder="Put your Workload entity guid here"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedWorkloadguid: event.target.value
}))
}
defaultValue={hostname.workloadGuid}
/>
);
} else if (hostname.provider === STATUSPAL_PROVIDER_NAME) {
return (
<TextField
label="Subdomain"
placeholder="myservice.com"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedSubDomain: event.target.value
}))
}
defaultValue={hostname.subDomain}
/>
);
} else {
return (
<TextField
label="Hostname"
placeholder="https://status.myservice.com/"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedHostName: event.target.value
}))
}
defaultValue={hostname.hostName}
/>
);
}
})();

return (
<div
className="status-page-settings-container"
Expand All @@ -504,75 +585,7 @@ export default class StatusPage extends React.PureComponent {
}
defaultValue={hostname.serviceName}
/>
{hostname.provider === NRQL_PROVIDER_NAME ? (
<TextField
label="NRQL"
placeholder="Put your NRQL query here"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedNrqlQuery: event.target.value
}))
}
defaultValue={hostname.nrqlQuery}
/>
) : (
<>
{hostname.provider === STATUSPAL_PROVIDER_NAME ? (
<TextField
label="Subdomain"
placeholder="myservice.com"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedSubDomain: event.target.value
}))
}
defaultValue={hostname.subDomain}
/>
) : (
<TextField
label="Hostname"
placeholder="https://status.myservice.com/"
className="status-page-setting"
onChange={() =>
this.setState(previousState => ({
...previousState,
editedHostName: event.target.value
}))
}
defaultValue={hostname.hostName}
/>
)}

<Dropdown
title={
PROVIDERS.find(
element => element.value === this.state.editedHostProvider
)?.label
}
label="Provider"
className="status-page-setting"
>
{PROVIDERS.map(({ value, label }) => (
<DropdownItem
key={value}
selected={hostname.provider === value}
onClick={() =>
this.setState(previousState => ({
...previousState,
editedHostProvider: value
}))
}
>
{label}
</DropdownItem>
))}
</Dropdown>
</>
)}
{providerSettings}
<TextField
label="Service logo"
className="status-page-setting"
Expand Down
2 changes: 2 additions & 0 deletions nerdlets/service-details/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@ export default class ServiceDetailsWrapper extends React.PureComponent {
timelineItemIndex,
refreshRate,
nrqlQuery,
workloadGuid,
subDomain,
accountId
} = nerdletUrlState;
Expand All @@ -30,6 +31,7 @@ export default class ServiceDetailsWrapper extends React.PureComponent {
refreshRate={refreshRate}
timelineItemIndex={timelineItemIndex}
nrqlQuery={nrqlQuery}
workloadGuid={workloadGuid}
subDomain={subDomain}
accountId={accountId}
/>
Expand Down
24 changes: 22 additions & 2 deletions nerdlets/service-details/service-details.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,10 @@ import { Icon, Button } from 'nr1';
import NRQLHelper from '../../utilities/nrql-helper';
import RSSHelper from '../../utilities/rss-helper';
import StatuspalHelper from '../../utilities/statuspal-helper';
import WorkloadHelper from '../../utilities/workload-helper';

const NRQL_PROVIDER_NAME = 'nrql';
const WORKLOAD_PROVIDER_NAME = 'workload';
const RSS_PROVIDER_NAME = 'rss';
const STATUSPAL_PROVIDER_NAME = 'statusPal';

Expand All @@ -20,6 +22,7 @@ export default class ServiceDetails extends React.PureComponent {
refreshRate: PropTypes.number,
timelineItemIndex: PropTypes.number,
nrqlQuery: PropTypes.string,
workloadGuid: PropTypes.string,
subDomain: PropTypes.string,
accountId: PropTypes.number
};
Expand Down Expand Up @@ -50,6 +53,7 @@ export default class ServiceDetails extends React.PureComponent {
refreshRate,
provider,
nrqlQuery,
workloadGuid,
subDomain
} = this.props;

Expand All @@ -61,7 +65,8 @@ export default class ServiceDetails extends React.PureComponent {
if (
prevProps.hostname !== hostname ||
prevProps.subDomain !== subDomain ||
prevProps.nrqlQuery !== nrqlQuery
prevProps.nrqlQuery !== nrqlQuery ||
prevProps.workloadGuid !== workloadGuid
) {
// eslint-disable-next-line react/no-did-update-set-state
this.setState({ currentIncidents: undefined });
Expand All @@ -81,6 +86,13 @@ export default class ServiceDetails extends React.PureComponent {
refreshRate,
accountId
);
} else if (provider === WORKLOAD_PROVIDER_NAME) {
const { workloadGuid, accountId } = this.props;
this.statusPageNetwork = new WorkloadHelper(
workloadGuid,
refreshRate,
accountId
);
} else if (provider === RSS_PROVIDER_NAME) {
this.statusPageNetwork = new RSSHelper(hostname, refreshRate);
} else if (provider === STATUSPAL_PROVIDER_NAME) {
Expand Down Expand Up @@ -155,6 +167,14 @@ export default class ServiceDetails extends React.PureComponent {
buildTimelineItemDetails(incident) {
const incident_updates = incident.incident_updates.map(
(incident_update, index) => {
let body = <span className="value">{incident_update.body}</span>;
if (incident_update.link_url) {
body = (
<a href={incident_update.link_url} target="_blank" rel="noreferrer">
{incident_update.body}
</a>
);
}
return (
<li
key={`${incident_update.created_at}-${index}`}
Expand All @@ -163,7 +183,7 @@ export default class ServiceDetails extends React.PureComponent {
<span className="key">
{dayjs(incident_update.display_at).format('h:mm a')}:
</span>
<span className="value">{incident_update.body}</span>
{body}
</li>
);
}
Expand Down
Loading

0 comments on commit ea7ddc6

Please sign in to comment.