Skip to content

Commit

Permalink
Merge pull request #3307 from cardano-foundation/feat/MET-2061-add-fl…
Browse files Browse the repository at this point in the history 
…ag-conway-era

feat: MET-2061 add flag conway era
  • Loading branch information
@Sotatek-TaiTruong
Sotatek-TaiTruong committed Apr 16, 2024
2 parents 420d14a + d12f77f commit 5b73657
Show file tree
Hide file tree
Showing 10 changed files with 178 additions and 140 deletions.
1 change: 1 addition & 0 deletions docker-compose.yml
View file
Expand Up @@ -26,5 +26,6 @@ services:
- REACT_APP_ADA_HANDLE_API=${REACT_APP_ADA_HANDLE_API}
- REACT_APP_BOLNISI_NAME_API=${REACT_APP_BOLNISI_NAME_API}
- REACT_APP_API_URL_COIN_GECKO=${REACT_APP_API_URL_COIN_GECKO}
- REACT_APP_FF_GLOBAL_IS_CONWAY_ERA=${REACT_APP_FF_GLOBAL_IS_CONWAY_ERA}
ports:
- "${PORT}:80"
1 change: 1 addition & 0 deletions env.global.tmp.js
View file
Expand Up @@ -20,3 +20,4 @@ window.env.REACT_APP_CARDANO_NEWS_URL = `$REACT_APP_CARDANO_NEWS_URL`;
window.env.REACT_APP_ADA_HANDLE_API = `$REACT_APP_ADA_HANDLE_API`;
window.env.REACT_APP_BOLNISI_NAME_API = `$REACT_APP_BOLNISI_NAME_API`;
window.env.REACT_APP_API_URL_COIN_GECKO = `$REACT_APP_API_URL_COIN_GECKO`;
window.env.REACT_APP_FF_GLOBAL_IS_CONWAY_ERA = `$REACT_APP_FF_GLOBAL_IS_CONWAY_ERA`;
2 changes: 2 additions & 0 deletions src/commons/utils/constants.ts
View file
Expand Up @@ -134,6 +134,8 @@ export const EXT_ADA_PRICE_URL =
process.env.REACT_APP_EXT_ADA_PRICE_URL || get(window, "env.REACT_APP_EXT_ADA_PRICE_URL");
export const BOLNISI_NAME_API = process.env.REACT_APP_BOLNISI_NAME_API || get(window, "env.REACT_APP_BOLNISI_NAME_API");
export const API_GECKO = process.env.REACT_APP_API_URL_COIN_GECKO || get(window, "env.REACT_APP_API_URL_COIN_GECKO");
export const IS_CONWAY_ERA =
(process.env.REACT_APP_FF_GLOBAL_IS_CONWAY_ERA || get(window, "env.REACT_APP_FF_GLOBAL_IS_CONWAY_ERA")) === "true";

export enum ACCOUNT_ERROR {
UNKNOWN_ERROR = "CC_1",
Expand Down
8 changes: 7 additions & 1 deletion src/components/DelegationPool/DelegationList/index.tsx
View file
Expand Up @@ -14,6 +14,7 @@ import ADAicon from "src/components/commons/ADAIcon";
import CustomFilterMultiRange from "src/components/commons/CustomFilterMultiRange";
import CustomTooltip from "src/components/commons/CustomTooltip";
import Table, { Column } from "src/components/commons/Table";
import { IS_CONWAY_ERA } from "src/commons/utils/constants";

import { AntSwitch, PoolName, ShowRetiredPools, TopSearchContainer } from "./styles";

Expand Down Expand Up @@ -194,7 +195,12 @@ const DelegationLists: React.FC = () => {
</TopSearchContainer>
<Table
{...fetchData}
columns={columns}
columns={columns.filter((col) => {
if ((col.key === "governanceParticipationRate" || col.key === "votingPower") && !IS_CONWAY_ERA) {
return false;
}
return true;
})}
total={{ count: fetchData.total, title: "Total", isDataOverSize: fetchData.isDataOverSize }}
onClickRow={(_, r: Delegators) => history.push(details.delegation(r.poolId), { fromPath })}
pagination={{
Expand Down
186 changes: 96 additions & 90 deletions src/components/commons/CustomFilterMultiRange/index.tsx
View file
Expand Up @@ -21,6 +21,7 @@ import { API } from "src/commons/utils/api";
import { LARGE_NUMBER_ABBREVIATIONS, formatADA, formatPercent } from "src/commons/utils/helper";
import { FilterWrapper } from "src/pages/NativeScriptsAndSC/styles";
import usePageInfo from "src/commons/hooks/usePageInfo";
import { IS_CONWAY_ERA } from "src/commons/utils/constants";

import { ApplyFilterButton, StyledInput } from "../CustomFilter/styles";
import { AccordionContainer, AccordionDetailsFilter, FilterContainer, StyledSlider } from "./styles";
Expand Down Expand Up @@ -373,98 +374,103 @@ const CustomFilterMultiRange: React.FC = () => {
</Box>
</AccordionDetailsFilter>
</AccordionContainer>
<AccordionContainer
expanded={expanded === "poolParticipation"}
onChange={handleChange("poolParticipation")}
>
<AccordionSummary>
<Box width={"100%"} display={"flex"} alignItems={"center"} justifyContent={"space-between"}>
<Box display={"flex"} alignItems={"center"}>
<CustomIcon icon={PoolParticipationIcon} fill={theme.palette.secondary[800]} height={18} />
<Box ml={1} color={({ palette }) => palette.secondary.main}>
{t("pool.poolParticipation")}
{IS_CONWAY_ERA && (
<>
<AccordionContainer
expanded={expanded === "poolParticipation"}
onChange={handleChange("poolParticipation")}
>
<AccordionSummary>
<Box width={"100%"} display={"flex"} alignItems={"center"} justifyContent={"space-between"}>
<Box display={"flex"} alignItems={"center"}>
<CustomIcon icon={PoolParticipationIcon} fill={theme.palette.secondary[800]} height={18} />
<Box ml={1} color={({ palette }) => palette.secondary.main}>
{t("pool.poolParticipation")}
</Box>
</Box>
<Box>
{expanded === "poolParticipation" ? (
<IoIosArrowUp color={theme.palette.secondary.main} />
) : (
<IoIosArrowDown color={theme.palette.secondary.main} />
)}
</Box>
</Box>
</Box>
<Box>
{expanded === "poolParticipation" ? (
<IoIosArrowUp color={theme.palette.secondary.main} />
) : (
<IoIosArrowDown color={theme.palette.secondary.main} />
)}
</Box>
</Box>
</AccordionSummary>
<AccordionDetailsFilter sx={{ background: "unset" }}>
<Box display="flex" alignItems="center" mb="30px" sx={{ gap: "14px" }}>
<Typography>{formatPercent(dataRange?.minGovParticipationRate) || `0%`}</Typography>
<StyledSlider
valueLabelFormat={(value) => formatPercent(value)}
data-testid="slider"
getAriaLabel={() => "Minimum distance"}
defaultValue={[
filterParams.minGovParticipationRate || 0,
initParams.maxGovParticipationRate || 0
]}
onChange={(e, newValue) =>
handleChangeValueRange(e, newValue, "minGovParticipationRate", "maxGovParticipationRate")
}
value={[
filterParams.minGovParticipationRate || 0,
filterParams.maxGovParticipationRate ?? (initParams.maxGovParticipationRate || 0)
]}
valueLabelDisplay="auto"
disableSwap
step={0.000001}
min={dataRange?.minGovParticipationRate || 0}
max={dataRange?.maxGovParticipationRate || 0}
/>
<Typography>{formatPercent(dataRange?.maxGovParticipationRate || 0) || `0%`}</Typography>
</Box>
</AccordionDetailsFilter>
</AccordionContainer>
<AccordionContainer expanded={expanded === "poolVoting"} onChange={handleChange("poolVoting")}>
<AccordionSummary>
<Box width={"100%"} display={"flex"} alignItems={"center"} justifyContent={"space-between"}>
<Box display={"flex"} alignItems={"center"}>
<CustomIcon icon={PoolVotingIcon} fill={theme.palette.secondary.light} height={18} />
<Box ml={1} color={({ palette }) => palette.secondary.main}>
{t("pool.poolVoting")}
</AccordionSummary>
<AccordionDetailsFilter sx={{ background: "unset" }}>
<Box display="flex" alignItems="center" mb="30px" sx={{ gap: "14px" }}>
<Typography>{formatPercent(dataRange?.minGovParticipationRate) || `0%`}</Typography>
<StyledSlider
valueLabelFormat={(value) => formatPercent(value)}
data-testid="slider"
getAriaLabel={() => "Minimum distance"}
defaultValue={[
filterParams.minGovParticipationRate || 0,
initParams.maxGovParticipationRate || 0
]}
onChange={(e, newValue) =>
handleChangeValueRange(e, newValue, "minGovParticipationRate", "maxGovParticipationRate")
}
value={[
filterParams.minGovParticipationRate || 0,
filterParams.maxGovParticipationRate ?? (initParams.maxGovParticipationRate || 0)
]}
valueLabelDisplay="auto"
disableSwap
step={0.000001}
min={dataRange?.minGovParticipationRate || 0}
max={dataRange?.maxGovParticipationRate || 0}
/>
<Typography>{formatPercent(dataRange?.maxGovParticipationRate || 0) || `0%`}</Typography>
</Box>
</Box>
<Box>
{expanded === "poolVoting" ? (
<IoIosArrowUp color={theme.palette.secondary.main} />
) : (
<IoIosArrowDown color={theme.palette.secondary.main} />
)}
</Box>
</Box>
</AccordionSummary>
<AccordionDetailsFilter sx={{ background: "unset" }}>
<Box display="flex" alignItems="center" mb="30px" sx={{ gap: "14px" }}>
<Typography>{formatPercent(dataRange?.minVotingPower || 0)}</Typography>
<StyledSlider
valueLabelFormat={(value) => formatPercent(value)}
data-testid="slider"
getAriaLabel={() => "Minimum distance"}
defaultValue={[filterParams.minVotingPower || 0, initParams.maxVotingPower || 0]}
onChange={(e, newValue) =>
handleChangeValueRange(e, newValue, "minVotingPower", "maxVotingPower")
}
value={[
filterParams.minVotingPower || 0,
filterParams.maxVotingPower ?? (initParams.maxVotingPower || 0)
]}
valueLabelDisplay="auto"
disableSwap
min={dataRange?.minVotingPower || 0}
step={0.0001}
max={dataRange?.maxVotingPower || 0}
/>
<Typography>{formatPercent(dataRange?.maxVotingPower || 0)}</Typography>
</Box>
</AccordionDetailsFilter>
</AccordionContainer>
</AccordionDetailsFilter>
</AccordionContainer>
<AccordionContainer expanded={expanded === "poolVoting"} onChange={handleChange("poolVoting")}>
<AccordionSummary>
<Box width={"100%"} display={"flex"} alignItems={"center"} justifyContent={"space-between"}>
<Box display={"flex"} alignItems={"center"}>
<CustomIcon icon={PoolVotingIcon} fill={theme.palette.secondary.light} height={18} />
<Box ml={1} color={({ palette }) => palette.secondary.main}>
{t("pool.poolVoting")}
</Box>
</Box>
<Box>
{expanded === "poolVoting" ? (
<IoIosArrowUp color={theme.palette.secondary.main} />
) : (
<IoIosArrowDown color={theme.palette.secondary.main} />
)}
</Box>
</Box>
</AccordionSummary>
<AccordionDetailsFilter sx={{ background: "unset" }}>
<Box display="flex" alignItems="center" mb="30px" sx={{ gap: "14px" }}>
<Typography>{formatPercent(dataRange?.minVotingPower || 0)}</Typography>
<StyledSlider
valueLabelFormat={(value) => formatPercent(value)}
data-testid="slider"
getAriaLabel={() => "Minimum distance"}
defaultValue={[filterParams.minVotingPower || 0, initParams.maxVotingPower || 0]}
onChange={(e, newValue) =>
handleChangeValueRange(e, newValue, "minVotingPower", "maxVotingPower")
}
value={[
filterParams.minVotingPower || 0,
filterParams.maxVotingPower ?? (initParams.maxVotingPower || 0)
]}
valueLabelDisplay="auto"
disableSwap
min={dataRange?.minVotingPower || 0}
step={0.0001}
max={dataRange?.maxVotingPower || 0}
/>
<Typography>{formatPercent(dataRange?.maxVotingPower || 0)}</Typography>
</Box>
</AccordionDetailsFilter>
</AccordionContainer>
</>
)}

<Box my={1} p="0px 16px">
<ApplyFilterButton
data-testid="apply-filters"
Expand Down
96 changes: 51 additions & 45 deletions src/components/commons/Layout/Sidebar/SidebarMenu/index.tsx
View file
Expand Up @@ -10,6 +10,7 @@ import { footerMenus, menus } from "src/commons/menus";
import { isExternalLink } from "src/commons/utils/helper";
import { RootState } from "src/stores/types";
import { setSidebar } from "src/stores/user";
import { IS_CONWAY_ERA } from "src/commons/utils/constants";

import FooterMenu from "../FooterMenu";
import {
Expand Down Expand Up @@ -177,51 +178,56 @@ const SidebarMenu: React.FC<RouteComponentProps> = ({ history }) => {
{children?.length ? (
<Collapse in={`menu-${index}` === active} timeout="auto" unmountOnExit>
<SubMenu disablePadding>
{children.map((subItem, subIndex) => {
const { href, icon, isSpecialPath, key } = subItem;
const title = t(key || "");
return href ? (
<ListItem
data-testid={`submenu-button-${title.toLowerCase().replaceAll(" ", "_")}`}
key={subIndex}
button
{...(isExternalLink(href)
? { component: "a", href, target: "_blank" }
: { component: Link, to: href })}
selected={isActiveMenu(href, isSpecialPath)}
sx={(theme) => ({
...itemStyle(theme, sidebar),
...(isActiveMenu(href, isSpecialPath)
? {
backgroundColor: (theme) => `${theme.palette.primary[200]} !important`,
color: (theme) => `${theme.palette.secondary.main} !important`
}
: { color: (theme) => theme.palette.secondary.light }),
paddingLeft: "70px",
[theme.breakpoints.down("md")]: {
paddingLeft: "60px"
},
":hover": isActiveMenu(href, isSpecialPath)
? {
color: `#fff !important`
}
: {
backgroundColor: (theme) => `${theme.palette.primary[200]} !important`
}
})}
>
{icon ? (
<MenuIcon
src={icon}
alt={title}
iconOnly={+!sidebar}
active={+isActiveMenu(href, isSpecialPath)}
/>
) : null}
<SubMenuText primary={title} open={+sidebar} active={+isActiveMenu(href, isSpecialPath)} />
</ListItem>
) : null;
})}
{children
.filter((i) => {
if (i.key === "head.page.drep" && !IS_CONWAY_ERA) return false;
return true;
})
.map((subItem, subIndex) => {
const { href, icon, isSpecialPath, key } = subItem;
const title = t(key || "");
return href ? (
<ListItem
data-testid={`submenu-button-${title.toLowerCase().replaceAll(" ", "_")}`}
key={subIndex}
button
{...(isExternalLink(href)
? { component: "a", href, target: "_blank" }
: { component: Link, to: href })}
selected={isActiveMenu(href, isSpecialPath)}
sx={(theme) => ({
...itemStyle(theme, sidebar),
...(isActiveMenu(href, isSpecialPath)
? {
backgroundColor: (theme) => `${theme.palette.primary[200]} !important`,
color: (theme) => `${theme.palette.secondary.main} !important`
}
: { color: (theme) => theme.palette.secondary.light }),
paddingLeft: "70px",
[theme.breakpoints.down("md")]: {
paddingLeft: "60px"
},
":hover": isActiveMenu(href, isSpecialPath)
? {
color: `#fff !important`
}
: {
backgroundColor: (theme) => `${theme.palette.primary[200]} !important`
}
})}
>
{icon ? (
<MenuIcon
src={icon}
alt={title}
iconOnly={+!sidebar}
active={+isActiveMenu(href, isSpecialPath)}
/>
) : null}
<SubMenuText primary={title} open={+sidebar} active={+isActiveMenu(href, isSpecialPath)} />
</ListItem>
) : null;
})}
</SubMenu>
</Collapse>
) : null}
Expand Down

0 comments on commit 5b73657

Please sign in to comment.