feat: simplified tx exports
This commit is contained in:
parent
9ec3282ea2
commit
c5d9beea04
2 changed files with 51 additions and 14 deletions
|
|
@ -129,22 +129,31 @@ const styles = {
|
||||||
const useStyles = makeStyles(styles)
|
const useStyles = makeStyles(styles)
|
||||||
const ALL = 'all'
|
const ALL = 'all'
|
||||||
const RANGE = 'range'
|
const RANGE = 'range'
|
||||||
|
const ADVANCED = 'advanced'
|
||||||
|
const SIMPLIFIED = 'simplified'
|
||||||
|
|
||||||
const LogsDownloaderPopover = ({
|
const LogsDownloaderPopover = ({
|
||||||
name,
|
name,
|
||||||
query,
|
queries,
|
||||||
args,
|
args,
|
||||||
title,
|
title,
|
||||||
getLogs,
|
getLogs,
|
||||||
timezone
|
timezone,
|
||||||
|
getSimplifiedLogs
|
||||||
}) => {
|
}) => {
|
||||||
const [selectedRadio, setSelectedRadio] = useState(ALL)
|
const [selectedRadio, setSelectedRadio] = useState(ALL)
|
||||||
|
const [selectedAdvancedRadio, setSelectedAdvancedRadio] = useState(ADVANCED)
|
||||||
|
|
||||||
const [range, setRange] = useState({ from: null, until: null })
|
const [range, setRange] = useState({ from: null, until: null })
|
||||||
const [anchorEl, setAnchorEl] = useState(null)
|
const [anchorEl, setAnchorEl] = useState(null)
|
||||||
const [fetchLogs] = useLazyQuery(query, {
|
const [fetchLogs] = useLazyQuery(queries[0], {
|
||||||
onCompleted: data => createLogsFile(getLogs(data), range)
|
onCompleted: data => createLogsFile(getLogs(data), range)
|
||||||
})
|
})
|
||||||
|
|
||||||
|
const [fetchSimplifiedLogs] = useLazyQuery(queries[1], {
|
||||||
|
onCompleted: data => createLogsFile(getSimplifiedLogs(data), range)
|
||||||
|
})
|
||||||
|
|
||||||
const classes = useStyles()
|
const classes = useStyles()
|
||||||
|
|
||||||
const dateRangePickerClasses = {
|
const dateRangePickerClasses = {
|
||||||
|
|
@ -158,6 +167,12 @@ const LogsDownloaderPopover = ({
|
||||||
if (selectedRadio === ALL) setRange({ from: null, until: null })
|
if (selectedRadio === ALL) setRange({ from: null, until: null })
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const handleAdvancedRadioButtons = evt => {
|
||||||
|
const selectedAdvancedRadio = R.path(['target', 'value'])(evt)
|
||||||
|
setSelectedAdvancedRadio(selectedAdvancedRadio)
|
||||||
|
if (selectedAdvancedRadio === ALL) setRange({ from: null, until: null })
|
||||||
|
}
|
||||||
|
|
||||||
const handleRangeChange = useCallback(
|
const handleRangeChange = useCallback(
|
||||||
(from, until) => {
|
(from, until) => {
|
||||||
setRange({ from, until })
|
setRange({ from, until })
|
||||||
|
|
@ -165,9 +180,11 @@ const LogsDownloaderPopover = ({
|
||||||
[setRange]
|
[setRange]
|
||||||
)
|
)
|
||||||
|
|
||||||
const downloadLogs = (range, args, fetchLogs) => {
|
const downloadLogs = (range, args) => {
|
||||||
|
const fetch =
|
||||||
|
selectedAdvancedRadio === SIMPLIFIED ? fetchSimplifiedLogs : fetchLogs
|
||||||
if (selectedRadio === ALL) {
|
if (selectedRadio === ALL) {
|
||||||
fetchLogs({
|
fetch({
|
||||||
variables: {
|
variables: {
|
||||||
...args
|
...args
|
||||||
}
|
}
|
||||||
|
|
@ -179,7 +196,7 @@ const LogsDownloaderPopover = ({
|
||||||
if (moment(range.from).isSame(range.until, 'day')) range.until = moment()
|
if (moment(range.from).isSame(range.until, 'day')) range.until = moment()
|
||||||
|
|
||||||
if (selectedRadio === RANGE) {
|
if (selectedRadio === RANGE) {
|
||||||
fetchLogs({
|
fetch({
|
||||||
variables: {
|
variables: {
|
||||||
...args,
|
...args,
|
||||||
from: range.from,
|
from: range.from,
|
||||||
|
|
@ -218,7 +235,9 @@ const LogsDownloaderPopover = ({
|
||||||
|
|
||||||
const radioButtonOptions = [
|
const radioButtonOptions = [
|
||||||
{ display: 'All logs', code: ALL },
|
{ display: 'All logs', code: ALL },
|
||||||
{ display: 'Date range', code: RANGE }
|
{ display: 'Date range', code: RANGE },
|
||||||
|
{ display: 'Advanced logs', code: ADVANCED },
|
||||||
|
{ display: 'Simplified logs', code: SIMPLIFIED }
|
||||||
]
|
]
|
||||||
|
|
||||||
const open = Boolean(anchorEl)
|
const open = Boolean(anchorEl)
|
||||||
|
|
@ -240,7 +259,7 @@ const LogsDownloaderPopover = ({
|
||||||
<RadioGroup
|
<RadioGroup
|
||||||
name="logs-select"
|
name="logs-select"
|
||||||
value={selectedRadio}
|
value={selectedRadio}
|
||||||
options={radioButtonOptions}
|
options={radioButtonOptions.slice(0, 2)}
|
||||||
ariaLabel="logs-select"
|
ariaLabel="logs-select"
|
||||||
onChange={handleRadioButtons}
|
onChange={handleRadioButtons}
|
||||||
className={classes.radioButtons}
|
className={classes.radioButtons}
|
||||||
|
|
@ -265,10 +284,18 @@ const LogsDownloaderPopover = ({
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
<div className={classes.radioButtonsContainer}>
|
||||||
|
<RadioGroup
|
||||||
|
name="simplified-tx-logs"
|
||||||
|
value={selectedAdvancedRadio}
|
||||||
|
options={radioButtonOptions.slice(2, 4)}
|
||||||
|
ariaLabel="simplified-tx-logs"
|
||||||
|
onChange={handleAdvancedRadioButtons}
|
||||||
|
className={classes.radioButtons}
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
<div className={classes.download}>
|
<div className={classes.download}>
|
||||||
<Link
|
<Link color="primary" onClick={() => downloadLogs(range, args)}>
|
||||||
color="primary"
|
|
||||||
onClick={() => downloadLogs(range, args, fetchLogs)}>
|
|
||||||
Download
|
Download
|
||||||
</Link>
|
</Link>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -56,6 +56,12 @@ const GET_TRANSACTION_FILTERS = gql`
|
||||||
}
|
}
|
||||||
`
|
`
|
||||||
|
|
||||||
|
const GET_SIMPLIFIED_TRANSACTIONS_CSV = gql`
|
||||||
|
query transactions($limit: Int, $from: Date, $until: Date) {
|
||||||
|
simplifiedTransactionsCsv(limit: $limit, from: $from, until: $until)
|
||||||
|
}
|
||||||
|
`
|
||||||
|
|
||||||
const GET_TRANSACTIONS = gql`
|
const GET_TRANSACTIONS = gql`
|
||||||
query transactions(
|
query transactions(
|
||||||
$limit: Int
|
$limit: Int
|
||||||
|
|
@ -276,10 +282,14 @@ const Transactions = () => {
|
||||||
<LogsDowloaderPopover
|
<LogsDowloaderPopover
|
||||||
title="Download logs"
|
title="Download logs"
|
||||||
name="transactions"
|
name="transactions"
|
||||||
query={GET_TRANSACTIONS_CSV}
|
queries={[
|
||||||
args={{ timezone }}
|
GET_TRANSACTIONS_CSV,
|
||||||
|
GET_SIMPLIFIED_TRANSACTIONS_CSV
|
||||||
|
]}
|
||||||
getLogs={logs => R.path(['transactionsCsv'])(logs)}
|
getLogs={logs => R.path(['transactionsCsv'])(logs)}
|
||||||
timezone={timezone}
|
getSimplifiedLogs={logs =>
|
||||||
|
R.path(['simplifiedTransactionsCsv'])(logs)
|
||||||
|
}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue