umami/components/common/EventDataButton.js
Brian Cao e1f99a7d01
Rewrite admin. (#1713)
* Rewrite admin.

* Clean up password forms.

* Fix naming issues.

* CSS Naming.
2022-12-26 16:57:59 -08:00

50 lines
1.3 KiB
JavaScript

import List from 'assets/list-ul.svg';
import EventDataForm from 'components/forms/EventDataForm';
import PropTypes from 'prop-types';
import { useState } from 'react';
import { Button, Icon, Modal } from 'react-basics';
import { FormattedMessage } from 'react-intl';
import styles from './EventDataButton.module.css';
function EventDataButton({ websiteId }) {
const [showEventData, setShowEventData] = useState(false);
function handleClick() {
if (!showEventData) {
setShowEventData(true);
}
}
function handleClose() {
setShowEventData(false);
}
return (
<>
<Button
tooltip={<FormattedMessage id="label.event-data" defaultMessage="Event" />}
tooltipId="button-event"
size="small"
onClick={handleClick}
className={styles.button}
>
<Icon>
<List />
</Icon>
Event Data
</Button>
{showEventData && (
<Modal title={<FormattedMessage id="label.event-data" defaultMessage="Query Event Data" />}>
<EventDataForm websiteId={websiteId} onClose={handleClose} />
</Modal>
)}
</>
);
}
EventDataButton.propTypes = {
websiteId: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
};
export default EventDataButton;