diff --git a/govtool/frontend/package-lock.json b/govtool/frontend/package-lock.json index 45ed83f88..b1ab27abd 100644 --- a/govtool/frontend/package-lock.json +++ b/govtool/frontend/package-lock.json @@ -62,7 +62,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", @@ -9573,19 +9573,18 @@ "license": "ISC" }, "node_modules/chromatic": { - "version": "10.7.1", - "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-10.7.1.tgz", - "integrity": "sha512-ERxfVxTm8gnbv3bdWeNyUVQ4msbtYc/dZIpt+3TVxqEq4tMlzVCnTFl1rDfJ7Jj1enGFoxvZ+Q2xon7Jfi+cZw==", + "version": "11.3.0", + "resolved": "https://registry.npmjs.org/chromatic/-/chromatic-11.3.0.tgz", + "integrity": "sha512-q1ZtJDJrjLGnz60ivpC16gmd7KFzcaA4eTb7gcytCqbaKqlHhCFr1xQmcUDsm14CK7JsqdkFU6S+JQdOd2ZNJg==", "dev": true, - "license": "MIT", "bin": { "chroma": "dist/bin.js", "chromatic": "dist/bin.js", "chromatic-cli": "dist/bin.js" }, "peerDependencies": { - "@chromatic-com/cypress": "^0.5.2 || ^1.0.0", - "@chromatic-com/playwright": "^0.5.2 || ^1.0.0" + "@chromatic-com/cypress": "^0.*.* || ^1.0.0", + "@chromatic-com/playwright": "^0.*.* || ^1.0.0" }, "peerDependenciesMeta": { "@chromatic-com/cypress": { diff --git a/govtool/frontend/package.json b/govtool/frontend/package.json index d97403562..b27e98257 100644 --- a/govtool/frontend/package.json +++ b/govtool/frontend/package.json @@ -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", diff --git a/govtool/frontend/src/components/molecules/Field/TextArea.tsx b/govtool/frontend/src/components/molecules/Field/TextArea.tsx index 9f544aba5..177c87a2e 100644 --- a/govtool/frontend/src/components/molecules/Field/TextArea.tsx +++ b/govtool/frontend/src/components/molecules/Field/TextArea.tsx @@ -56,13 +56,6 @@ export const TextArea = forwardRef( [handleBlur, handleFocus], ); - const getCounterBottomSxValue = () => { - if (props.isModifiedLayout && errorMessage) return 30; - if (props.isModifiedLayout) return 10; - if (errorMessage) return 52.5; - return 35; - }; - return ( ( {label} )} - + + + + {props?.value?.toString()?.length ?? 0}/{maxLength} + + ( errorMessage={errorMessage} errorStyles={errorStyles} /> - - {props?.value?.toString()?.length ?? 0}/{maxLength} - ); }, diff --git a/govtool/frontend/src/components/organisms/Slider.tsx b/govtool/frontend/src/components/organisms/Slider.tsx index 577e8f9e8..cee7abc27 100644 --- a/govtool/frontend/src/components/organisms/Slider.tsx +++ b/govtool/frontend/src/components/organisms/Slider.tsx @@ -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"; @@ -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); @@ -89,7 +102,7 @@ export const Slider = ({ filters, sorting, searchPhrase, - pendingTransaction.vote?.resourceId, + pendingTransaction?.vote?.resourceId, data, ]); @@ -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")} diff --git a/govtool/frontend/src/components/organisms/StatusModal.tsx b/govtool/frontend/src/components/organisms/StatusModal.tsx index 5d813e73a..ce8f2665d 100644 --- a/govtool/frontend/src/components/organisms/StatusModal.tsx +++ b/govtool/frontend/src/components/organisms/StatusModal.tsx @@ -48,7 +48,7 @@ export const StatusModal = () => { textAlign="center" sx={{ fontSize: "16px", fontWeight: "400" }} > - {state?.message} + {state?.message}{" "} {state?.link && ( openInNewTab(state?.link || "")} diff --git a/govtool/frontend/src/hooks/queries/useGetVoterInfoQuery.ts b/govtool/frontend/src/hooks/queries/useGetVoterInfoQuery.ts index a21a5cf55..16a4bb37d 100644 --- a/govtool/frontend/src/hooks/queries/useGetVoterInfoQuery.ts +++ b/govtool/frontend/src/hooks/queries/useGetVoterInfoQuery.ts @@ -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), diff --git a/govtool/frontend/src/pages/DashboardGovernanceActionsCategory.tsx b/govtool/frontend/src/pages/DashboardGovernanceActionsCategory.tsx index 3a50d324b..77cdebdb2 100644 --- a/govtool/frontend/src/pages/DashboardGovernanceActionsCategory.tsx +++ b/govtool/frontend/src/pages/DashboardGovernanceActionsCategory.tsx @@ -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 ( @@ -146,13 +145,10 @@ export const DashboardGovernanceActionsCategory = () => { { saveScrollPosition(); diff --git a/govtool/frontend/src/stories/GovernanceAction.stories.ts b/govtool/frontend/src/stories/GovernanceAction.stories.ts index 770b603c0..fece9f0d6 100644 --- a/govtool/frontend/src/stories/GovernanceAction.stories.ts +++ b/govtool/frontend/src/stories/GovernanceAction.stories.ts @@ -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; - -// export default meta; -// type Story = StoryObj; - -// 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; + +export default meta; + +type Story = StoryObj; + +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, + }, +}; diff --git a/govtool/frontend/src/stories/GovernanceActionDetailsCard.stories.ts b/govtool/frontend/src/stories/GovernanceActionDetailsCard.stories.ts index 454db3a52..cb9700c35 100644 --- a/govtool/frontend/src/stories/GovernanceActionDetailsCard.stories.ts +++ b/govtool/frontend/src/stories/GovernanceActionDetailsCard.stories.ts @@ -1,65 +1,98 @@ -// Story to be updated when new Gov Actions are finished -/* eslint-disable storybook/default-exports */ +import type { Meta, StoryObj } from "@storybook/react"; +import { screen, userEvent, waitFor, within } from "@storybook/testing-library"; +import { GovernanceActionDetailsCard } from "@organisms"; +import { expect } from "@storybook/jest"; +import { GAMetedataErrors } from "@/utils"; -// import type { Meta, StoryObj } from "@storybook/react"; -// import { screen, userEvent, waitFor, within } from "@storybook/testing-library"; -// import { GovernanceActionDetailsCard } from "@organisms"; -// import { expect } from "@storybook/jest"; +const meta = { + title: "Example/GovernanceActionDetailsCard", + component: GovernanceActionDetailsCard, + parameters: { + layout: "centered", + }, + tags: ["autodocs"], +} satisfies Meta; -// const meta = { -// title: "Example/GovernanceActionDetailsCard", -// component: GovernanceActionDetailsCard, -// parameters: { -// layout: "centered", -// }, -// tags: ["autodocs"], -// } satisfies Meta; +export default meta; -// export default meta; -// type Story = StoryObj; +type Story = StoryObj; -// export const GovernanceActionDetailsCardComponent: Story = { -// args: { -// abstainVotes: 1000000, -// createdDate: new Date().toLocaleDateString(), -// expiryDate: new Date().toLocaleDateString(), -// shortenedGovActionId: "Example id", -// noVotes: 1000000, -// type: "Gov Type", -// url: "https://exampleurl.com", -// yesVotes: 1000000, -// details: { -// key: "value", -// key2: ["key-list", "key-list", "key-list"], -// }, -// }, +const commonArgs = { + abstainVotes: 1000000, + createdDate: new Date().toLocaleDateString(), + expiryDate: new Date().toLocaleDateString(), + noVotes: 1000000, + type: "Gov Type", + url: "https://exampleurl.com", + yesVotes: 1000000, + createdEpochNo: 302, + expiryEpochNo: 350, + govActionId: "exampleId1232312312312", + isDataMissing: false, + title: "Example title", +}; -// play: async ({ canvasElement }) => { -// const canvas = within(canvasElement); -// const todayDate = new Date().toLocaleDateString(); -// await expect(canvas.getAllByText(todayDate)).toHaveLength(2); +export const GovernanceActionDetailsCardComponent: Story = { + args: { + ...commonArgs, + about: "Example about section", + rationale: "Example rationale section", + motivation: "Example motivation section", + }, -// const tooltips = canvas.getAllByTestId("InfoOutlinedIcon"); -// await userEvent.hover(tooltips[0]); -// await waitFor(async () => { -// await expect(screen.getByRole("tooltip")).toBeInTheDocument(); -// await expect(screen.getByRole("tooltip")).toHaveTextContent( -// /Submission Date/i, -// ); -// await userEvent.unhover(tooltips[0]); -// }); -// await userEvent.hover(tooltips[1]); + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + const todayDate = new Date().toLocaleDateString(); + await expect(canvas.getAllByText(todayDate)).toHaveLength(2); + const tooltips = canvas.getAllByTestId("InfoOutlinedIcon"); + await userEvent.hover(tooltips[0]); + await waitFor(async () => { + await expect(screen.getByRole("tooltip")).toBeInTheDocument(); + await expect(screen.getByRole("tooltip")).toHaveTextContent( + /Submission Date/i, + ); + await userEvent.unhover(tooltips[0]); + }); + await userEvent.hover(tooltips[1]); + await expect(canvas.getByText("Gov Type")).toBeInTheDocument(); + await expect(canvas.getByText("Example id")).toBeInTheDocument(); + await expect(canvas.getByText("key: value")).toBeInTheDocument(); + await expect(canvas.getAllByText("key-list")).toHaveLength(3); + await expect(canvas.getByText(/Yes/i)).toBeInTheDocument(); + await expect(canvas.getByText(/Abstain/i)).toBeInTheDocument(); + await expect(canvas.getByText(/No/i)).toBeInTheDocument(); + await userEvent.click(canvas.getByTestId("view-other-details-button")); + }, +}; -// await expect(canvas.getByText("Gov Type")).toBeInTheDocument(); -// await expect(canvas.getByText("Example id")).toBeInTheDocument(); +export const GovernanceActionDetailsDrep: Story = { + args: { + ...commonArgs, + isDashboard: true, + isVoter: true, + about: "Example about section", + rationale: "Example rationale section", + motivation: "Example motivation section", + }, +}; -// await expect(canvas.getByText("key: value")).toBeInTheDocument(); -// await expect(canvas.getAllByText("key-list")).toHaveLength(3); +export const GovernanceActionDetailsDataMissing: Story = { + args: { + ...commonArgs, + isDataMissing: GAMetedataErrors.DATA_MISSING, + }, +}; -// await expect(canvas.getByText(/Yes/i)).toBeInTheDocument(); -// await expect(canvas.getByText(/Abstain/i)).toBeInTheDocument(); -// await expect(canvas.getByText(/No/i)).toBeInTheDocument(); +export const GovernanceActionDetailsIncorrectFormat: Story = { + args: { + ...commonArgs, + isDataMissing: GAMetedataErrors.INCORRECT_FORMAT, + }, +}; -// await userEvent.click(canvas.getByTestId("view-other-details-button")); -// }, -// }; +export const GovernanceActionDetailsNotVerifiable: Story = { + args: { + ...commonArgs, + isDataMissing: GAMetedataErrors.NOT_VERIFIABLE, + }, +}; diff --git a/govtool/frontend/src/stories/GovernanceActionVoted.stories.ts b/govtool/frontend/src/stories/GovernanceActionVoted.stories.ts index 3547562ab..3959eb041 100644 --- a/govtool/frontend/src/stories/GovernanceActionVoted.stories.ts +++ b/govtool/frontend/src/stories/GovernanceActionVoted.stories.ts @@ -1,183 +1,196 @@ -// Story to be updated when new Gov Actions are finished -/* eslint-disable storybook/default-exports */ +import type { Meta, StoryObj } from "@storybook/react"; -// import type { Meta, StoryObj } from "@storybook/react"; +import { GovernanceVotedOnCard } from "@molecules"; +import { userEvent, waitFor, within, screen } from "@storybook/testing-library"; +import { expect } from "@storybook/jest"; +import { formatDisplayDate } from "@/utils"; -// import { GovernanceVotedOnCard } from "@molecules"; -// import { userEvent, waitFor, within, screen } from "@storybook/testing-library"; -// import { expect } from "@storybook/jest"; -// import { formatDisplayDate } from "@/utils"; +const meta = { + title: "Example/GovernanceVotedOnCard", + component: GovernanceVotedOnCard, + parameters: { + layout: "centered", + }, -// const meta = { -// title: "Example/GovernanceVotedOnCard", -// component: GovernanceVotedOnCard, -// parameters: { -// layout: "centered", -// }, + tags: ["autodocs"], +} satisfies Meta; -// tags: ["autodocs"], -// } satisfies Meta; +export default meta; +type Story = StoryObj; -// export default meta; -// type Story = StoryObj; +async function checkGovActionVisibility(canvas: ReturnType) { + expect(canvas.getByTestId("exampleType-type")).toBeInTheDocument(); + expect(canvas.getByTestId("exampleHash#1-id")).toBeInTheDocument(); + expect(canvas.getByText(/vote submitted/i)).toBeInTheDocument(); -// async function checkGovActionVisibility(canvas: ReturnType) { -// expect(canvas.getByTestId("exampleType-type")).toBeInTheDocument(); -// expect(canvas.getByTestId("exampleHash#1-id")).toBeInTheDocument(); -// expect(canvas.getByText(/vote submitted/i)).toBeInTheDocument(); + expect( + canvas.getByText(formatDisplayDate("1970-01-01T00:00:00Z")), + ).toBeInTheDocument(); + expect( + canvas.getByText(formatDisplayDate("1970-02-01T00:00:00Z")), + ).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); + }); -// 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 expect( + canvas.getByTestId("govaction-exampleHash#1-change-your-vote"), + ).toBeInTheDocument(); +} -// await expect( -// canvas.getByTestId("govaction-exampleHash#1-change-your-vote"), -// ).toBeInTheDocument(); -// } +export const GovernanceVotedOnCardComponent: Story = { + args: { + votedProposal: { + vote: { + date: new Date().toLocaleDateString(), + drepId: "drep1_exampledrepid1231231", + epochNo: 222, + metadataHash: "ababa1ababab1abababa1ababab1ababa1aba1", + proposalId: "exampleproposalid12dsadasdasda", + url: "https://exampleurl.com", + vote: "yes", + }, + proposal: { + createdEpochNo: 232, + expiryEpochNo: 323, + isDataMissing: false, + createdDate: "1970-01-01T00:00:00Z", + expiryDate: "1970-02-01T00:00:00Z", + id: "exampleId", + type: "exampleType", + index: 1, + txHash: "exampleHash", + url: "https://example.com", + metadataHash: "exampleHash", + yesVotes: 1, + noVotes: 0, + abstainVotes: 2, + }, + }, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await checkGovActionVisibility(canvas); + }, +}; -// export const GovernanceVotedOnCardComponent: Story = { -// args: { -// votedProposal: { -// proposal: { -// createdDate: "1970-01-01T00:00:00Z", -// expiryDate: "1970-02-01T00:00:00Z", -// id: "exampleId", -// type: "exampleType", -// index: 1, -// txHash: "exampleHash", -// details: "some details", -// url: "https://example.com", -// metadataHash: "exampleHash", -// yesVotes: 1, -// noVotes: 0, -// abstainVotes: 2, -// }, -// vote: { -// vote: "no", -// proposalId: "exampleId", -// drepId: "exampleId", -// url: "https://example.com", -// metadataHash: "exampleHash", -// }, -// }, -// }, -// play: async ({ canvasElement }) => { -// const canvas = within(canvasElement); -// await checkGovActionVisibility(canvas); -// }, -// }; +export const GovernanceVotedOnCardAbstain: Story = { + args: { + votedProposal: { + vote: { + date: new Date().toLocaleDateString(), + drepId: "drep1_exampledrepid1231231", + epochNo: 222, + metadataHash: "ababa1ababab1abababa1ababab1ababa1aba1", + proposalId: "exampleproposalid12dsadasdasda", + url: "https://exampleurl.com", + vote: "abstain", + }, + proposal: { + createdEpochNo: 232, + expiryEpochNo: 323, + isDataMissing: false, + createdDate: "1970-01-01T00:00:00Z", + expiryDate: "1970-02-01T00:00:00Z", + id: "exampleId", + type: "exampleType", + index: 1, + txHash: "exampleHash", + url: "https://example.com", + metadataHash: "exampleHash", + yesVotes: 1, + noVotes: 0, + abstainVotes: 2, + }, + }, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await checkGovActionVisibility(canvas); + expect(canvas.getByText(/abstain/i)).toBeInTheDocument(); + }, +}; -// export const GovernanceVotedOnCardAbstain: Story = { -// args: { -// votedProposal: { -// proposal: { -// createdDate: "1970-01-01T00:00:00Z", -// expiryDate: "1970-02-01T00:00:00Z", -// id: "exampleId", -// type: "exampleType", -// index: 1, -// txHash: "exampleHash", -// details: "some details", -// url: "https://example.com", -// metadataHash: "exampleHash", -// yesVotes: 1, -// noVotes: 0, -// abstainVotes: 2, -// }, -// vote: { -// vote: "abstain", -// proposalId: "exampleId", -// drepId: "exampleId", -// url: "https://example.com", -// metadataHash: "exampleHash", -// }, -// }, -// }, -// play: async ({ canvasElement }) => { -// const canvas = within(canvasElement); -// await checkGovActionVisibility(canvas); -// expect(canvas.getByText(/abstain/i)).toBeInTheDocument(); -// }, -// }; +export const GovernanceVotedOnCardYes: Story = { + args: { + votedProposal: { + vote: { + date: new Date().toLocaleDateString(), + drepId: "drep1_exampledrepid1231231", + epochNo: 222, + metadataHash: "ababa1ababab1abababa1ababab1ababa1aba1", + proposalId: "exampleproposalid12dsadasdasda", + url: "https://exampleurl.com", + vote: "yes", + }, + proposal: { + createdEpochNo: 232, + expiryEpochNo: 323, + isDataMissing: false, + createdDate: "1970-01-01T00:00:00Z", + expiryDate: "1970-02-01T00:00:00Z", + id: "exampleId", + type: "exampleType", + index: 1, + txHash: "exampleHash", + url: "https://example.com", + metadataHash: "exampleHash", + yesVotes: 1, + noVotes: 0, + abstainVotes: 2, + }, + }, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await checkGovActionVisibility(canvas); + expect(canvas.getByText(/yes/i)).toBeInTheDocument(); + }, +}; -// export const GovernanceVotedOnCardYes: Story = { -// args: { -// votedProposal: { -// proposal: { -// createdDate: "1970-01-01T00:00:00Z", -// expiryDate: "1970-02-01T00:00:00Z", -// id: "exampleId", -// type: "exampleType", -// index: 1, -// txHash: "exampleHash", -// details: "some details", -// url: "https://example.com", -// metadataHash: "exampleHash", -// yesVotes: 1, -// noVotes: 0, -// abstainVotes: 2, -// }, -// vote: { -// vote: "yes", -// proposalId: "exampleId", -// drepId: "exampleId", -// url: "https://example.com", -// metadataHash: "exampleHash", -// }, -// }, -// }, -// play: async ({ canvasElement }) => { -// const canvas = within(canvasElement); -// await checkGovActionVisibility(canvas); -// expect(canvas.getByText(/yes/i)).toBeInTheDocument(); -// }, -// }; - -// export const GovernanceVotedOnCardNo: Story = { -// args: { -// votedProposal: { -// proposal: { -// createdDate: "1970-01-01T00:00:00Z", -// expiryDate: "1970-02-01T00:00:00Z", -// id: "exampleId", -// type: "exampleType", -// index: 1, -// txHash: "exampleHash", -// details: "some details", -// url: "https://example.com", -// metadataHash: "exampleHash", -// yesVotes: 1, -// noVotes: 0, -// abstainVotes: 2, -// }, -// vote: { -// vote: "no", -// proposalId: "exampleId", -// drepId: "exampleId", -// url: "https://example.com", -// metadataHash: "exampleHash", -// }, -// }, -// }, -// play: async ({ canvasElement }) => { -// const canvas = within(canvasElement); -// await checkGovActionVisibility(canvas); -// expect(canvas.getByText(/no/i)).toBeInTheDocument(); -// }, -// }; +export const GovernanceVotedOnCardNo: Story = { + args: { + votedProposal: { + vote: { + date: new Date().toLocaleDateString(), + drepId: "drep1_exampledrepid1231231", + epochNo: 222, + metadataHash: "ababa1ababab1abababa1ababab1ababa1aba1", + proposalId: "exampleproposalid12dsadasdasda", + url: "https://exampleurl.com", + vote: "no", + }, + proposal: { + createdEpochNo: 232, + expiryEpochNo: 323, + isDataMissing: false, + createdDate: "1970-01-01T00:00:00Z", + expiryDate: "1970-02-01T00:00:00Z", + id: "exampleId", + type: "exampleType", + index: 1, + txHash: "exampleHash", + url: "https://example.com", + metadataHash: "exampleHash", + yesVotes: 1, + noVotes: 0, + abstainVotes: 2, + }, + }, + }, + play: async ({ canvasElement }) => { + const canvas = within(canvasElement); + await checkGovActionVisibility(canvas); + expect(canvas.getByText(/no/i)).toBeInTheDocument(); + }, +}; diff --git a/govtool/frontend/src/stories/Slider.stories.tsx b/govtool/frontend/src/stories/Slider.stories.tsx index 5b1baf473..9b4f5f443 100644 --- a/govtool/frontend/src/stories/Slider.stories.tsx +++ b/govtool/frontend/src/stories/Slider.stories.tsx @@ -4,7 +4,7 @@ import { Slider } from "@organisms"; import { within } from "@storybook/testing-library"; import { expect } from "@storybook/jest"; -const DATA = [1, 2, 3, 4, 5, 6]; +const DATA = [1, 2, 3, 4, 5, 6, 7, 8]; const BOX_SIZE = 200; const meta = { @@ -20,7 +20,8 @@ export const SliderComponent: Story = { args: { navigateKey: "key", title: "Slider title", - data: DATA.map((item) => ( + isShowAll: true, + data: DATA.slice(0, 6).map((item) => (
)), - dataLength: DATA.length, + dataLength: DATA.slice(0, 6).length, + notSlicedDataLength: DATA.length, }, play: async ({ canvasElement }) => { const canvas = within(canvasElement); diff --git a/govtool/frontend/yarn.lock b/govtool/frontend/yarn.lock index 19855528f..861210e72 100644 --- a/govtool/frontend/yarn.lock +++ b/govtool/frontend/yarn.lock @@ -4838,10 +4838,10 @@ chownr@^2.0.0: resolved "https://registry.npmjs.org/chownr/-/chownr-2.0.0.tgz" integrity sha512-bIomtDF5KGpdogkLd9VspvFzk9KfpyyGlS8YFVZl7TGPBHL5snIOnxeshwVgPteQ9b4Eydl+pVbIyE1DcvCWgQ== -chromatic@^10.0.0: - version "10.7.1" - resolved "https://registry.npmjs.org/chromatic/-/chromatic-10.7.1.tgz" - integrity sha512-ERxfVxTm8gnbv3bdWeNyUVQ4msbtYc/dZIpt+3TVxqEq4tMlzVCnTFl1rDfJ7Jj1enGFoxvZ+Q2xon7Jfi+cZw== +chromatic@^11.3.0: + version "11.3.0" + resolved "https://registry.npmjs.org/chromatic/-/chromatic-11.3.0.tgz" + integrity sha512-q1ZtJDJrjLGnz60ivpC16gmd7KFzcaA4eTb7gcytCqbaKqlHhCFr1xQmcUDsm14CK7JsqdkFU6S+JQdOd2ZNJg== ci-info@^3.2.0, ci-info@^3.7.0: version "3.9.0" diff --git a/govtool/metadata-validation/.env.example b/govtool/metadata-validation/.env.example new file mode 100644 index 000000000..c0c68b1ca --- /dev/null +++ b/govtool/metadata-validation/.env.example @@ -0,0 +1 @@ +PORT=3000 \ No newline at end of file diff --git a/govtool/submission-tool/.eslintrc.js b/govtool/metadata-validation/.eslintrc.js similarity index 100% rename from govtool/submission-tool/.eslintrc.js rename to govtool/metadata-validation/.eslintrc.js diff --git a/govtool/submission-tool/.gitignore b/govtool/metadata-validation/.gitignore similarity index 100% rename from govtool/submission-tool/.gitignore rename to govtool/metadata-validation/.gitignore diff --git a/govtool/submission-tool/.nvmrc b/govtool/metadata-validation/.nvmrc similarity index 100% rename from govtool/submission-tool/.nvmrc rename to govtool/metadata-validation/.nvmrc diff --git a/govtool/submission-tool/.prettierrc b/govtool/metadata-validation/.prettierrc similarity index 100% rename from govtool/submission-tool/.prettierrc rename to govtool/metadata-validation/.prettierrc diff --git a/govtool/submission-tool/Dockerfile b/govtool/metadata-validation/Dockerfile similarity index 100% rename from govtool/submission-tool/Dockerfile rename to govtool/metadata-validation/Dockerfile diff --git a/govtool/submission-tool/README.md b/govtool/metadata-validation/README.md similarity index 90% rename from govtool/submission-tool/README.md rename to govtool/metadata-validation/README.md index 07ccc60a2..0e6b3904d 100644 --- a/govtool/submission-tool/README.md +++ b/govtool/metadata-validation/README.md @@ -1,4 +1,4 @@ -# GovTool submission tool +# GovTool metadata validation tool Installed on your machine: @@ -16,7 +16,7 @@ Fill .env based on env.example file Go to the project directory ```bash -cd govtool/submission-tool +cd govtool/metadata-validation ``` Install dependencies @@ -91,7 +91,7 @@ yarn start:dev 2. Build the image ```bash -docker build -t submission-tool . +docker build -t metadata-validation . ``` 3. Fill .env based on env.example file @@ -99,7 +99,7 @@ docker build -t submission-tool . 4. Run the container ```bash -docker run -p 3000:3000 -d submission-tool +docker run -p 3000:3000 -d metadata-validation ``` ## After development diff --git a/govtool/submission-tool/docker-compose.yml b/govtool/metadata-validation/docker-compose.yml similarity index 51% rename from govtool/submission-tool/docker-compose.yml rename to govtool/metadata-validation/docker-compose.yml index 7c32065ee..bdf965762 100644 --- a/govtool/submission-tool/docker-compose.yml +++ b/govtool/metadata-validation/docker-compose.yml @@ -1,15 +1,13 @@ -version: '3.5' +version: '3.9' services: - submission-tool: + metadata-validation: build: context: . dockerfile: Dockerfile - container_name: submission-tool + container_name: metadata-validation environment: - PORT=${PORT} - - HEALTH_CHECK_KEY=${HEALTH_CHECK_KEY} - - HEALTH_CHECK_URL=${HEALTH_CHECK_URL} ports: - ${PORT}:${PORT} volumes: diff --git a/govtool/submission-tool/nest-cli.json b/govtool/metadata-validation/nest-cli.json similarity index 100% rename from govtool/submission-tool/nest-cli.json rename to govtool/metadata-validation/nest-cli.json diff --git a/govtool/submission-tool/package.json b/govtool/metadata-validation/package.json similarity index 98% rename from govtool/submission-tool/package.json rename to govtool/metadata-validation/package.json index ef71e1489..264d89c61 100644 --- a/govtool/submission-tool/package.json +++ b/govtool/metadata-validation/package.json @@ -1,5 +1,5 @@ { - "name": "submission-tool", + "name": "metadata-validation", "version": "0.0.1", "description": "", "author": "", diff --git a/govtool/submission-tool/src/app.controller.spec.ts b/govtool/metadata-validation/src/app.controller.spec.ts similarity index 100% rename from govtool/submission-tool/src/app.controller.spec.ts rename to govtool/metadata-validation/src/app.controller.spec.ts diff --git a/govtool/submission-tool/src/app.controller.ts b/govtool/metadata-validation/src/app.controller.ts similarity index 94% rename from govtool/submission-tool/src/app.controller.ts rename to govtool/metadata-validation/src/app.controller.ts index 0d2115e2e..0bcf57fe9 100644 --- a/govtool/submission-tool/src/app.controller.ts +++ b/govtool/metadata-validation/src/app.controller.ts @@ -7,7 +7,7 @@ import { ValidateMetadataResult } from './types/validateMetadata'; export class AppController { constructor(private readonly appService: AppService) {} - @Get('validate-metadata') + @Get('validate') validateMetadata( @Body() validateMetadataDto: ValidateMetadataDTO, ): Promise { diff --git a/govtool/submission-tool/src/app.module.ts b/govtool/metadata-validation/src/app.module.ts similarity index 100% rename from govtool/submission-tool/src/app.module.ts rename to govtool/metadata-validation/src/app.module.ts diff --git a/govtool/submission-tool/src/app.service.ts b/govtool/metadata-validation/src/app.service.ts similarity index 100% rename from govtool/submission-tool/src/app.service.ts rename to govtool/metadata-validation/src/app.service.ts diff --git a/govtool/submission-tool/src/dto/validateMetadata.dto.ts b/govtool/metadata-validation/src/dto/validateMetadata.dto.ts similarity index 100% rename from govtool/submission-tool/src/dto/validateMetadata.dto.ts rename to govtool/metadata-validation/src/dto/validateMetadata.dto.ts diff --git a/govtool/submission-tool/src/enums/ValidationError.ts b/govtool/metadata-validation/src/enums/ValidationError.ts similarity index 100% rename from govtool/submission-tool/src/enums/ValidationError.ts rename to govtool/metadata-validation/src/enums/ValidationError.ts diff --git a/govtool/metadata-validation/src/health/health.controller.ts b/govtool/metadata-validation/src/health/health.controller.ts new file mode 100644 index 000000000..03a6d2e3a --- /dev/null +++ b/govtool/metadata-validation/src/health/health.controller.ts @@ -0,0 +1,13 @@ +import { Controller, Get } from '@nestjs/common'; +import { HealthCheck } from '@nestjs/terminus'; + +@Controller('health') +export class HealthController { + constructor() {} + + @Get() + @HealthCheck() + check() { + return { status: 'ok' }; + } +} diff --git a/govtool/submission-tool/src/health/health.module.ts b/govtool/metadata-validation/src/health/health.module.ts similarity index 100% rename from govtool/submission-tool/src/health/health.module.ts rename to govtool/metadata-validation/src/health/health.module.ts diff --git a/govtool/submission-tool/src/main.ts b/govtool/metadata-validation/src/main.ts similarity index 100% rename from govtool/submission-tool/src/main.ts rename to govtool/metadata-validation/src/main.ts diff --git a/govtool/submission-tool/src/types/index.ts b/govtool/metadata-validation/src/types/index.ts similarity index 100% rename from govtool/submission-tool/src/types/index.ts rename to govtool/metadata-validation/src/types/index.ts diff --git a/govtool/submission-tool/src/types/validateMetadata.ts b/govtool/metadata-validation/src/types/validateMetadata.ts similarity index 100% rename from govtool/submission-tool/src/types/validateMetadata.ts rename to govtool/metadata-validation/src/types/validateMetadata.ts diff --git a/govtool/submission-tool/src/utils/canonizeJSON.ts b/govtool/metadata-validation/src/utils/canonizeJSON.ts similarity index 100% rename from govtool/submission-tool/src/utils/canonizeJSON.ts rename to govtool/metadata-validation/src/utils/canonizeJSON.ts diff --git a/govtool/submission-tool/src/utils/index.ts b/govtool/metadata-validation/src/utils/index.ts similarity index 100% rename from govtool/submission-tool/src/utils/index.ts rename to govtool/metadata-validation/src/utils/index.ts diff --git a/govtool/submission-tool/test/jest-e2e.json b/govtool/metadata-validation/test/jest-e2e.json similarity index 100% rename from govtool/submission-tool/test/jest-e2e.json rename to govtool/metadata-validation/test/jest-e2e.json diff --git a/govtool/submission-tool/tsconfig.build.json b/govtool/metadata-validation/tsconfig.build.json similarity index 100% rename from govtool/submission-tool/tsconfig.build.json rename to govtool/metadata-validation/tsconfig.build.json diff --git a/govtool/submission-tool/tsconfig.json b/govtool/metadata-validation/tsconfig.json similarity index 100% rename from govtool/submission-tool/tsconfig.json rename to govtool/metadata-validation/tsconfig.json diff --git a/govtool/submission-tool/yarn.lock b/govtool/metadata-validation/yarn.lock similarity index 100% rename from govtool/submission-tool/yarn.lock rename to govtool/metadata-validation/yarn.lock diff --git a/govtool/submission-tool/.env.example b/govtool/submission-tool/.env.example deleted file mode 100644 index e1414d0f1..000000000 --- a/govtool/submission-tool/.env.example +++ /dev/null @@ -1,3 +0,0 @@ -PORT=3000 -HEALTH_CHECK_KEY=google -HEALTH_CHECK_URL=https://google.com \ No newline at end of file diff --git a/govtool/submission-tool/src/health/health.controller.ts b/govtool/submission-tool/src/health/health.controller.ts deleted file mode 100644 index a1e212a30..000000000 --- a/govtool/submission-tool/src/health/health.controller.ts +++ /dev/null @@ -1,28 +0,0 @@ -import { Controller, Get } from '@nestjs/common'; -import { ConfigService } from '@nestjs/config'; -import { - HealthCheck, - HealthCheckService, - HttpHealthIndicator, -} from '@nestjs/terminus'; - -@Controller('health') -export class HealthController { - constructor( - private health: HealthCheckService, - private http: HttpHealthIndicator, - private configService: ConfigService, - ) {} - - @Get() - @HealthCheck() - check() { - return this.health.check([ - () => - this.http.pingCheck( - this.configService.get('HEALTH_CHECK_KEY'), - this.configService.get('HEALTH_CHECK_URL'), - ), - ]); - } -} diff --git a/scripts/govtool/config/templates/docker-compose.yml.tpl b/scripts/govtool/config/templates/docker-compose.yml.tpl index 03c05abee..4cf11a525 100644 --- a/scripts/govtool/config/templates/docker-compose.yml.tpl +++ b/scripts/govtool/config/templates/docker-compose.yml.tpl @@ -208,6 +208,27 @@ services: - "traefik.http.routers.backend.tls.certresolver=myresolver" - "traefik.http.services.backend.loadbalancer.server.port=9876" + metadata-validation: + build: + context: ../../govtool/metadata-validation + environment: + - PORT=3000 + logging: *logging + restart: always + healthcheck: + test: ["CMD-SHELL", "curl -f 127.0.0.1:3000/health || exit 1"] + interval: 5s + timeout: 5s + retries: 5 + labels: + - "traefik.enable=true" + - "traefik.http.routers.metadata-validation.rule=Host(``) && PathPrefix(`/metadata-validation`)" + - "traefik.http.middlewares.metadata-validation-stripprefix.stripprefix.prefixes=/metadata-validation" + - "traefik.http.routers.metadata-validation.middlewares=metadata-validation-stripprefix@docker" + - "traefik.http.routers.metadata-validation.entrypoints=websecure" + - "traefik.http.routers.metadata-validation.tls.certresolver=myresolver" + - "traefik.http.services.metadata-validation.loadbalancer.server.port=3000" + frontend: image: /frontend:${FRONTEND_TAG} volumes: