From 43ab85913a06c487161b11ac3accbee89d1e9222 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20G=C3=B3recki?= Date: Thu, 7 Nov 2024 14:11:25 +0100 Subject: [PATCH 1/4] remove link to user from menu --- .../Header/MenuIconic/MenuIconicItemUserAuthenticated.tsx | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/storefront/components/Layout/Header/MenuIconic/MenuIconicItemUserAuthenticated.tsx b/storefront/components/Layout/Header/MenuIconic/MenuIconicItemUserAuthenticated.tsx index 2843739c49..f9b0d81654 100644 --- a/storefront/components/Layout/Header/MenuIconic/MenuIconicItemUserAuthenticated.tsx +++ b/storefront/components/Layout/Header/MenuIconic/MenuIconicItemUserAuthenticated.tsx @@ -33,8 +33,7 @@ export const MenuIconicItemUserAuthenticated: FC = () => { onMouseLeave={() => isDesktop && setIsHovered(false)} >
From 98aa7bb7065d0e304cfede8084567b8fb45c21f4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20G=C3=B3recki?= Date: Thu, 7 Nov 2024 14:55:18 +0100 Subject: [PATCH 2/4] add icons to menu on customer pages --- .../Blocks/UserNavigation/UserNavigation.tsx | 11 +++++++---- storefront/utils/user/useUserMenuItems.ts | 15 +++++++++++++++ 2 files changed, 22 insertions(+), 4 deletions(-) diff --git a/storefront/components/Blocks/UserNavigation/UserNavigation.tsx b/storefront/components/Blocks/UserNavigation/UserNavigation.tsx index 6bdfe645d9..daa8768633 100644 --- a/storefront/components/Blocks/UserNavigation/UserNavigation.tsx +++ b/storefront/components/Blocks/UserNavigation/UserNavigation.tsx @@ -1,5 +1,6 @@ import { ExtendedNextLink } from 'components/Basic/ExtendedNextLink/ExtendedNextLink'; import { ArrowIcon } from 'components/Basic/Icon/ArrowIcon'; +import { ExitIcon } from 'components/Basic/Icon/ExitIcon'; import { Button } from 'components/Forms/Button/Button'; import { m } from 'framer-motion'; import useTranslation from 'next-translate/useTranslation'; @@ -12,7 +13,7 @@ import { useUserMenuItems } from 'utils/user/useUserMenuItems'; const getMenuItemTwClass = (menuItemLink?: string, asPath?: string) => twJoin( - 'border-b border-borderAccent last:border-none no-underline px-2 py-3 flex justify-between gap-4', + 'border-b border-borderAccent last:border-none no-underline px-4 py-3 flex justify-between gap-4 text-sm', menuItemLink && asPath?.includes(menuItemLink) ? 'bg-backgroundAccentLess text-textAccent hover:text-textAccent' : 'bg-backgroundMore text-text hover:text-textAccent', @@ -26,7 +27,7 @@ export const UserNavigation: FC = () => { const logoutHandler = useLogout(); return ( -
+
diff --git a/storefront/utils/user/useUserMenuItems.ts b/storefront/utils/user/useUserMenuItems.ts index b3fcc7f178..658862b3b3 100644 --- a/storefront/utils/user/useUserMenuItems.ts +++ b/storefront/utils/user/useUserMenuItems.ts @@ -1,3 +1,10 @@ +import { CompareIcon } from 'components/Basic/Icon/CompareIcon'; +import { ComplaintsIcon } from 'components/Basic/Icon/ComplaintsIcon'; +import { EditIcon } from 'components/Basic/Icon/EditIcon'; +import { HeartIcon } from 'components/Basic/Icon/HeartIcon'; +import { LockCheckIcon } from 'components/Basic/Icon/LockCheck'; +import { SearchListIcon } from 'components/Basic/Icon/SearchListIcon'; +import { UserIcon } from 'components/Basic/Icon/UserIcon'; import { useDomainConfig } from 'components/providers/DomainConfigProvider'; import useTranslation from 'next-translate/useTranslation'; import { PageType } from 'store/slices/createPageLoadingStateSlice'; @@ -10,6 +17,7 @@ type UserMenuItemType = { link: string; text: string; count?: number; + iconComponent?: React.ElementType; type?: PageType; }; @@ -45,33 +53,39 @@ export const useUserMenuItems = (): UserMenuItemType[] => { text: t('Orders'), link: customerOrdersUrl, type: 'orderList', + iconComponent: SearchListIcon, }, { text: t('Complaints'), link: customerComplaintsUrl, type: 'complaintList', + iconComponent: ComplaintsIcon, }, { text: t('Edit profile'), link: customerEditProfileUrl, type: 'editProfile', + iconComponent: EditIcon, }, { text: t('Change password'), link: customerChangePasswordUrl, type: 'changePassword', + iconComponent: LockCheckIcon, }, { text: t('Wishlist'), link: wishlistUrl, count: wishlist?.products.length, type: 'wishlist', + iconComponent: HeartIcon, }, { text: t('Comparison'), link: productComparisonUrl, count: comparison?.products.length, type: 'comparison', + iconComponent: CompareIcon, }, ]; @@ -85,6 +99,7 @@ export const useUserMenuItems = (): UserMenuItemType[] => { text: t('Customer users'), link: customerUsersUrl, type: 'customer-users', + iconComponent: UserIcon, }, ...userMenuItems.slice(2), ]; From 1fd7a573d671567118138716837eb8203fdff262 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Jan=20G=C3=B3recki?= Date: Fri, 8 Nov 2024 01:08:51 +0100 Subject: [PATCH 3/4] remove user signpost --- .../Blocks/Skeleton/SkeletonManager.tsx | 3 - .../Skeleton/SkeletonPageCustomerAccount.tsx | 18 --- .../SkeletonPageCustomerChangePassword.tsx | 2 +- .../SkeletonPageCustomerComplaintDetail.tsx | 2 +- .../SkeletonPageCustomerComplaintList.tsx | 2 +- .../SkeletonPageCustomerComplaintNew.tsx | 2 +- .../SkeletonPageCustomerEditProfile.tsx | 2 +- .../SkeletonPageCustomerOrderDetail.tsx | 2 +- .../SkeletonPageCustomerOrderList.tsx | 2 +- .../Skeleton/SkeletonPageCustomerUsers.tsx | 2 +- .../Blocks/UserNavigation/UserNavigation.tsx | 8 +- .../components/Layout/CustomerLayout.tsx | 15 +-- .../MenuIconicItemUserAuthenticated.tsx | 6 +- .../Pages/Customer/CustomerContent.tsx | 107 ------------------ .../cypress/e2e/authentication/login.cy.ts | 2 +- storefront/cypress/fixtures/demodata.ts | 1 - ... edit page) register as a B2C customer.png | Bin 381431 -> 382518 bytes ...st created order is in customer orders.png | Bin 385245 -> 386349 bytes ...st created order is in customer orders.png | Bin 408373 -> 409827 bytes storefront/pages/customer.tsx | 45 -------- storefront/public/locales/cs/common.json | 1 - storefront/public/locales/en/common.json | 1 - storefront/public/locales/sk/common.json | 1 - storefront/utils/user/useUserMenuItems.ts | 16 +-- 24 files changed, 22 insertions(+), 218 deletions(-) delete mode 100644 storefront/components/Blocks/Skeleton/SkeletonPageCustomerAccount.tsx delete mode 100644 storefront/components/Pages/Customer/CustomerContent.tsx delete mode 100644 storefront/pages/customer.tsx diff --git a/storefront/components/Blocks/Skeleton/SkeletonManager.tsx b/storefront/components/Blocks/Skeleton/SkeletonManager.tsx index eec8f311fc..fb6a9e1f08 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonManager.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonManager.tsx @@ -8,7 +8,6 @@ import { SkeletonPageComparison } from './SkeletonPageComparison'; import { SkeletonPageConfirmation } from './SkeletonPageConfirmation'; import { SkeletonPageContact } from './SkeletonPageContact'; import { SkeletonPageContactInformation } from './SkeletonPageContactInformation'; -import { SkeletonPageCustomerAccount } from './SkeletonPageCustomerAccount'; import { SkeletonPageCustomerChangePassword } from './SkeletonPageCustomerChangePassword'; import { SkeletonPageCustomerComplaintDetail } from './SkeletonPageCustomerComplaintDetail'; import { SkeletonPageCustomerComplaintList } from './SkeletonPageCustomerComplaintList'; @@ -84,8 +83,6 @@ export const SkeletonManager: FC = ({ return ; case 'contact-information': return ; - case 'account': - return ; case 'complaintNew': return ; case 'complaintDetail': diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerAccount.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerAccount.tsx deleted file mode 100644 index cba48655c9..0000000000 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerAccount.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { SkeletonModuleBreadcrumbs } from './SkeletonModuleBreadcrumbs'; -import { Webline } from 'components/Layout/Webline/Webline'; -import Skeleton from 'react-loading-skeleton'; - -export const SkeletonPageCustomerAccount: FC = () => ( - - - - -
- - - - - -
-
-); diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerChangePassword.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerChangePassword.tsx index f53f5048be..e91fb323b3 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerChangePassword.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerChangePassword.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerChangePassword: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintDetail.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintDetail.tsx index 5683c1a98a..a109aea3e6 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintDetail.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintDetail.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerComplaintDetail: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintList.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintList.tsx index 4f713c16cb..fc76b5f47c 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintList.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintList.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerComplaintList: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintNew.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintNew.tsx index 75581a32f0..7a0ffe2649 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintNew.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerComplaintNew.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerComplaintNew: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerEditProfile.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerEditProfile.tsx index 348ae7e156..111ef56a2b 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerEditProfile.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerEditProfile.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerEditProfile: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderDetail.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderDetail.tsx index 4c7b025145..c3cb98ff4f 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderDetail.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderDetail.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerOrderDetail: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderList.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderList.tsx index 026cb0331e..5bcd2caeff 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderList.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerOrderList.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerOrderList: FC = () => ( - + diff --git a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerUsers.tsx b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerUsers.tsx index df6c216957..99ae25001d 100644 --- a/storefront/components/Blocks/Skeleton/SkeletonPageCustomerUsers.tsx +++ b/storefront/components/Blocks/Skeleton/SkeletonPageCustomerUsers.tsx @@ -4,7 +4,7 @@ import { Webline } from 'components/Layout/Webline/Webline'; export const SkeletonPageCustomerUsers: FC = () => ( - + diff --git a/storefront/components/Blocks/UserNavigation/UserNavigation.tsx b/storefront/components/Blocks/UserNavigation/UserNavigation.tsx index daa8768633..2f055ee1f6 100644 --- a/storefront/components/Blocks/UserNavigation/UserNavigation.tsx +++ b/storefront/components/Blocks/UserNavigation/UserNavigation.tsx @@ -2,6 +2,7 @@ import { ExtendedNextLink } from 'components/Basic/ExtendedNextLink/ExtendedNext import { ArrowIcon } from 'components/Basic/Icon/ArrowIcon'; import { ExitIcon } from 'components/Basic/Icon/ExitIcon'; import { Button } from 'components/Forms/Button/Button'; +import { TIDs } from 'cypress/tids'; import { m } from 'framer-motion'; import useTranslation from 'next-translate/useTranslation'; import { useRouter } from 'next/router'; @@ -13,7 +14,7 @@ import { useUserMenuItems } from 'utils/user/useUserMenuItems'; const getMenuItemTwClass = (menuItemLink?: string, asPath?: string) => twJoin( - 'border-b border-borderAccent last:border-none no-underline px-4 py-3 flex justify-between gap-4 text-sm', + 'border-b border-borderAccent last:border-none no-underline px-4 py-3 flex gap-4 text-sm', menuItemLink && asPath?.includes(menuItemLink) ? 'bg-backgroundAccentLess text-textAccent hover:text-textAccent' : 'bg-backgroundMore text-text hover:text-textAccent', @@ -30,7 +31,7 @@ export const UserNavigation: FC = () => {