Merge pull request #625 from us3r-network/F-reconstructProfile-bufan

fix mobile header style
us3r-network · Mar 15, 2024 · be9e3fd · be9e3fd
2 parents 46642f8 + 59ba7c3
commit be9e3fd
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 31 deletions.
diff --git a/apps/u3/src/container/fav/FavMobileHeader.tsx b/apps/u3/src/container/fav/FavMobileHeader.tsx
@@ -8,12 +8,16 @@
 import { ComponentPropsWithRef } from 'react';
 import { MobileHeaderWrapper } from '@/components/layout/mobile/MobileHeaderCommon';
 import LoginButtonV2Mobile from '@/components/layout/LoginButtonV2Mobile';
+import SearchIconBtn from '@/components/layout/SearchIconBtn';
 
 export default function FavMobileHeader(props: ComponentPropsWithRef<'div'>) {
   return (
     <MobileHeaderWrapper {...props}>
       <div className="text-[#FFF] text-[16px] font-medium">My Favorites</div>
-      <LoginButtonV2Mobile />
+      <div className="flex items-center gap-[20px]">
+        <SearchIconBtn />
+        <LoginButtonV2Mobile />
+      </div>
     </MobileHeaderWrapper>
   );
 }
diff --git a/apps/u3/src/container/notification/NotificationMobileHeader.tsx b/apps/u3/src/container/notification/NotificationMobileHeader.tsx
@@ -8,12 +8,16 @@
 import { ComponentPropsWithRef } from 'react';
 import { MobileHeaderWrapper } from '@/components/layout/mobile/MobileHeaderCommon';
 import LoginButtonV2Mobile from '@/components/layout/LoginButtonV2Mobile';
+import SearchIconBtn from '@/components/layout/SearchIconBtn';
 
 export default function FavMobileHeader(props: ComponentPropsWithRef<'div'>) {
   return (
     <MobileHeaderWrapper {...props}>
       <div className="text-[#FFF] text-[16px] font-medium">Notifications</div>
-      <LoginButtonV2Mobile />
+      <div className="flex items-center gap-[20px]">
+        <SearchIconBtn />
+        <LoginButtonV2Mobile />
+      </div>
     </MobileHeaderWrapper>
   );
 }
diff --git a/apps/u3/src/container/profile/ProfileLayout.tsx b/apps/u3/src/container/profile/ProfileLayout.tsx
@@ -85,7 +85,7 @@ export default function ProfileLayout() {
       {/* Desktop */}
       <div className="w-full h-full flex max-sm:hidden">
         <div className="bg-[#1B1E23] w-[280px] h-full">
-          <ProfileMenu isSelf={isSelf} />
+          <ProfileMenu />
         </div>
         <div className="flex-1 h-full overflow-auto" id="profile-warper">
           <Outlet

diff --git a/apps/u3/src/container/profile/ProfileMenu.tsx b/apps/u3/src/container/profile/ProfileMenu.tsx
@@ -3,15 +3,10 @@ import { useLocation, useParams } from 'react-router-dom';
 import { cn } from '@/lib/utils';
 import NavLinkItem from '@/components/layout/NavLinkItem';
 
-interface ProfileMenuProps extends ComponentPropsWithRef<'div'> {
-  isSelf: boolean;
-}
-
 export default function ProfileMenu({
-  isSelf,
   className,
   ...props
-}: ProfileMenuProps) {
+}: ComponentPropsWithRef<'div'>) {
   const { user } = useParams();
   const { pathname } = useLocation();
   const pathSuffix = user ? `/${user}` : '';
@@ -47,14 +42,6 @@ export default function ProfileMenu({
           >
             Activity
           </NavLinkItem>
-          {isSelf && (
-            <NavLinkItem
-              href={`/u/fav${pathSuffix}`}
-              active={pathname === `/u/fav${pathSuffix}`}
-            >
-              Favorites
-            </NavLinkItem>
-          )}
           {/* <NavLinkItem
             href={`/u/asset${pathSuffix}`}
             active={pathname === `/u/asset${pathSuffix}`}

diff --git a/apps/u3/src/container/profile/ProfileMobileHeader.tsx b/apps/u3/src/container/profile/ProfileMobileHeader.tsx
@@ -6,30 +6,23 @@
  * @Description: file description
  */
 import { ComponentPropsWithRef } from 'react';
-import { useLocation, useParams } from 'react-router-dom';
 import {
   MobileHeaderBackBtn,
   MobileHeaderWrapper,
 } from '@/components/layout/mobile/MobileHeaderCommon';
+import LoginButtonV2Mobile from '@/components/layout/LoginButtonV2Mobile';
+import SearchIconBtn from '@/components/layout/SearchIconBtn';
 
 export default function ProfileMobileHeader(
   props: ComponentPropsWithRef<'div'>
 ) {
-  const { pathname } = useLocation();
-  const { user } = useParams();
-  // const isPostsPath = pathname === '/u';
-  // const isContactsPath = pathname === '/u/contacts';
-  // const isActivityPath = pathname === '/u/activity';
-  const isFavPath = pathname === '/u/fav';
-
   return (
     <MobileHeaderWrapper {...props}>
-      {(() => {
-        if (isFavPath) {
-          return <MobileHeaderBackBtn title="My Favorites" />;
-        }
-        return <MobileHeaderBackBtn title={user || 'My Profile'} />;
-      })()}
+      <MobileHeaderBackBtn title="My Profile" />;
+      <div className="flex items-center gap-[20px]">
+        <SearchIconBtn />
+        <LoginButtonV2Mobile />
+      </div>
     </MobileHeaderWrapper>
   );
 }