apps/khata-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

filter-by-payee-and-tags #3

Merged
aetos merged 3 commits from filter-by-payee-and-tags into main 2026-05-12 06:24:48 +00:00
Conversation 0 Commits 3 Files Changed 3 +46 -29
1 changed files with 46 additions and 29 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 3c3afffef8 - Show all commits

75
src/Dashboard.tsx
View File

@@ -101,36 +101,53 @@ export default function Dashboard() {
const data = prepareReport(report.data.data);
return (
<Box>
<Paper sx={{ m: 2, p: 2, display: "flex", gap: 2, alignItems: "center" }} elevation={0} variant="outlined">
<Autocomplete
multiple
freeSolo
options={loadedPayees}
value={payeeInput}
onChange={(_, val) => setPayeeInput(val as string[])}
renderInput={(params) => <TextField {...params} label="Filter by Payee" size="small" />}
sx={{ minWidth: 250, flex: 1 }}
/>
<Autocomplete
multiple
freeSolo
options={loadedTags}
value={tagsInput}
onChange={(_, val) => setTagsInput(val as string[])}
renderInput={(params) => <TextField {...params} label="Filter by Tags" size="small" />}
sx={{ minWidth: 250, flex: 1 }}
/>
<Button
variant="contained"
onClick={() => {
setAppliedPayees(payeeInput);
setAppliedTags(tagsInput);
}}
disabled={isLoading}
<Container>
<Paper
sx={{
mt: 4,
p: 2,
display: "flex",
flexDirection: { xs: "column", sm: "row" },
gap: 2,
alignItems: { xs: "stretch", sm: "center" },
borderRadius: 4,
mb: -2 // pull up to be closer to the dashboard container below
}}
elevation={0}
variant="outlined"
>
Apply
</Button>
</Paper>
<Autocomplete
multiple
freeSolo
options={loadedPayees}
value={payeeInput}
onChange={(_, val) => setPayeeInput(val as string[])}
renderInput={(params) => <TextField {...params} label="Filter by Payee" />}
sx={{ minWidth: { sm: 250 }, flex: 1 }}
/>
<Autocomplete
multiple
freeSolo
options={loadedTags}
value={tagsInput}
onChange={(_, val) => setTagsInput(val as string[])}
renderInput={(params) => <TextField {...params} label="Filter by Tags" />}
sx={{ minWidth: { sm: 250 }, flex: 1 }}
/>
<Button
variant="contained"
size="large"
onClick={() => {
setAppliedPayees(payeeInput);
setAppliedTags(tagsInput);
}}
disabled={isLoading}
sx={{ height: 56, borderRadius: 2 }}
>
Apply
</Button>
</Paper>
</Container>
<ConfigurableDashboard
config={configuration}
data={data}