Skip to content

Instantly share code, notes, and snippets.

@chroder

chroder/App.js

Created Sep 17, 2018
Embed
What would you like to do?
import React from 'react';
import PropTypes from 'prop-types';
// Import the standard Button from the default component library
import { Button } from '@deskpro/apps-components';
class App extends React.Component {
static propTypes = {
dpapp: PropTypes.object.isRequired,
};
state = {
person: null,
};
componentDidMount() {
// dpapp is injected into your App automatically.
// It is the main interface between your app and Deskpro itself.
const dpapp = this.props.dpapp;
// Here you see we're accessing context information,
// in this case we're getting ahold of the ticket context.
const ticketContext = dpapp.context.get('ticket');
// And from that, we can interact with the ticket in various
// ways. In this case we're just loading up some info about the user
ticketContext.get('person').then(person => this.setState({ person }))
}
render() {
const person = this.state.person;
if (!person) {
return (<div>Loading...</div>);
}
const primaryEmail = person.emails[0];
return (
<div>
<p>Find {person.name} in our other systems</p>
<p>
<Button
appearance="primary"
onClick={() => window.open(`https://members.example.com/${primaryEmail}`)}
>Find in members area</Button>
</p>
<p>
<Button
appearance="primary"
onClick={() => window.open(`https://accounts.example.com/${primaryEmail}`)}
>Find in accounts</Button>
</p>
</div>
);
}
}
export default App;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.