Skip to content

Commit

Permalink
Merge pull request #616 from IntersectMBO/develop
Browse files Browse the repository at this point in the history
Configuration Enhancements and Fixes: Metadata Validation Setup and Build Corrections
  • Loading branch information
pmbinapps authored Apr 3, 2024
2 parents 32099d9 + 40c343b commit 4a7bf6f
Show file tree
Hide file tree
Showing 42 changed files with 477 additions and 398 deletions.
13 changes: 6 additions & 7 deletions govtool/frontend/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion govtool/frontend/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,7 @@
"@typescript-eslint/parser": "^7.3.1",
"@vitejs/plugin-react": "^4.0.0",
"@vitest/ui": "^1.1.0",
"chromatic": "^10.0.0",
"chromatic": "^11.3.0",
"eslint": "^8.38.0",
"eslint-config-airbnb": "^19.0.4",
"eslint-plugin-import": "^2.29.1",
Expand Down
49 changes: 25 additions & 24 deletions govtool/frontend/src/components/molecules/Field/TextArea.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -56,13 +56,6 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(
[handleBlur, handleFocus],
);

const getCounterBottomSxValue = () => {
if (props.isModifiedLayout && errorMessage) return 30;
if (props.isModifiedLayout) return 10;
if (errorMessage) return 52.5;
return 35;
};

return (
<Box
sx={{
Expand All @@ -83,12 +76,31 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(
{label}
</Typography>
)}
<TextAreaBase
errorMessage={errorMessage}
maxLength={maxLength}
{...props}
ref={textAreaRef}
/>
<Box
sx={{
display: "flex",
flexDirection: "column",
position: "relative",
}}
>
<TextAreaBase
errorMessage={errorMessage}
maxLength={maxLength}
{...props}
ref={textAreaRef}
/>
<Typography
color="#8E908E"
sx={{
bottom: 12,
position: "absolute",
right: 14,
}}
variant="caption"
>
{props?.value?.toString()?.length ?? 0}/{maxLength}
</Typography>
</Box>
<FormHelpfulText
helpfulText={helpfulText}
helpfulTextStyle={helpfulTextStyle}
Expand All @@ -97,17 +109,6 @@ export const TextArea = forwardRef<HTMLTextAreaElement, TextAreaFieldProps>(
errorMessage={errorMessage}
errorStyles={errorStyles}
/>
<Typography
color="#8E908E"
sx={{
bottom: getCounterBottomSxValue(),
position: "absolute",
right: 15,
}}
variant="caption"
>
{props?.value?.toString()?.length ?? 0}/{maxLength}
</Typography>
</Box>
);
},
Expand Down
33 changes: 16 additions & 17 deletions govtool/frontend/src/components/organisms/Slider.tsx
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import { useEffect, useMemo, useState } from "react";
import { useCallback, useEffect, useMemo, useState } from "react";
import { generatePath, useNavigate } from "react-router-dom";
import { Box } from "@mui/material";
import { KeenSliderOptions } from "keen-slider";
Expand Down Expand Up @@ -77,6 +77,19 @@ export const Slider = ({
instanceRef.current?.moveToIdx(0);
};

const onClickShowAll = useCallback(() => {
navigate(
generatePath(
onDashboard
? PATHS.dashboardGovernanceActionsCategory
: PATHS.governanceActionsCategory,
{
category: navigateKey,
},
),
);
}, [navigate, onDashboard]);

useEffect(() => {
if (instanceRef.current) {
setIsSliderInitialized(true);
Expand All @@ -89,7 +102,7 @@ export const Slider = ({
filters,
sorting,
searchPhrase,
pendingTransaction.vote?.resourceId,
pendingTransaction?.vote?.resourceId,
data,
]);

Expand Down Expand Up @@ -126,21 +139,7 @@ export const Slider = ({
minWidth: 93,
"&:hover": { backgroundColor: arcticWhite },
}}
onClick={() => {
if (onDashboard) {
navigate(
generatePath(PATHS.dashboardGovernanceActionsCategory, {
category: navigateKey,
}),
);
} else {
navigate(
generatePath(PATHS.governanceActionsCategory, {
category: navigateKey,
}),
);
}
}}
onClick={onClickShowAll}
>
{t("slider.showAll")}
</Button>
Expand Down
2 changes: 1 addition & 1 deletion govtool/frontend/src/components/organisms/StatusModal.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ export const StatusModal = () => {
textAlign="center"
sx={{ fontSize: "16px", fontWeight: "400" }}
>
{state?.message}
{state?.message}{" "}
{state?.link && (
<Link
onClick={() => openInNewTab(state?.link || "")}
Expand Down
10 changes: 6 additions & 4 deletions govtool/frontend/src/hooks/queries/useGetVoterInfoQuery.ts
Original file line number Diff line number Diff line change
Expand Up @@ -10,10 +10,12 @@ export const useGetVoterInfo = () => {
const { data } = useQuery({
queryKey: [
QUERY_KEYS.useGetDRepInfoKey,
(pendingTransaction.registerAsDrep ||
pendingTransaction.registerAsSoleVoter ||
pendingTransaction.retireAsDrep ||
pendingTransaction.retireAsSoleVoter)?.transactionHash,
(
pendingTransaction?.registerAsDrep ||
pendingTransaction?.registerAsSoleVoter ||
pendingTransaction?.retireAsDrep ||
pendingTransaction?.retireAsSoleVoter
)?.transactionHash,
],
enabled: !!dRepID,
queryFn: () => getVoterInfo(dRepID),
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -57,11 +57,10 @@ export const DashboardGovernanceActionsCategory = () => {
isProposalsFetching,
);

const mappedData = useMemo(() => removeDuplicatedProposals(proposals), [
proposals,
voter?.isRegisteredAsDRep,
isProposalsFetchingNextPage,
]);
const mappedData = useMemo(
() => removeDuplicatedProposals(proposals),
[proposals, voter?.isRegisteredAsDRep, isProposalsFetchingNextPage],
);

return (
<Background>
Expand Down Expand Up @@ -146,13 +145,10 @@ export const DashboardGovernanceActionsCategory = () => {
<Box pb={4.25} key={item.txHash + item.index}>
<GovernanceActionCard
{...item}
index={item.index}
inProgress={
pendingTransaction.vote?.resourceId ===
`${item.txHash ?? ""}${item.index ?? ""}`
}
// TODO: Add data validation
isDataMissing={false}
onClick={() => {
saveScrollPosition();

Expand Down
154 changes: 93 additions & 61 deletions govtool/frontend/src/stories/GovernanceAction.stories.ts
Original file line number Diff line number Diff line change
@@ -1,61 +1,93 @@
// Story to be updated when new Gov Actions are finished
/* eslint-disable storybook/default-exports */

// import type { Meta, StoryObj } from "@storybook/react";
// import { within, userEvent, waitFor, screen } from "@storybook/testing-library";
// import { expect, jest } from "@storybook/jest";

// import { formatDisplayDate } from "@utils";
// import { GovernanceActionCard } from "@/components/molecules";

// const meta = {
// title: "Example/GovernanceActionCard",
// component: GovernanceActionCard,
// parameters: {
// layout: "centered",
// },
// tags: ["autodocs"],
// } satisfies Meta<typeof GovernanceActionCard>;

// export default meta;
// type Story = StoryObj<typeof meta>;

// export const GovernanceActionCardComponent: Story = {
// args: {
// createdDate: "1970-01-01T00:00:00Z",
// expiryDate: "1970-02-01T00:00:00Z",
// type: "exampleType",
// txHash: "sad78afdsf7jasd98d",
// index: 2,
// onClick: jest.fn(),
// },
// play: async ({ canvasElement, args }) => {
// const canvas = within(canvasElement);
// expect(canvas.getByTestId("exampleType-type")).toBeInTheDocument();
// expect(canvas.getByTestId("sad78afdsf7jasd98d#2-id")).toBeInTheDocument();
// expect(
// canvas.getByText(formatDisplayDate("1970-01-01T00:00:00Z")),
// ).toBeInTheDocument();
// expect(
// canvas.getByText(formatDisplayDate("1970-02-01T00:00:00Z")),
// ).toBeInTheDocument();

// const tooltips = canvas.getAllByTestId("InfoOutlinedIcon");
// await userEvent.hover(tooltips[0]);
// await waitFor(async () => {
// expect(screen.getByRole("tooltip")).toBeInTheDocument();
// expect(screen.getByRole("tooltip")).toHaveTextContent(/Submission Date/i);
// await userEvent.unhover(tooltips[0]);
// });
// await userEvent.hover(tooltips[1]);
// await waitFor(() => {
// expect(screen.getByRole("tooltip")).toBeInTheDocument();
// expect(screen.getByRole("tooltip")).toHaveTextContent(/Expiry Date/i);
// });

// await userEvent.click(
// canvas.getByTestId("govaction-sad78afdsf7jasd98d#2-view-detail"),
// );
// await expect(args.onClick).toHaveBeenCalled();
// },
// };
import type { Meta, StoryObj } from "@storybook/react";
import { within, userEvent, waitFor, screen } from "@storybook/testing-library";
import { expect, jest } from "@storybook/jest";
import { GAMetedataErrors, formatDisplayDate } from "@utils";
import { GovernanceActionCard } from "@/components/molecules";

const meta = {
title: "Example/GovernanceActionCard",
component: GovernanceActionCard,
parameters: {
layout: "centered",
},
tags: ["autodocs"],
} satisfies Meta<typeof GovernanceActionCard>;

export default meta;

type Story = StoryObj<typeof meta>;

const commonArgs = {
about: "About this Governance Action",
createdDate: "1970-01-01T00:00:00Z",
createdEpochNo: 302,
expiryDate: "1970-02-01T00:00:00Z",
expiryEpochNo: 420,
index: 2,
inProgress: false,
isDataMissing: false,
onClick: jest.fn(),
title: "Example title",
txHash: "sad78afdsf7jasd98d",
type: "exampleType",
};

export const GovernanceActionCardComponent: Story = {
args: commonArgs,

play: async ({ canvasElement, args }) => {
const canvas = within(canvasElement);
expect(canvas.getByTestId("exampleType-type")).toBeInTheDocument();
expect(canvas.getByTestId("sad78afdsf7jasd98d#2-id")).toBeInTheDocument();
expect(
canvas.getByText(formatDisplayDate("1970-01-01T00:00:00Z")),
).toBeInTheDocument();
expect(
canvas.getByText(formatDisplayDate("1970-02-01T00:00:00Z")),
).toBeInTheDocument();
const tooltips = canvas.getAllByTestId("InfoOutlinedIcon");
await userEvent.hover(tooltips[0]);
await waitFor(async () => {
expect(screen.getByRole("tooltip")).toBeInTheDocument();
expect(screen.getByRole("tooltip")).toHaveTextContent(/Submission Date/i);
await userEvent.unhover(tooltips[0]);
});
await userEvent.hover(tooltips[1]);
await waitFor(() => {
expect(screen.getByRole("tooltip")).toBeInTheDocument();
expect(screen.getByRole("tooltip")).toHaveTextContent(/Expiry Date/i);
});
await userEvent.click(
canvas.getByTestId("govaction-sad78afdsf7jasd98d#2-view-detail"),
);
await expect(args.onClick).toHaveBeenCalled();
},
};

export const GovernanceActionCardIsLoading: Story = {
args: {
...commonArgs,
inProgress: true,
},
};

export const GovernanceActionCardDataMissing: Story = {
args: {
...commonArgs,
isDataMissing: GAMetedataErrors.DATA_MISSING,
},
};

export const GovernanceActionCardIncorectFormat: Story = {
args: {
...commonArgs,
isDataMissing: GAMetedataErrors.INCORRECT_FORMAT,
},
};

export const GovernanceActionCardNotVerifiable: Story = {
args: {
...commonArgs,
isDataMissing: GAMetedataErrors.NOT_VERIFIABLE,
},
};
Loading

0 comments on commit 4a7bf6f

Please sign in to comment.