Merge pull request #95 from design-sparx/ft/refactor

chore and feature updates

.changeset/old-cups-type.md

@@ -0,0 +1,13 @@
+---
+"antd-multi-dashboard": patch
+---
+
+### Code optimization & bug fixes
+- chore: change onboarding flow. From landing → login → home
+- feat(ui): made general user interface simple and minimal
+- chore: cleaned up imports and refactors
+- chore(deps-dev): bump vite from 4.5.2 to 4.5.3
+- chore: refactored pages imports and exports
+- chore: refactored stories imports and exports
+- feat(page): added about project page
+- chore(docs): added CONTRIBUTING.md docs

.changeset/tiny-apes-sort.md

@@ -0,0 +1,5 @@
+---
+'antd-multi-dashboard': minor
+---
+
+optimized imports, added project about page and made UI simple and minimal

CONTRIBUTING.md

@@ -1,4 +1,51 @@
-This repo uses [changesets](https://github.com/changesets/changesets) to
-make releasing updates easier. For you, the contributor, this means you
-should run `npm run changeset` when you've got your changes ready. For
-more details, see this short document on [adding a changeset](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md#i-am-in-a-single-package-repository).
+# Contributing
+
+👍🎉 First off, thanks for taking the time to contribute! 🎉👍
+
+If you have found an issue or would like to request a new feature, simply create a new issue detailing the request. We also welcome pull requests. See below for information on getting started with development and submitting pull requests.
+
+Please note we have a [code of conduct](https://github.com/design-sparx/antd-multipurpose-dashboard/blob/main/CODE_OF_CONDUCT.md), please follow it in all your interactions with the project.
+
+> This repo uses [changesets](https://github.com/changesets/changesets) to
+> make releasing updates easier. For you, the contributor, this means you
+> should run `npm run changeset` when you've got your changes ready. For
+> more details, see this short document on [adding a changeset](https://github.com/changesets/changesets/blob/main/docs/adding-a-changeset.md#i-am-in-a-single-package-repository).
+
+## Found an Issue?
+
+If you find a bug in the source code or a mistake in the documentation, you can help us by submitting an issue to our [GitHub Repository](https://github.com/design-sparx/antd-multipurpose-dashboard/issues/new/choose). Even better you can submit a Pull Request with a fix.
+
+## Submitting a Pull Request
+
+1. Make sure that the contribution you want to make is explained or detailed in a GitHub issue! Find an [existing issue](https://github.com/design-sparx/antd-multipurpose-dashboard/issues) or [open a new one](https://github.com/design-sparx/antd-multipurpose-dashboard/issues/new/choose).
+2. Once done, [fork the repository](https://github.com/design-sparx/antd-multipurpose-dashboard/fork) in your own GitHub account.
+3. [Create a new Git branch](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-and-deleting-branches-within-your-repository).
+4. Make the changes on your branch.
+5. [Submit the branch as a PR](https://help.github.com/en/github/collaborating-with-issues-and-pull-requests/creating-a-pull-request-from-a-fork) pointing to the main branch of the main repository.
+   > We do not enforce a naming convention for the PRs, but please use something descriptive of your changes.
+
+## Development Workflow
+
+Install dependencies
+
+```
+pnpm install
+```
+
+Run dev server
+
+```
+pnpm run dev
+```
+
+## Linter
+
+Each PR should pass the linter to be accepted. To fix lint and prettier errors, run `pnpm run lint:fix` and `pnpm run prettier:fix`.
+
+## Commit Message
+
+We use [commitlint](https://commitlint.js.org/guides/getting-started) to manage and standardize our commits:
+
+- check [commitlint conventional guides](https://github.com/conventional-changelog/commitlint?tab=readme-ov-file#what-is-commitlint),
+- not finish by a dot or any other punctuation character (!,?),
+- start with a verb so that we can read your commit message this way: "This commit will ...", where "..." is the commit message. e.g.: "Fix the home page button" or "Add support for dark mode"

README.md

@@ -34,7 +34,7 @@
 - [Live preview](https://antd-multipurpose-dashboard.netlify.app/)
 - [Components preview](https://6546507b657a74164abf2db6-iqmnggdrcl.chromatic.com/)
 - [Medium](https://medium.com/@kelvink96/designing-modern-dashboards-a-journey-through-react-vite-ant-design-and-storybook-2dac23e1e49a)
-- [Product roadmap](https://kelvink96.notion.site/Antd-multipurpose-dashboard-Product-roadmap-92163e05b8ea444a8f87b7f834933069) _ **New** _
+- [Product roadmap](https://kelvink96.notion.site/Antd-multipurpose-dashboard-Product-roadmap-92163e05b8ea444a8f87b7f834933069) **New**
 
 ## Introduction
 
@@ -164,7 +164,7 @@ the source files are included in the package.
 ┃ ┣ 📂 assets/                  # Assets folder **
 ┃ ┣ 📂 components/              # App Components **
 ┃ ┣ 📂 constants/               # App Components **
-┃ ┃ ┗ 📃 routes.ts              # All routes declarations **
+┃ ┃ ┗ 📃 routes.tsx              # All routes declarations **
 ┃ ┣ 📂 context/                 # React state conexts **
 ┃ ┣ 📂 hooks/                   # React Hooks **
 ┃ ┃ ┗ 📃 useFetch.ts            # Data fetch hook (optional) **

src/components/BackBtn/BackBtn.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { withRouter } from 'storybook-addon-react-router-v6';
 
-import BackBtn from './BackBtn.tsx';
+import { BackBtn } from './BackBtn.tsx';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {

src/components/Card/Card.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import Card from './Card';
+import { Card } from './Card';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {

src/components/ContactForm/ContactForm.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import ContactForm from './ContactForm.tsx';
+import { ContactForm } from './ContactForm.tsx';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {

src/components/EmployeeCard/EmployeeCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import EmployeeCard from './EmployeeCard.tsx';
+import { EmployeeCard } from './EmployeeCard.tsx';
 
 const DATA = {
   employee_id: '24e4e64c-bf09-459f-8cea-f9d2de99d15b',

src/components/Loader/Loader.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import Loader from './Loader.tsx';
+import { Loader } from './Loader.tsx';
 
 const meta = {
   title: 'Components/Loader',

src/components/Logo/Logo.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { withRouter } from 'storybook-addon-react-router-v6';
 
-import Logo from './Logo.tsx';
+import { Logo } from './Logo.tsx';
 
 const meta = {
   title: 'Components/Logo',

src/components/MoreMenu/MoreMenu.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import MoreMenu from './MoreMenu.tsx';
+import { MoreMenu } from './MoreMenu.tsx';
 
 const meta = {
   title: 'Components/More menu',

src/components/NotificationsCard/Notifications.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import NotificationsData from '../../../public/mocks/Notifications.json';
 
-import NotificationsCard from './NotificationsCard.tsx';
+import { NotificationsCard } from './NotificationsCard.tsx';
 
 const meta = {
   title: 'Components/Notifications/List',

src/components/NotificationsItem/NotificationsItem.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import NotificationsItem from './NotificationsItem.tsx';
+import { NotificationsItem } from './NotificationsItem.tsx';
 
 const DATA = {
   notification_id: 'dcffd2c4-63d7-4b70-88c2-e079fc7cde6f',

src/components/PageHeader/PageHeader.stories.tsx

@@ -4,7 +4,7 @@ import { Link } from 'react-router-dom';
 import { withRouter } from 'storybook-addon-react-router-v6';
 import { DASHBOARD_ITEMS } from '../../constants';
 
-import PageHeader from './PageHeader.tsx';
+import { PageHeader } from './PageHeader.tsx';
 
 const meta = {
   title: 'Components/Page header',

src/components/PricingTable/PricingTable.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import PricingData from '../../../public/mocks/Pricing.json';
 
-import PricingTable from './PricingTable.tsx';
+import { PricingTable } from './PricingTable.tsx';
 
 const meta = {
   title: 'Components/Pricing table',

src/components/RefreshBtn/RefreshBtn.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import RefreshBtn from './RefreshBtn.tsx';
+import { RefreshBtn } from './RefreshBtn.tsx';
 
 const meta = {
   title: 'Components/Refresh button',

src/components/SitemapCard/SitemapCard.stories.tsx

@@ -2,7 +2,7 @@ import type { Meta, StoryObj } from '@storybook/react';
 import { withRouter } from 'storybook-addon-react-router-v6';
 import { DASHBOARD_ITEMS } from '../../constants';
 
-import SitemapCard from './SitemapCard.tsx';
+import { SitemapCard } from './SitemapCard.tsx';
 
 const meta = {
   title: 'Components/Sitemap',

src/components/SocialMediaCard/SocialMediaCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import SocialMediaCard from './SocialMediaCard.tsx';
+import { SocialMediaCard } from './SocialMediaCard.tsx';
 
 const meta = {
   title: 'Components/Social media',

src/components/TimelineCard/TimelineCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import TimelineData from '../../../public/mocks/TimelineActivity.json';
 
-import TimelineCard from './TimelineCard.tsx';
+import { TimelineCard } from './TimelineCard.tsx';
 
 const meta = {
   title: 'Components/Timeline',

src/components/UserAvatar/UserAvatar.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import UserAvatar from './UserAvatar.tsx';
+import { UserAvatar } from './UserAvatar.tsx';
 
 const meta = {
   title: 'Components/User avatar',

src/components/corporate/BlogsListCard/BlogListCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import { withRouter } from 'storybook-addon-react-router-v6';
 
-import BlogsListCard from './BlogsListCard.tsx';
+import { BlogsListCard } from './BlogsListCard.tsx';
 
 const MOCK_DATA = Array.from({ length: 5 }).map((_, i) => ({
   href: 'https://ant.design',

src/components/dashboard/bidding/CategoriesCard/Categories.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import CategoriesCard from './CategoriesCard.tsx';
+import { CategoriesCard } from './CategoriesCard.tsx';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {

src/components/dashboard/bidding/CreatorsCard/CreatorsCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CreatorsData from '../../../../../public/mocks/AuctionCreators.json';
 
-import CreatorsCard from './CreatorsCard.tsx';
+import { CreatorsCard } from './CreatorsCard.tsx';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {

src/components/dashboard/bidding/TopItemsCard/TopItems.stories.tsx

@@ -1,20 +1,20 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import TopItemsData from '../../../../../public/mocks/BiddingTopSellers.json';
 
-import TopItems from './TopItems.tsx';
+import { TopItemsCard } from './TopItems.tsx';
 
 // More on how to set up stories at: https://storybook.js.org/docs/react/writing-stories/introduction#default-export
 const meta = {
   title: 'Components/Dashboard/Bidding/Top items table',
-  component: TopItems,
+  component: TopItemsCard,
   parameters: {
     // Optional parameter to center the component in the Canvas. More info: https://storybook.js.org/docs/react/configure/story-layout
     layout: 'centered',
   },
   // This component will have an automatically generated Autodocs entry: https://storybook.js.org/docs/react/writing-docs/autodocs
   tags: ['autodocs'],
   // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
-} satisfies Meta<typeof TopItems>;
+} satisfies Meta<typeof TopItemsCard>;
 
 export default meta;
 type Story = StoryObj<typeof meta>;

src/components/dashboard/bidding/TransactionsCard/TransactionsCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import TransactionsData from '../../../../../public/mocks/BiddingTransactions.json';
 
-import TransactionsCard from './TransactionsCard.tsx';
+import { TransactionsCard } from './TransactionsCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Bidding/Transactions table',

src/components/dashboard/default/CampaignsCard/CampaignsCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CampaignsData from '../../../../../public/mocks/Campaigns.json';
 
-import CampaignsCard from './CampaignsCard.tsx';
+import { CampaignsCard } from './CampaignsCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Campaigns table',

src/components/dashboard/default/EarningsCard/EarningsCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import EarningsCard from './EarningsCard.tsx';
+import { EarningsCard } from './EarningsCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Earnings card',

src/components/dashboard/default/GetStartedCard/GetStartedCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import GetStartedCard from './GetStartedCard.tsx';
+import { GetStartedCard } from './GetStartedCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Get started card',

src/components/dashboard/default/LatestOrdersCard/LatestOrdersCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CampaignsData from '../../../../../public/mocks/Campaigns.json';
 
-import LatestOrdersCard from './LatestOrdersCard.tsx';
+import { LatestOrdersCard } from './LatestOrdersCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Orders/Table',

src/components/dashboard/default/OrdersChart/OrdersChart.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import OrdersChart from './OrdersChart.tsx';
+import { OrdersChart } from './OrdersChart.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Orders/Chart',

src/components/dashboard/default/RecentUsersCard/RecentUsersCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CampaignsData from '../../../../../public/mocks/Campaigns.json';
 
-import RecentUsersCard from './RecentUsersCard.tsx';
+import { RecentUsersCard } from './RecentUsersCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Users card',

src/components/dashboard/default/SubscribersChart/SubscribersChart.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import SubscribersChart from './SubscribersChart.tsx';
+import { SubscribersChart } from './SubscribersChart.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Subscribers card',

src/components/dashboard/default/TasksChartCard/TasksChart.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import TasksChartCard from './TasksChartCard.tsx';
+import { TasksChartCard } from './TasksChartCard.tsx';
 
 const TASKS_DATA = [
   {

src/components/dashboard/default/TasksListCard/TasksList.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import TasksListData from '../../../../../public/mocks/TasksList.json';
 
-import TasksListCard from './TasksListCard.tsx';
+import { TasksListCard } from './TasksListCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Default/Tasks/List',

src/components/dashboard/default/WeeklyActivityCard/WeeklyActivityCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import WeeklyActivityCard from './WeeklyActivityCard.tsx';
+import { WeeklyActivityCard } from './WeeklyActivityCard.tsx';
 
 const ACTIVITY_DATA = [
   {

src/components/dashboard/ecommerce/CustomerReviewsCard/CustomerReviewsCard.stories.tsx

@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from '@storybook/react';
 
-import CustomerReviewsCard from './CustomerReviewsCard.tsx';
+import { CustomerReviewsCard } from './CustomerReviewsCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Ecommerce/Customer reviews card',

src/components/dashboard/learning/CommunityGroupsCard/CommunityGroupsCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CommunityGroupsData from '../../../../../public/mocks/CommunityGroups.json';
 
-import CommunityGroupCard from './CommunityGroupCard.tsx';
+import { CommunityGroupCard } from './CommunityGroupCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Learning/Communities card',

src/components/dashboard/learning/CoursesCard/CoursesCard.stories.tsx

@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react';
 import CoursesData from '../../../../../public/mocks/Courses.json';
 
-import CoursesCard from './CoursesCard.tsx';
+import { CoursesCard } from './CoursesCard.tsx';
 
 const meta = {
   title: 'Components/Dashboard/Learning/Courses/Table',