Skip to content

Commit 3021fce

Browse files
bosko-mbosko-m
authored
Merge pull request #4066 from IntersectMBO/develop
v2.0.35.2
2 parents 979fdff + 117fe94 commit 3021fce

File tree

16 files changed

+375
-369
lines changed

16 files changed

+375
-369
lines changed

‎govtool/frontend/package-lock.json‎

Lines changed: 8 additions & 8 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎govtool/frontend/package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -27,9 +27,9 @@
2727
"@emotion/styled": "^11.11.0",
2828
"@emurgo/cardano-serialization-lib-asmjs": "^14.1.1",
2929
"@hookform/resolvers": "^3.3.1",
30-
"@intersect.mbo/govtool-outcomes-pillar-ui": "v1.5.7",
30+
"@intersect.mbo/govtool-outcomes-pillar-ui": "v1.5.8",
3131
"@intersect.mbo/intersectmbo.org-icons-set": "^1.0.8",
32-
"@intersect.mbo/pdf-ui": "1.0.13-beta",
32+
"@intersect.mbo/pdf-ui": "1.0.14-beta",
3333
"@mui/icons-material": "^5.14.3",
3434
"@mui/material": "^5.14.4",
3535
"@noble/ed25519": "^2.3.0",

‎govtool/frontend/src/components/molecules/DataActionsBar.tsx‎

Lines changed: 46 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -74,8 +74,9 @@ export const DataActionsBar: FC<DataActionsBarProps> = ({
7474
alignItems="center"
7575
display="flex"
7676
justifyContent="space-between"
77-
gap={1.5}
78-
flexWrap="wrap"
77+
gap={{ xs: 0.75, sm: 1.5 }}
78+
flexWrap={{ xs: "wrap", sm: "nowrap" }}
79+
width="100%"
7980
>
8081
<InputBase
8182
inputProps={{ "data-testid": "search-input" }}
@@ -93,15 +94,15 @@ export const DataActionsBar: FC<DataActionsBarProps> = ({
9394
/>
9495
}
9596
endAdornment={
96-
searchText && (
97+
searchText ? (
9798
<IconButton
9899
size="small"
99100
onClick={() => setSearchText("")}
100101
sx={{ ml: 1 }}
101102
>
102103
<CloseIcon fontSize="small" />
103104
</IconButton>
104-
)
105+
) : null
105106
}
106107
sx={{
107108
bgcolor: "white",
@@ -113,38 +114,50 @@ export const DataActionsBar: FC<DataActionsBarProps> = ({
113114
fontWeight: 500,
114115
height: 48,
115116
padding: "16px 24px",
116-
maxWidth: 500,
117-
flex: "0 0 auto",
117+
flex: "1 1 0",
118+
minWidth: 0,
119+
maxWidth: "100%",
118120
}}
119121
/>
120122

121-
<OrderActionsChip
122-
chosenFiltersLength={chosenFiltersLength}
123-
filtersOpen={effectiveFiltersOpen}
124-
isFiltering={isFiltering}
125-
setFiltersOpen={setEffectiveFiltersOpen}
126-
chosenSorting={chosenSorting}
127-
setSortOpen={setEffectiveSortOpen}
128-
sortOpen={effectiveSortOpen}
123+
<Box
124+
sx={{
125+
display: "flex",
126+
alignItems: "center",
127+
gap: { xs: 0.5, sm: 1.25 },
128+
flex: "0 0 auto",
129+
flexShrink: 0,
130+
mt: { xs: 1, sm: 0 },
131+
}}
129132
>
130-
{effectiveFiltersOpen && (
131-
<DataActionsFilters
132-
chosenFilters={chosenFilters}
133-
setChosenFilters={setChosenFilters}
134-
closeFilters={closeFilters}
135-
options={filterOptions}
136-
title={filtersTitle}
137-
/>
138-
)}
139-
{effectiveSortOpen && (
140-
<DataActionsSorting
141-
chosenSorting={chosenSorting}
142-
setChosenSorting={setChosenSorting}
143-
closeSorts={closeSorts}
144-
options={sortOptions}
145-
/>
146-
)}
147-
</OrderActionsChip>
133+
<OrderActionsChip
134+
chosenFiltersLength={chosenFiltersLength}
135+
filtersOpen={effectiveFiltersOpen}
136+
isFiltering={isFiltering}
137+
setFiltersOpen={setEffectiveFiltersOpen}
138+
chosenSorting={chosenSorting}
139+
setSortOpen={setEffectiveSortOpen}
140+
sortOpen={effectiveSortOpen}
141+
>
142+
{effectiveFiltersOpen && (
143+
<DataActionsFilters
144+
chosenFilters={chosenFilters}
145+
setChosenFilters={setChosenFilters}
146+
closeFilters={closeFilters}
147+
options={filterOptions}
148+
title={filtersTitle}
149+
/>
150+
)}
151+
{effectiveSortOpen && (
152+
<DataActionsSorting
153+
chosenSorting={chosenSorting}
154+
setChosenSorting={setChosenSorting}
155+
closeSorts={closeSorts}
156+
options={sortOptions}
157+
/>
158+
)}
159+
</OrderActionsChip>
160+
</Box>
148161
</Box>
149162

150163
{selectedFilterItems.length > 0 && (
@@ -153,10 +166,7 @@ export const DataActionsBar: FC<DataActionsBarProps> = ({
153166
flexWrap="wrap"
154167
gap={1}
155168
alignItems="flex-start"
156-
sx={{
157-
mt: 2,
158-
"& > *": { flex: "0 0 auto", alignSelf: "flex-start" },
159-
}}
169+
sx={{ mt: 2, "& > *": { flex: "0 0 auto", alignSelf: "flex-start" } }}
160170
>
161171
{selectedFilterItems.map(({ key, label }) => (
162172
<ChipButton

‎govtool/frontend/src/components/organisms/DashboardDrawerMobile.tsx‎

Lines changed: 73 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -11,24 +11,34 @@ import { useFeatureFlag } from "@context";
1111
import { DashboardDrawerMobileProps } from "./types";
1212

1313
const DRAWER_PADDING = 2;
14-
// 8 is number of multiple in Material UI 2 is left and right side
1514
const CALCULATED_DRAWER_PADDING = DRAWER_PADDING * 8 * 2;
1615

16+
type DrawerLinkBase = {
17+
dataTestId?: string;
18+
label: string;
19+
navTo: string;
20+
newTabLink?: string;
21+
};
22+
23+
type NavItem = DrawerLinkBase & {
24+
childNavItems?: DrawerLinkBase[];
25+
};
26+
1727
export const DashboardDrawerMobile = ({
1828
isDrawerOpen,
1929
setIsDrawerOpen,
2030
}: DashboardDrawerMobileProps) => {
21-
const { isProposalDiscussionForumEnabled, isGovernanceOutcomesPillarEnabled } = useFeatureFlag();
31+
const {
32+
isProposalDiscussionForumEnabled,
33+
isGovernanceOutcomesPillarEnabled,
34+
} = useFeatureFlag();
2235
const { screenWidth } = useScreenDimension();
2336
const { voter } = useGetVoterInfo();
2437

25-
const openDrawer = () => {
26-
setIsDrawerOpen(true);
27-
};
38+
const openDrawer = () => setIsDrawerOpen(true);
39+
const closeDrawer = () => setIsDrawerOpen(false);
2840

29-
const closeDrawer = () => {
30-
setIsDrawerOpen(false);
31-
};
41+
const navItems = CONNECTED_NAV_ITEMS as unknown as NavItem[];
3242

3343
return (
3444
<SwipeableDrawer
@@ -73,65 +83,72 @@ export const DashboardDrawerMobile = ({
7383
<img alt="drawer" src={ICONS.closeDrawerIcon} />
7484
</IconButton>
7585
</Box>
86+
7687
<Grid container direction="column" rowGap={4} mt={6}>
77-
{CONNECTED_NAV_ITEMS.map((navItem) => (
78-
<Grid item>
88+
{navItems.map((navItem, i) => (
89+
<Grid
90+
item
91+
key={
92+
navItem.dataTestId ??
93+
navItem.label ??
94+
navItem.navTo ??
95+
`nav-${i}`
96+
}
97+
>
7998
<Link
8099
{...navItem}
81100
size="big"
82101
onClick={() => {
83-
if (navItem.newTabLink) {
84-
openInNewTab(navItem.newTabLink);
85-
}
86-
setIsDrawerOpen(false);
87-
}}
102+
if (navItem.newTabLink) openInNewTab(navItem.newTabLink);
103+
setIsDrawerOpen(false);
104+
}}
88105
isConnectWallet
89106
/>
90-
{navItem.childNavItems && (
91-
<Grid
92-
container
93-
direction="column"
94-
rowGap={4}
95-
mt={3}
96-
pl={3}
97-
>
98-
{navItem.childNavItems.map((childItem) => {
99-
if (
100-
!isProposalDiscussionForumEnabled &&
101-
childItem.dataTestId === "proposal-discussion-link"
102-
) {
103-
return null;
104-
}
105-
106-
if (
107-
!isGovernanceOutcomesPillarEnabled &&
108-
(childItem.dataTestId === "governance-actions-voted-by-me-link" ||
109-
childItem.dataTestId === "governance-actions-outcomes-link")
110-
) {
111-
return null;
112-
}
113107

114-
return (
115-
<Link
116-
key={childItem.label}
117-
{...childItem}
118-
size="big"
119-
onClick={() => {
120-
if (childItem.newTabLink) {
121-
openInNewTab(childItem.newTabLink);
122-
}
123-
setIsDrawerOpen(false);
124-
}}
125-
isConnectWallet
126-
/>
127-
);
128-
})}
129-
</Grid>
130-
)}
108+
{!!navItem.childNavItems?.length && (
109+
<Grid container direction="column" rowGap={4} mt={3} pl={3}>
110+
{navItem.childNavItems.map((childItem, ci) => {
111+
if (
112+
!isProposalDiscussionForumEnabled &&
113+
childItem.dataTestId === "proposal-discussion-link"
114+
) {
115+
return null;
116+
}
117+
if (
118+
!isGovernanceOutcomesPillarEnabled &&
119+
(childItem.dataTestId ===
120+
"governance-actions-voted-by-me-link" ||
121+
childItem.dataTestId ===
122+
"governance-actions-outcomes-link")
123+
) {
124+
return null;
125+
}
126+
return (
127+
<Link
128+
key={
129+
childItem.dataTestId ??
130+
childItem.label ??
131+
childItem.navTo ??
132+
`child-${i}-${ci}`
133+
}
134+
{...childItem}
135+
size="big"
136+
onClick={() => {
137+
if (childItem.newTabLink)
138+
openInNewTab(childItem.newTabLink);
139+
setIsDrawerOpen(false);
140+
}}
141+
isConnectWallet
142+
/>
143+
);
144+
})}
145+
</Grid>
146+
)}
131147
</Grid>
132-
))}
148+
))}
133149
</Grid>
134150
</Box>
151+
135152
{(voter?.isRegisteredAsDRep || voter?.isRegisteredAsSoleVoter) && (
136153
<DRepInfoCard />
137154
)}

0 commit comments

Comments
 (0)