[#541] move dashboard components into features folder

govtool/frontend/src/App.tsx

@@ -5,7 +5,6 @@ import { Modal, ScrollToTop } from "@atoms";
 import { PATHS } from "@consts";
 import { useCardano, useModal } from "@context";
 import {
-  DashboardCards,
   DashboardGovernanceActions,
   DashboardGovernanceActionDetails,
 } from "@organisms";
@@ -29,6 +28,7 @@ import {
   WALLET_LS_KEY,
   removeItemFromLocalStorage,
 } from "@utils";
+import { DashboardCards } from "@features";
 import { SetupInterceptors } from "./services";
 import { useWalletConnectionListener } from "./hooks";
 import { RegisterAsSoleVoter } from "./pages/RegisterAsSoleVoter";

govtool/frontend/src/components/organisms/DashboardCards.tsx → govtool/frontend/src/components/features/dashboard/DashboardCards.tsx

@@ -9,11 +9,13 @@ import {
   useGetVoterInfo,
   useTranslation
 } from "@hooks";
-import { DelegateDashboardCard } from "./DashboardCards/DelegateDashboardCard";
-import { DRepDashboardCard } from "./DashboardCards/DRepDashboardCard";
-import { SoleVoterDashboardCard } from "./DashboardCards/SoleVoterDashboardCard";
-import { ListGovActionsDashboardCards } from "./DashboardCards/ListGovActionsDashboardCard";
-import { ProposeGovActionDashboardCard } from "./DashboardCards/ProposeGovActionDashboardCard";
+import {
+  DelegateDashboardCard,
+  DRepDashboardCard,
+  SoleVoterDashboardCard,
+  ListGovActionsDashboardCards,
+  ProposeGovActionDashboardCard
+} from "./cards";
 
 export const DashboardCards = () => {
   const {

govtool/frontend/src/components/organisms/DashboardDrawerMobile.tsx → govtool/frontend/src/components/features/dashboard/DashboardDrawerMobile.tsx

@@ -5,13 +5,14 @@ import { CONNECTED_NAV_ITEMS, ICONS } from "@consts";
 import { DRepInfoCard, WalletInfoCard } from "@molecules";
 import { useGetVoterInfo, useScreenDimension } from "@hooks";
 import { openInNewTab } from "@utils";
-
-import { DashboardDrawerMobileProps } from "./types";
+import { DrawerMobileProps } from "@/components/organisms/types";
 
 const DRAWER_PADDING = 2;
 // 8 is number of multiple in Material UI 2 is left and right side
 const CALCULATED_DRAWER_PADDING = DRAWER_PADDING * 8 * 2;
 
+export type DashboardDrawerMobileProps = Omit<DrawerMobileProps, "isConnectButton">;
+
 export const DashboardDrawerMobile = ({
   isDrawerOpen,
   setIsDrawerOpen,

govtool/frontend/src/components/organisms/DashboardTopNav.tsx → govtool/frontend/src/components/features/dashboard/DashboardTopNav.tsx

@@ -4,7 +4,7 @@ import { Box, IconButton } from "@mui/material";
 import { VotingPowerChips, Typography } from "@atoms";
 import { ICONS } from "@consts";
 import { useScreenDimension } from "@hooks";
-import { DashboardDrawerMobile } from "@organisms";
+import { DashboardDrawerMobile } from "./DashboardDrawerMobile";
 
 type DashboardTopNavProps = {
   title: string;

govtool/frontend/src/components/organisms/DashboardCards/DRepDashboardCard.tsx → govtool/frontend/src/components/features/dashboard/cards/DRepDashboardCard.tsx

@@ -3,14 +3,11 @@ import { useNavigate } from "react-router-dom";
 
 import { IMAGES, PATHS } from "@consts";
 import { useTranslation } from "@hooks";
-import {
-  CopyableInfo,
-  DashboardActionCard,
-  DashboardActionCardProps,
-} from "@molecules";
+import { CopyableInfo } from "@molecules";
 import { openInNewTab } from "@utils";
 import { PendingTransaction } from "@/context/pendingTransaction";
 import { VoterInfo } from "@/models";
+import { DashboardActionCard, DashboardActionCardProps } from "./DashboardActionCard";
 
 type DRepDashboardCardProps = {
   dRepIDBech32: string;

govtool/frontend/src/components/molecules/DashboardActionCard.tsx → govtool/frontend/src/components/features/dashboard/cards/DashboardActionCard.tsx

@@ -3,7 +3,7 @@ import { FC, ReactNode } from "react";
 
 import { LoadingButton, LoadingButtonProps, Typography } from "@atoms";
 import { useScreenDimension, useTranslation } from "@hooks";
-import { Card } from "./Card";
+import { Card } from "@molecules";
 
 export type DashboardActionCardProps = {
   buttons?: LoadingButtonProps[];

govtool/frontend/src/components/organisms/DashboardCards/DelegateDashboardCard.tsx → govtool/frontend/src/components/features/dashboard/cards/DelegateDashboardCard.tsx

@@ -3,13 +3,10 @@ import { Trans } from "react-i18next";
 
 import { IMAGES, PATHS } from "@consts";
 import { useTranslation } from "@hooks";
-import {
-  CopyableInfo,
-  DashboardActionCard,
-  DashboardActionCardProps,
-} from "@molecules";
+import { CopyableInfo } from "@molecules";
 import { correctAdaFormat, formHexToBech32, openInNewTab } from "@utils";
 import { PendingTransaction } from "@/context/pendingTransaction";
+import { DashboardActionCard, DashboardActionCardProps } from "./DashboardActionCard";
 
 type DelegateDashboardCardProps = {
   currentDelegation: string;

govtool/frontend/src/components/organisms/DashboardCards/ListGovActionsDashboardCard.tsx → govtool/frontend/src/components/features/dashboard/cards/ListGovActionsDashboardCard.tsx

@@ -2,8 +2,8 @@ import { useNavigate } from "react-router-dom";
 
 import { IMAGES, PATHS } from "@consts";
 import { useTranslation } from "@hooks";
-import { DashboardActionCard } from "@molecules";
 import { VoterInfo } from "@/models";
+import { DashboardActionCard } from "./DashboardActionCard";
 
 type ListGovActionsDashboardCardsProps = {
   voter: VoterInfo;

govtool/frontend/src/components/organisms/DashboardCards/ProposeGovActionDashboardCard.tsx → govtool/frontend/src/components/features/dashboard/cards/ProposeGovActionDashboardCard.tsx

@@ -2,9 +2,9 @@ import { useNavigate } from "react-router-dom";
 
 import { IMAGES, PATHS } from "@consts";
 import { useTranslation } from "@hooks";
-import { DashboardActionCard } from "@molecules";
 import { openInNewTab } from "@utils";
 import { PendingTransaction } from "@/context/pendingTransaction";
+import { DashboardActionCard } from "./DashboardActionCard";
 
 type ProposeGovActionDashboardCardProps = {
   createGovActionTx: PendingTransaction["createGovAction"];

govtool/frontend/src/components/organisms/DashboardCards/SoleVoterDashboardCard.tsx → govtool/frontend/src/components/features/dashboard/cards/SoleVoterDashboardCard.tsx

@@ -3,11 +3,11 @@ import { Trans } from "react-i18next";
 
 import { IMAGES, PATHS } from "@consts";
 import { useTranslation } from "@hooks";
-import { DashboardActionCard, DashboardActionCardProps } from "@molecules";
 import { correctAdaFormat, openInNewTab } from "@utils";
 import { LoadingButtonProps } from "@atoms";
 import { PendingTransaction } from "@/context/pendingTransaction";
 import { VoterInfo } from "@/models";
+import { DashboardActionCard, DashboardActionCardProps } from "./DashboardActionCard";
 
 type SoleVoterDashboardCardProps = {
   pendingTransaction: PendingTransaction;

govtool/frontend/src/components/features/dashboard/cards/index.ts

@@ -0,0 +1,6 @@
+export * from "./DRepDashboardCard";
+export * from "./DashboardActionCard";
+export * from "./DelegateDashboardCard";
+export * from "./ListGovActionsDashboardCard";
+export * from "./ProposeGovActionDashboardCard";
+export * from "./SoleVoterDashboardCard";

govtool/frontend/src/components/features/dashboard/index.ts

@@ -0,0 +1,5 @@
+export * from "./DashboardCards";
+export * from "./DashboardDrawerMobile";
+export * from "./DashboardTopNav";
+
+export * from "./cards";

govtool/frontend/src/components/features/index.ts

@@ -0,0 +1 @@
+export * from "./dashboard";

govtool/frontend/src/components/molecules/CenteredBoxPageWrapper.tsx

@@ -3,7 +3,7 @@ import { Box, Link } from "@mui/material";
 
 import { Background, Typography } from "@atoms";
 import { ICONS } from "@consts";
-import { DashboardTopNav } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { useScreenDimension } from "@hooks";
 import { useNavigate } from "react-router-dom";
 import { theme } from "@/theme";

govtool/frontend/src/components/molecules/index.ts

@@ -4,7 +4,6 @@ export * from "./Card";
 export * from "./CenteredBoxBottomButtons";
 export * from "./CenteredBoxPageWrapper";
 export * from "./CopyableInfo";
-export * from "./DashboardActionCard";
 export * from "./DataActionsBar";
 export * from "./DataMissingInfoBox";
 export * from "./DRepInfoCard";

govtool/frontend/src/components/organisms/index.ts

@@ -3,13 +3,9 @@ export * from "./ChooseStakeKeyPanel";
 export * from "./ChooseWalletModal";
 export * from "./ControlledField";
 export * from "./CreateGovernanceActionSteps";
-export * from "./DashboardCards";
-export * from "./DashboardCards";
-export * from "./DashboardDrawerMobile";
 export * from "./DashboardGovernanceActionDetails";
 export * from "./DashboardGovernanceActions";
 export * from "./DashboardGovernanceActionsVotedOn";
-export * from "./DashboardTopNav";
 export * from "./DelegateTodRepStepOne";
 export * from "./DelegateTodRepStepTwo";
 export * from "./Drawer";

govtool/frontend/src/components/organisms/types.ts

@@ -12,11 +12,8 @@ export type BgCardProps = {
   sx?: SxProps;
 };
 
-export type DashboardDrawerMobileProps = {
+export type DrawerMobileProps = {
+  isConnectButton: boolean;
   isDrawerOpen: boolean;
   setIsDrawerOpen: Dispatch<SetStateAction<boolean>>;
 };
-
-export type DrawerMobileProps = DashboardDrawerMobileProps & {
-  isConnectButton: boolean;
-};

govtool/frontend/src/pages/CreateGovernanceAction.tsx

@@ -15,13 +15,13 @@ import { LinkWithIcon } from "@molecules";
 import {
   ChooseGovernanceActionType,
   CreateGovernanceActionForm,
-  DashboardTopNav,
   Footer,
   ReviewCreatedGovernanceAction,
   StorageInformation,
   StoreDataInfo,
   WhatGovernanceActionIsAbout,
 } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { checkIsWalletConnected } from "@utils";
 
 export const CreateGovernanceAction = () => {

govtool/frontend/src/pages/Dashboard.tsx

@@ -6,8 +6,9 @@ import { Background, ScrollToManage } from "@atoms";
 import { PATHS } from "@consts";
 import { useCardano } from "@context";
 import { useScreenDimension, useTranslation } from "@hooks";
-import { DashboardTopNav, Drawer, Footer } from "@organisms";
+import { Drawer, Footer } from "@organisms";
 import { checkIsWalletConnected } from "@utils";
+import { DashboardTopNav } from "@features";
 
 export const Dashboard = () => {
   const { isEnabled, stakeKey } = useCardano();

govtool/frontend/src/pages/DelegateTodRep.tsx

@@ -6,11 +6,11 @@ import { Background } from "@atoms";
 import { PATHS } from "@consts";
 import { useScreenDimension, useTranslation } from "@hooks";
 import {
-  DashboardTopNav,
   DelegateTodRepStepOne,
   DelegateTodRepStepTwo,
   Footer,
 } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { checkIsWalletConnected } from "@utils";
 
 export const DelegateTodRep = () => {

govtool/frontend/src/pages/RegisterAsdRep.tsx

@@ -13,13 +13,13 @@ import {
 } from "@hooks";
 import { LinkWithIcon } from "@molecules";
 import {
-  DashboardTopNav,
   DRepStorageInformation,
   DRepStoreDataInfo,
   Footer,
   RegisterAsDRepForm,
   RolesAndResponsibilities,
 } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { checkIsWalletConnected } from "@utils";
 
 export const RegisterAsdRep = () => {

govtool/frontend/src/pages/UpdatedRepMetadata.tsx

@@ -10,7 +10,8 @@ import {
   useUpdatedRepMetadataForm,
   useTranslation,
 } from "@hooks";
-import { ControlledField, DashboardTopNav, Footer } from "@organisms";
+import { ControlledField, Footer } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { checkIsWalletConnected, openInNewTab } from "@utils";
 import { theme } from "@/theme";
 

govtool/frontend/src/stories/DashboardCard.stories.ts

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/react";
 
-import { DashboardActionCard } from "@molecules";
+import { DashboardActionCard } from "@features";
 import { within } from "@storybook/testing-library";
 import { expect } from "@storybook/jest";
 import { IMAGES } from "@/consts";
@@ -19,10 +19,12 @@ type Story = StoryObj<typeof meta>;
 
 export const DashboardCardComponent: Story = {
   args: {
+    buttons: [
+      { children: "first button" },
+      { children: "second button" },
+    ],
     description: "Lorem ipsum dolor sit amet, consectetur adipisicing elit.",
-    firstButtonLabel: "first button",
     imageURL: IMAGES.govActionDelegateImage,
-    secondButtonLabel: "second button",
     title: "Action card",
   },
   play: async ({ canvasElement }) => {
@@ -36,23 +38,27 @@ export const DashboardCardComponent: Story = {
   },
 };
 
-export const WithDRepIdDashboardCardComponent: Story = {
+export const WithChildrenDashboardCardComponent: Story = {
   args: {
+    buttons: [
+      { children: "first button" },
+      { children: "second button" },
+    ],
     description: "Lorem ipsum dolor sit amet, consectetur adipisicing elit.",
-    firstButtonLabel: "first button",
     imageURL: IMAGES.govActionDelegateImage,
-    secondButtonLabel: "second button",
     title: "Action card",
-    cardId: "drep1gwsw9ckkhuwscj9savt5f7u9xsrudw209hne7pggcktzuw5sv32",
+    children: "You can insert any children you want",
   },
 };
 
 export const LoadingDashboardCard: Story = {
   args: {
+    buttons: [
+      { children: "first button" },
+      { children: "second button" },
+    ],
     description: "Lorem ipsum dolor sit amet, consectetur adipisicing elit.",
-    firstButtonLabel: "first button",
     imageURL: IMAGES.govActionDelegateImage,
-    secondButtonLabel: "second button",
     title: "Action card",
     isLoading: true,
   },
@@ -67,12 +73,14 @@ export const LoadingDashboardCard: Story = {
 
 export const InProgressDashboardCard: Story = {
   args: {
+    buttons: [
+      { children: "first button" },
+      { children: "second button" },
+    ],
     description: "Lorem ipsum dolor sit amet, consectetur adipisicing elit.",
-    firstButtonLabel: "first button",
     imageURL: IMAGES.govActionDelegateImage,
-    secondButtonLabel: "second button",
     title: "Action card",
-    inProgress: true,
+    state: "inProgress",
   },
   play: async ({ canvasElement }) => {
     const canvas = within(canvasElement);

govtool/frontend/src/stories/DashboardTopNav.stories.ts

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/react";
 
-import { DashboardTopNav } from "@organisms";
+import { DashboardTopNav } from "@features";
 import { within, userEvent, waitFor, screen } from "@storybook/testing-library";
 import { expect } from "@storybook/jest";
 

govtool/frontend/tsconfig.json

@@ -31,6 +31,7 @@
       "@services": ["./src/services/index.ts"],
       "@molecules": ["./src/components/molecules/index.ts"],
       "@organisms": ["./src/components/organisms/index.ts"],
+      "@features": ["./src/components/features/index.ts"],
       "@context": ["./src/context/index.ts"],
       "@models": ["./src/models/index.ts"],
       "@utils": ["./src/utils/index.ts"]

govtool/frontend/vite.config.ts

@@ -30,6 +30,10 @@ const viteConfig = defineViteConfig({
         find: "@organisms",
         replacement: path.resolve(__dirname, "./src/components/organisms"),
       },
+      {
+        find: "@features",
+        replacement: path.resolve(__dirname, "./src/components/features"),
+      },
       {
         find: "@context",
         replacement: path.resolve(__dirname, "./src/context"),