Skip to content

Commit

Permalink
feat: add HelpModal component
Browse files Browse the repository at this point in the history
  • Loading branch information
shahramk committed Feb 28, 2023
1 parent 85661ee commit 08963d0
Show file tree
Hide file tree
Showing 3 changed files with 143 additions and 43 deletions.
153 changes: 110 additions & 43 deletions nerdlets/shared/components/wrapper.js
Original file line number Diff line number Diff line change
@@ -1,59 +1,126 @@
import React from 'react';
import { get } from 'lodash';
import { BASE_NERDGRAPH_QUERY } from '../utils/queries';
import { NerdletStateContext, NerdGraphQuery, Spinner } from 'nr1';
import {
Icon,
nerdlet,
NerdletStateContext,
NerdGraphQuery,
Spinner
} from 'nr1';

import { NerdGraphError, EmptyState } from '@newrelic/nr1-community';

import { HelpModal } from 'nr-labs-components';

import NrqlFactory from '../nrql-factory';
import Breakdown from './breakdown';

export default class Wrapper extends React.PureComponent {
state = {
helpModalOpen: false
};

componentDidMount() {
nerdlet.setConfig({
actionControls: true,
actionControlButtons: [
{
label: 'Help',
hint: 'Quick links to get support',
type: 'primary',
iconType: Icon.TYPE.INTERFACE__INFO__HELP,
onClick: () => this.setHelpModalOpen(true)
}
]
});
}

setHelpModalOpen = helpModalOpen => {
this.setState({ helpModalOpen });
};

render() {
const { helpModalOpen } = this.state;

return (
<NerdletStateContext.Consumer>
{nerdletUrlState => {
return (
<NerdGraphQuery
query={BASE_NERDGRAPH_QUERY}
variables={{ entityGuid: nerdletUrlState.entityGuid }}
fetchPolicyType={NerdGraphQuery.FETCH_POLICY_TYPE.NO_CACHE}
>
{({ data, loading, error }) => {
if (loading) {
return <Spinner fillContainer />;
}
<>
<NerdletStateContext.Consumer>
{nerdletUrlState => {
return (
<NerdGraphQuery
query={BASE_NERDGRAPH_QUERY}
variables={{ entityGuid: nerdletUrlState.entityGuid }}
fetchPolicyType={NerdGraphQuery.FETCH_POLICY_TYPE.NO_CACHE}
>
{({ data, loading, error }) => {
if (loading) {
return <Spinner fillContainer />;
}

if (error) {
return <NerdGraphError error={error} />;
}
// console.debug(data);
const entity = get(data, 'actor.entity');
if (entity) {
const nrqlFactory = NrqlFactory.getFactory(data);
return (
<Breakdown
entity={entity}
nrqlFactory={nrqlFactory}
nerdletUrlState={nerdletUrlState}
/>
);
} else {
return (
<div className="empty-state-container">
<EmptyState
heading="Site Analyzer is not available"
description="You have access to this entity, but Site Analyzer is not
enabled for Browser entities in this account. Please see
your Nerdpack Manager with concerns."
buttonText=""
if (error) {
return <NerdGraphError error={error} />;
}
// console.debug(data);
const entity = get(data, 'actor.entity');
if (entity) {
const nrqlFactory = NrqlFactory.getFactory(data);
return (
<Breakdown
entity={entity}
nrqlFactory={nrqlFactory}
nerdletUrlState={nerdletUrlState}
/>
</div>
);
);
} else {
return (
<div className="empty-state-container">
<EmptyState
heading="Site Analyzer is not available"
description="You have access to this entity, but Site Analyzer is not
enabled for Browser entities in this account. Please see
your Nerdpack Manager with concerns."
buttonText=""
/>
</div>
);
}
}}
</NerdGraphQuery>
);
}}
</NerdletStateContext.Consumer>
{helpModalOpen && (
<HelpModal
isModalOpen={helpModalOpen}
setModalOpen={this.setHelpModalOpen}
urls={{
docs: 'https://github.com/newrelic/nr1-status-pages#readme',
createIssue:
'https://github.com/newrelic/nr1-status-pages/issues/new?assignees=&labels=bug%2C+needs-triage&template=bug_report.md&title=',
createFeature:
'https://github.com/newrelic/nr1-status-pages/issues/new?assignees=&labels=enhancement%2C+needs-triage&template=enhancement.md&title=',
createQuestion:
'https://github.com/newrelic/nr1-status-pages/discussions/new/choose'
}}
ownerBadge={{
logo: {
src:
'https://drive.google.com/uc?id=1BdXVy2X34rufvG4_1BYb9czhLRlGlgsT',
alt: 'New Relic Labs'
},
blurb: {
text: 'This is a New Relic Labs open source app.',
link: {
text: 'Take a look at our other repos',
url:
'https://github.com/newrelic?q=nrlabs-viz&type=all&language=&sort='
}
}}
</NerdGraphQuery>
);
}}
</NerdletStateContext.Consumer>
}
}}
/>
)}
</>
);
}
}
32 changes: 32 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
},
"dependencies": {
"@newrelic/nr1-community": "^1.2.0",
"nr-labs-components": "github:newrelic/nr-labs-components",
"lodash": "^4.17.21",
"numeral": "^2.0.6",
"pretty-ms": "^6.0.1"
Expand Down

0 comments on commit 08963d0

Please # to comment.