diff --git a/govtool/frontend/src/components/atoms/modal/Modal.tsx b/govtool/frontend/src/components/atoms/modal/Modal.tsx index 4c88d99f8..9eb5ca08f 100644 --- a/govtool/frontend/src/components/atoms/modal/Modal.tsx +++ b/govtool/frontend/src/components/atoms/modal/Modal.tsx @@ -1,3 +1,4 @@ +import { DialogContent } from "@mui/material"; import MuiModal from "@mui/material/Modal"; import type { ComponentProps } from "react"; @@ -11,6 +12,6 @@ interface Props { export const Modal = ({ open, children, handleClose }: Props) => ( - {children} + {children} ); diff --git a/govtool/frontend/src/components/atoms/modal/ModalWrapper.tsx b/govtool/frontend/src/components/atoms/modal/ModalWrapper.tsx index 598b21e4b..8576b4824 100644 --- a/govtool/frontend/src/components/atoms/modal/ModalWrapper.tsx +++ b/govtool/frontend/src/components/atoms/modal/ModalWrapper.tsx @@ -3,6 +3,7 @@ import { SxProps, styled } from "@mui/material/styles"; import { ICONS } from "@consts"; import { useModal } from "@context"; import { callAll } from "@utils"; +import { forwardRef } from "react"; interface Props { variant?: "modal" | "popup"; @@ -49,27 +50,32 @@ export const CloseButton = styled("img")` right: 24px; `; -export const ModalWrapper = ({ - children, - onClose, - variant = "modal", - hideCloseButton = false, - dataTestId = "modal", - sx, -}: Props) => { - const { closeModal } = useModal(); +export const ModalWrapper = forwardRef( + ( + { + children, + onClose, + variant = "modal", + hideCloseButton = false, + dataTestId = "modal", + sx, + }, + ref, + ) => { + const { closeModal } = useModal(); - return ( - - {variant !== "popup" && !hideCloseButton && ( - - )} - {children} - - ); -}; + return ( + + {variant !== "popup" && !hideCloseButton && ( + + )} + {children} + + ); + }, +); diff --git a/govtool/frontend/src/components/atoms/types.ts b/govtool/frontend/src/components/atoms/types.ts index 94ab87d4f..f67bf37f2 100644 --- a/govtool/frontend/src/components/atoms/types.ts +++ b/govtool/frontend/src/components/atoms/types.ts @@ -21,7 +21,7 @@ export type LoadingButtonProps = ButtonProps & { export type TypographyProps = Pick< MUITypographyProps, - "color" | "lineHeight" | "sx" + "color" | "lineHeight" | "sx" | "component" > & { children?: React.ReactNode; fontSize?: number; diff --git a/govtool/frontend/src/components/molecules/DashboardActionCard.tsx b/govtool/frontend/src/components/molecules/DashboardActionCard.tsx index 243287f36..6c7f8ebf1 100644 --- a/govtool/frontend/src/components/molecules/DashboardActionCard.tsx +++ b/govtool/frontend/src/components/molecules/DashboardActionCard.tsx @@ -85,6 +85,7 @@ export const DashboardActionCard: FC = ({ variant="title2" fontWeight={600} sx={{ display: "inline" }} + component="span" > {` ${t("inProgress")}`} diff --git a/govtool/frontend/src/components/molecules/WalletInfoCard.tsx b/govtool/frontend/src/components/molecules/WalletInfoCard.tsx index 054067c3d..475828f64 100644 --- a/govtool/frontend/src/components/molecules/WalletInfoCard.tsx +++ b/govtool/frontend/src/components/molecules/WalletInfoCard.tsx @@ -16,7 +16,7 @@ export const WalletInfoCard = () => { await disconnectWallet(); navigate( pathname.includes("/connected") - ? `${pathname.replace("/connected", "")}${hash}` + ? `${pathname.replace("/connected", "")}${hash ?? ""}` : PATHS.home, ); window.location.reload(); diff --git a/govtool/frontend/src/components/molecules/WalletOption.tsx b/govtool/frontend/src/components/molecules/WalletOption.tsx index f33b599aa..381fa2ee5 100644 --- a/govtool/frontend/src/components/molecules/WalletOption.tsx +++ b/govtool/frontend/src/components/molecules/WalletOption.tsx @@ -35,9 +35,12 @@ export const WalletOptionButton: FC = ({ const result = await enable(name); if (result?.stakeKey) { navigate( - pathToNavigate ?? pathname === "/" + // eslint-disable-next-line no-unneeded-ternary + pathToNavigate + ? pathToNavigate + : pathname === "/" ? "/dashboard" - : `connected${pathname}${hash}`, + : `connected${pathname}${hash ?? ""}`, { state }, ); return; diff --git a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx index 2350bb0a5..d1be2a797 100644 --- a/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx +++ b/govtool/frontend/src/components/organisms/GovernanceActionDetailsCardData.tsx @@ -64,7 +64,9 @@ export const GovernanceActionDetailsCardData = ({ const govActionLinkToShare = `${window.location.protocol}//${ window.location.hostname - }${window.location.port ? `:${window.location.port}` : ""}${pathname}${hash}`; + }${window.location.port ? `:${window.location.port}` : ""}${pathname}${ + hash ?? "" + }`; return ( { +export const ChooseWalletModal = forwardRef((_, ref) => { const { t } = useTranslation(); const { state } = useModal(); @@ -47,7 +47,7 @@ export const ChooseWalletModal = () => { }, [window]); return ( - + {t("wallet.connectYourWallet")} { ); -}; +}); diff --git a/govtool/frontend/src/components/organisms/Modal/ExternalLinkModal.tsx b/govtool/frontend/src/components/organisms/Modal/ExternalLinkModal.tsx index e49f5b625..8437f3ae0 100644 --- a/govtool/frontend/src/components/organisms/Modal/ExternalLinkModal.tsx +++ b/govtool/frontend/src/components/organisms/Modal/ExternalLinkModal.tsx @@ -1,3 +1,4 @@ +import { forwardRef } from "react"; import { Box, Button, Typography } from "@mui/material"; import { ModalContents, ModalHeader, ModalWrapper } from "@atoms"; @@ -11,7 +12,7 @@ export interface ExternalLinkModalState { externalLink: string; } -export const ExternalLinkModal = () => { +export const ExternalLinkModal = forwardRef((_, ref) => { const { state, closeModal } = useModal(); const { isMobile } = useScreenDimension(); const { t } = useTranslation(); @@ -20,7 +21,7 @@ export const ExternalLinkModal = () => { } = theme; return ( - + Status icon { ); -}; +}); diff --git a/govtool/frontend/src/components/organisms/Modal/LoadingModal.tsx b/govtool/frontend/src/components/organisms/Modal/LoadingModal.tsx index 2c95b9574..8a87b91bd 100644 --- a/govtool/frontend/src/components/organisms/Modal/LoadingModal.tsx +++ b/govtool/frontend/src/components/organisms/Modal/LoadingModal.tsx @@ -1,3 +1,4 @@ +import { forwardRef } from "react"; import { Typography } from "@mui/material"; import { Loader, ModalContents, ModalHeader, ModalWrapper } from "@atoms"; @@ -10,7 +11,7 @@ export interface LoadingModalState { dataTestId: string; } -export const LoadingModal = () => { +export const LoadingModal = forwardRef((_, ref) => { const { state } = useModal(); const { isMobile } = useScreenDimension(); @@ -18,6 +19,7 @@ export const LoadingModal = () => { @@ -33,4 +35,4 @@ export const LoadingModal = () => { ); -}; +}); diff --git a/govtool/frontend/src/components/organisms/Modal/StatusModal.tsx b/govtool/frontend/src/components/organisms/Modal/StatusModal.tsx index ca5adb5d1..2b1e24ea6 100644 --- a/govtool/frontend/src/components/organisms/Modal/StatusModal.tsx +++ b/govtool/frontend/src/components/organisms/Modal/StatusModal.tsx @@ -1,3 +1,4 @@ +import { forwardRef } from "react"; import { Button, Link, Typography } from "@mui/material"; import { ModalContents, ModalHeader, ModalWrapper } from "@atoms"; @@ -22,7 +23,7 @@ export interface StatusModalState { dataTestId: string; } -export const StatusModal = () => { +export const StatusModal = forwardRef((_, ref) => { const { state, closeModal } = useModal(); const { isMobile } = useScreenDimension(); const { t } = useTranslation(); @@ -34,7 +35,10 @@ export const StatusModal = () => { }; return ( - + Status icon { WebkitBoxOrient: "vertical", WebkitLineClamp: 8, wordBreak: "break-word", + whiteSpace: "pre-line", }} > {state?.message}{" "} @@ -125,4 +130,4 @@ export const StatusModal = () => { )} ); -}; +}); diff --git a/govtool/frontend/src/components/organisms/Modal/VotingPowerModal.tsx b/govtool/frontend/src/components/organisms/Modal/VotingPowerModal.tsx index 95c03b718..524f9bda4 100644 --- a/govtool/frontend/src/components/organisms/Modal/VotingPowerModal.tsx +++ b/govtool/frontend/src/components/organisms/Modal/VotingPowerModal.tsx @@ -1,3 +1,4 @@ +import { forwardRef } from "react"; import { Box } from "@mui/material"; import { ModalContents, ModalWrapper, Typography, VotePill } from "@atoms"; @@ -13,7 +14,7 @@ export interface VotingPowerModalState { vote?: string; } -export const VotingPowerModal = () => { +export const VotingPowerModal = forwardRef((_, ref) => { const { state } = useModal(); const { isMobile } = useScreenDimension(); const { t } = useTranslation(); @@ -28,6 +29,7 @@ export const VotingPowerModal = () => { @@ -94,4 +96,4 @@ export const VotingPowerModal = () => { ); -}; +}); diff --git a/govtool/frontend/src/context/pendingTransaction/utils.tsx b/govtool/frontend/src/context/pendingTransaction/utils.tsx index ffa97b22a..1d3e765dd 100644 --- a/govtool/frontend/src/context/pendingTransaction/utils.tsx +++ b/govtool/frontend/src/context/pendingTransaction/utils.tsx @@ -70,13 +70,13 @@ export const refetchData = async ( resourceId === AutomatedVotingOptionDelegationId.no_confidence || resourceId === AutomatedVotingOptionDelegationId.abstain ) { - return data.dRepView; + return data?.dRepView; } - return data.dRepHash; + return data?.dRepHash; } if (type === "registerAsDrep" || type === "retireAsDrep") - return data.isRegisteredAsDRep; + return data?.isRegisteredAsDRep; if (type === "registerAsDirectVoter" || type === "retireAsDirectVoter") - return data.isRegisteredAsSoleVoter; + return data?.isRegisteredAsSoleVoter; return undefined; }; diff --git a/govtool/frontend/src/context/wallet.tsx b/govtool/frontend/src/context/wallet.tsx index 1ea70f80c..494df38ef 100644 --- a/govtool/frontend/src/context/wallet.tsx +++ b/govtool/frontend/src/context/wallet.tsx @@ -217,6 +217,7 @@ const CardanoProvider = (props: Props) => { try { const raw = await enabledApi.getUsedAddresses(); const rawFirst = raw[0]; + if (!rawFirst) return []; const usedAddress = Address.from_bytes( Buffer.from(rawFirst, "hex"), ).to_bech32(); @@ -932,26 +933,17 @@ function useCardano() { status: "info", dataTestId: "info-about-sancho-net-modal", message: ( -

- {t("system.sanchoNetIsBeta")} - openInNewTab("https://sancho.network/")} - sx={{ cursor: "pointer" }} - > - {t("system.sanchoNet")} - - . -
-
- , - ]} - /> -

+ openInNewTab("https://sancho.network/")} + sx={{ cursor: "pointer" }} + />, + ]} + /> ), - title: t("system.toolConnectedToSanchonet"), + title: t("system.testnetTitle"), buttonText: t("ok"), }, }); diff --git a/govtool/frontend/src/i18n/locales/en.ts b/govtool/frontend/src/i18n/locales/en.ts index 9e2b2ddf6..de8d0b8c2 100644 --- a/govtool/frontend/src/i18n/locales/en.ts +++ b/govtool/frontend/src/i18n/locales/en.ts @@ -712,12 +712,9 @@ export const en = { retireDirectVoter: "Retire as a Direct Voter", }, system: { - sanchoNet: "SanchoNet", - sanchoNetIsBeta: - "The SanchoNet GovTool is currently in beta and it connects to ", - testAdaNote: - "Please note, this tool uses ‘Test ada’ <0>NOT real ada. All governance actions and related terms pertain to SanchoNet.", - toolConnectedToSanchonet: "This tool is connected to SanchoNet", + testnetDescription: + "The SanchoNet GovTool is currently in beta and it connects to <0>SanchoNet.\n\n Please note, this tool uses ‘Test ada’ NOT real ada. All governance actions and related terms pertain to SanchoNet.", + testnetTitle: "This tool is connected to SanchoNet", }, tooltips: { delegateTodRep: {