feature/BQ-282 into [email protected] 🐢 activity card page

app/(landing)/(components)/Footer/Footer.tsx → app/(components)/Footer/Footer.tsx

@@ -32,7 +32,7 @@ export const Footer = ({ cityId }: FooterProps) => (
       </div>
       <div className='flex w-full flex-col'>
         <Typography tag='p' className='text-xl font-medium text-white'>
-          <I18nText path='landing.footer.navigation.title' />
+          <I18nText path='page.landing.footer.navigation.title' />
         </Typography>
         <nav className='mt-4'>
           <ul className='flex flex-col gap-3'>
@@ -41,47 +41,47 @@ export const Footer = ({ cityId }: FooterProps) => (
                 className='hover:underline'
                 href={{ pathname: ROUTES.LANDING.ROOT, hash: 'banner' }}
               >
-                <I18nText path='landing.navigation.banner' />
+                <I18nText path='page.landing.navigation.banner' />
               </Link>
             </li>
             <li>
               <Link
                 className='hover:underline'
                 href={{ pathname: ROUTES.LANDING.ROOT, hash: 'news' }}
               >
-                <I18nText path='landing.navigation.news' />
+                <I18nText path='page.landing.navigation.news' />
               </Link>
             </li>
             <li>
               <Link
                 className='hover:underline'
                 href={{ pathname: ROUTES.LANDING.ROOT, hash: 'activities' }}
               >
-                <I18nText path='landing.navigation.activities' />
+                <I18nText path='page.landing.navigation.activities' />
               </Link>
             </li>
             <li>
               <Link
                 className='hover:underline'
                 href={{ pathname: ROUTES.LANDING.ROOT, hash: 'feedback' }}
               >
-                <I18nText path='landing.navigation.feedback' />
+                <I18nText path='page.landing.navigation.feedback' />
               </Link>
             </li>
             <li>
               <Link
                 className='hover:underline'
                 href={{ pathname: ROUTES.LANDING.ROOT, hash: 'questions' }}
               >
-                <I18nText path='landing.navigation.questions' />
+                <I18nText path='page.landing.navigation.questions' />
               </Link>
             </li>
           </ul>
         </nav>
       </div>
       <div className='w-full 2lg:max-w-[337px]'>
         <Typography tag='p' className='text-xl font-medium text-white'>
-          <I18nText path='landing.footer.addresses' />
+          <I18nText path='page.landing.footer.addresses' />
         </Typography>
         <nav className='mt-4'>
           <ul className='flex flex-col gap-3 lg:text-start'>

app/(landing)/(components)/Footer/components/FooterCopyrightText/FooterCopyrightText.tsx → app/(components)/Footer/components/FooterCopyrightText/FooterCopyrightText.tsx

@@ -21,7 +21,7 @@ const PrivacyPolicyLink = (children: React.ReactNode) => (
 
 export const FooterCopyrightText = () => (
   <I18nText
-    path='landing.footer.copyright'
+    path='page.landing.footer.copyright'
     values={{ useTerms: UseTermsLink, privacyPolicy: PrivacyPolicyLink }}
   />
 );

app/(landing)/(components)/ActivitiesMapSection/ActivitiesMapSection.tsx

@@ -32,7 +32,7 @@ export const ActivitiesMapSection = async ({ cityId }: ActivitiesMapSectionProps
   return (
     <section className='container px-0 py-12'>
       <Typography tag='h2' variant='h1' className='text-center text-[21px] lg:text-4xl'>
-        <I18nText path='landing.activitiesMap.title' />
+        <I18nText path='page.landing.activitiesMap.title' />
       </Typography>
 
       <ActivitiesMap cityId={cityId} activities={getActivityResponse.rows} />

app/(landing)/(components)/ActivitiesSection/ActivitiesSection.tsx

@@ -46,9 +46,12 @@ export const ActivitiesSection = async ({ cityId }: ActivitiesSectionProps) => {
     <section id='activities' className='container py-12'>
       <div className='flex items-center justify-between'>
         <Typography tag='h2' variant='h1' className='text-[21px] lg:text-4xl'>
-          <I18nText path='landing.activities.title' />
+          <I18nText path='page.landing.activities.title' />
         </Typography>
-        <Link href={ROUTES.APP.ACTIVITIES} className={buttonVariants({ variant: 'link' })}>
+        <Link
+          href={ROUTES.LANDING.ACTIVITIES.ROOT(cityId)}
+          className={buttonVariants({ variant: 'link' })}
+        >
           <Typography tag='p' variant='body1' className='py-0 xxsx:text-base'>
             <I18nText path='button.watchAll' />
           </Typography>
@@ -71,14 +74,14 @@ export const ActivitiesSection = async ({ cityId }: ActivitiesSectionProps) => {
                 <ActivityCardContentItem>
                   <UserRoundIcon className='size-6 stroke-muted-foreground' />
                   <I18nText
-                    path='landing.activities.card.minimumAge'
+                    path='page.landing.activities.card.minimumAge'
                     values={{ age: activity.ageLimit[0] }}
                   />
                 </ActivityCardContentItem>
                 <ActivityCardContentItem>
                   <Clock4Icon className='size-6 stroke-muted-foreground' />
                   <I18nText
-                    path='landing.activities.card.duration'
+                    path='page.landing.activities.card.duration'
                     values={{ duration: activity.duration }}
                   />
                 </ActivityCardContentItem>

app/(landing)/(components)/BannerSection/BannerSection.tsx

@@ -23,11 +23,11 @@ export const BannerSection = () => (
       <div className='mt-4 flex w-full flex-col justify-center text-center lg:mb-20 lg:mt-8'>
         <div className='flex flex-col gap-2 lg:gap-6 lg:text-left'>
           <Typography tag='h1' variant='h1' className='text-2xl lg:text-[56px] lg:leading-[70px]'>
-            <I18nText path='landing.info.title' />
+            <I18nText path='page.landing.info.title' />
           </Typography>
 
           <Typography tag='p' variant='body1' className='text-wrap text-sm leading-5 lg:text-2xl'>
-            <I18nText path='landing.info.subtitle' />
+            <I18nText path='page.landing.info.subtitle' />
           </Typography>
         </div>
 

app/(landing)/(components)/FAQSection/FAQSection.tsx

@@ -28,7 +28,7 @@ export const FAQSection = ({ cityId }: FAQSectionProps) => {
     <section className='bg-muted py-12'>
       <div className='container w-full'>
         <Typography tag='h2' variant='h1' className='text-center text-[21px] lg:text-4xl'>
-          <I18nText path='landing.faq.title' />
+          <I18nText path='page.landing.faq.title' />
         </Typography>
 
         <Accordion

app/(landing)/(components)/FeedbackSection/FeedbackSection.tsx

@@ -16,7 +16,7 @@ export const FeedbackSection = () => (
     <Carousel className='container'>
       <div className='flex items-center justify-start lg:justify-center'>
         <Typography tag='h2' variant='h1' className='text-center text-[21px] lg:text-4xl'>
-          <I18nText path='landing.feedback.title' />
+          <I18nText path='page.landing.feedback.title' />
         </Typography>
         <div className='absolute right-2'>
           <CarouselPrevious

app/(landing)/(components)/Header/Header.tsx

@@ -1,5 +1,8 @@
+'use client';
+
 import { ChevronDownIcon } from 'lucide-react';
 import Link from 'next/link';
+import { usePathname } from 'next/navigation';
 
 import { I18nText, Logo } from '@/components/common';
 import {
@@ -16,100 +19,110 @@ interface HeaderProps {
   cityId: (typeof CITIES)[keyof typeof CITIES]['id'];
 }
 
-export const Header = ({ cityId }: HeaderProps) => (
-  <header className='container flex justify-between py-[52px] 2xlx:gap-8 2xlx:py-10 2xsx:py-6 xxsx:pb-2 2xl:gap-[80px]'>
-    <Logo href={ROUTES.LANDING.CITY(cityId)} className='fill-taiga' />
+export const Header = ({ cityId }: HeaderProps) => {
+  const pathname = usePathname();
+
+  const isActivitiesPage = pathname.split('/').includes('activities');
 
-    <nav className='hidden flex-grow items-center lg:flex'>
-      <ul className='flex items-center gap-12'>
-        <li>
+  const getCityHref = (city: string) =>
+    isActivitiesPage ? ROUTES.LANDING.ACTIVITIES.ROOT(city) : ROUTES.LANDING.CITY(city);
+
+  return (
+    <header className='container flex justify-between py-4 md:px-2 2xl:gap-[80px]'>
+      <Logo href={ROUTES.LANDING.CITY(cityId)} className='fill-taiga' />
+      {!isActivitiesPage && (
+        <nav className='hidden flex-grow items-center lg:flex'>
+          <ul className='flex items-center gap-12'>
+            <li>
+              <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'banner' }}>
+                <Typography
+                  variant='body2'
+                  className='text-muted-foreground hover:font-semibold hover:text-taiga'
+                >
+                  <I18nText path='page.landing.navigation.banner' />
+                </Typography>
+              </Link>
+            </li>
+            <li>
+              <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'news' }}>
+                <Typography
+                  variant='body2'
+                  className='text-muted-foreground hover:font-semibold hover:text-taiga'
+                >
+                  <I18nText path='page.landing.navigation.news' />
+                </Typography>
+              </Link>
+            </li>
+            <li>
+              <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'activities' }}>
+                <Typography
+                  variant='body2'
+                  className='text-muted-foreground hover:font-semibold hover:text-taiga'
+                >
+                  <I18nText path='page.landing.navigation.activities' />
+                </Typography>
+              </Link>
+            </li>
+            <li>
+              <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'feedback' }}>
+                <Typography
+                  variant='body2'
+                  className='text-muted-foreground hover:font-semibold hover:text-taiga'
+                >
+                  <I18nText path='page.landing.navigation.feedback' />
+                </Typography>
+              </Link>
+            </li>
+            <li>
+              <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'questions' }}>
+                <Typography
+                  variant='body2'
+                  className='text-muted-foreground hover:font-semibold hover:text-taiga'
+                >
+                  <I18nText path='page.landing.navigation.questions' />
+                </Typography>
+              </Link>
+            </li>
+          </ul>
+        </nav>
+      )}
+      <div className='flex items-center justify-between gap-4 md:justify-end'>
+        {isActivitiesPage && (
           <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'banner' }}>
             <Typography
               variant='body2'
               className='text-muted-foreground hover:font-semibold hover:text-taiga'
             >
-              <I18nText path='landing.navigation.banner' />
-            </Typography>
-          </Link>
-        </li>
-        <li>
-          <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'news' }}>
-            <Typography
-              variant='body2'
-              className='text-muted-foreground hover:font-semibold hover:text-taiga'
-            >
-              <I18nText path='landing.navigation.news' />
-            </Typography>
-          </Link>
-        </li>
-        <li>
-          <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'activities' }}>
-            <Typography
-              variant='body2'
-              className='text-muted-foreground hover:font-semibold hover:text-taiga'
-            >
-              <I18nText path='landing.navigation.activities' />
-            </Typography>
-          </Link>
-        </li>
-        <li>
-          <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'feedback' }}>
-            <Typography
-              variant='body2'
-              className='text-muted-foreground hover:font-semibold hover:text-taiga'
-            >
-              <I18nText path='landing.navigation.feedback' />
-            </Typography>
-          </Link>
-        </li>
-        <li>
-          <Link href={{ pathname: ROUTES.LANDING.ROOT, hash: 'questions' }}>
-            <Typography
-              variant='body2'
-              className='text-muted-foreground hover:font-semibold hover:text-taiga'
-            >
-              <I18nText path='landing.navigation.questions' />
+              <I18nText path='page.landing.navigation.banner' />
             </Typography>
           </Link>
-        </li>
-      </ul>
-    </nav>
-    <div className='flex items-center justify-between gap-12 md:justify-end'>
-      <DropdownMenu>
-        <DropdownMenuTrigger>
-          <div className='flex items-center gap-2'>
-            <Typography
-              variant='body2'
-              className='text-muted-foreground hover:font-semibold hover:text-taiga mdx:text-gray-two'
-            >
-              {CITIES[cityId.toUpperCase()].name}
-            </Typography>
-            <ChevronDownIcon className='h-4 w-4' />
-          </div>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent>
-          {Object.values(CITIES).map((city) => (
-            <Link
-              key={city.id}
-              href={city.id === 'novosibirsk' ? ROUTES.LANDING.ROOT : ROUTES.LANDING.CITY(city.id)}
-            >
-              <DropdownMenuItem key={city.id} className={cn({ 'text-taiga': city.id === cityId })}>
-                {city.name}
-              </DropdownMenuItem>
-            </Link>
-          ))}
-        </DropdownMenuContent>
-      </DropdownMenu>
-      <div className='hidden lg:block'>
-        <Link href={ROUTES.ORG.AUTH}>
-          <Typography
-            variant='body2'
-            className='text-muted-foreground hover:font-semibold hover:text-taiga'
-          >
-            <I18nText path='button.organizationsEntrance' />
-          </Typography>
-        </Link>
+        )}
+        <DropdownMenu>
+          <DropdownMenuTrigger>
+            <div className='flex items-center gap-2'>
+              <Typography
+                variant='body2'
+                className='text-muted-foreground hover:font-semibold hover:text-taiga mdx:text-gray-two'
+              >
+                {CITIES[cityId.toUpperCase()].name}
+              </Typography>
+              <ChevronDownIcon className='h-4 w-4' />
+            </div>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent>
+            {Object.values(CITIES).map((city) => (
+              <Link key={city.id} href={!cityId ? ROUTES.LANDING.ROOT : getCityHref(city.id)}>
+                <DropdownMenuItem
+                  key={city.id}
+                  className={cn({ 'text-taiga': city.id === cityId })}
+                >
+                  {city.name}
+                </DropdownMenuItem>
+              </Link>
+            ))}
+          </DropdownMenuContent>
+        </DropdownMenu>
       </div>
-    </div>
-  </header>
-);
+    </header>
+  );
+};

app/(landing)/(components)/LeaveRequestSection/LeaveRequestSection.tsx

@@ -11,15 +11,15 @@ export const LeaveRequestSection = () => (
       <div className='flex flex-col gap-2 text-start md:gap-3'>
         <div className='flex flex-col gap-2'>
           <Typography variant='h1' tag='h2' className='text-[21px] md:text-4xl'>
-            <I18nText path='landing.leaveRequest.title' />
+            <I18nText path='page.landing.leaveRequest.title' />
           </Typography>
           <Typography tag='h2' variant='h1' className='text-[21px] text-taiga md:text-4xl'>
-            <I18nText path='landing.leaveRequest.subtitle' />!
+            <I18nText path='page.landing.leaveRequest.subtitle' />!
           </Typography>
         </div>
 
         <Typography tag='p' variant='body1' className='text-md lg:text-xl'>
-          <I18nText path='landing.leaveRequest.description' />
+          <I18nText path='page.landing.leaveRequest.description' />
         </Typography>
         <RegisterOrganizationDialog
           trigger={

app/(landing)/(components)/SponsorsSection/SponsorsSection.tsx

@@ -13,15 +13,15 @@ export const SponsorsSection = () => (
       <div className='relative z-10 mx-2 w-full rounded-2xl bg-white px-6 py-12 md:rounded-3xl lg:py-[72px]'>
         <div className='flex flex-col items-center gap-8'>
           <Typography variant='h1' tag='h2' className='text-[21px] lg:text-4xl'>
-            <I18nText path='landing.sponsors.title' />
+            <I18nText path='page.landing.sponsors.title' />
           </Typography>
           <div className='flex max-w-[656px]'>
             <Typography variant='body1' tag='p' className='text-center text-base md:text-[21px]'>
-              <I18nText path='landing.sponsors.description' />{' '}
+              <I18nText path='page.landing.sponsors.description' />{' '}
               <RegisterOrganizationDialog
                 trigger={
                   <span className='text-center text-base font-medium lowercase underline md:text-[21px]'>
-                    <I18nText path='landing.leaveRequest.subtitle' />
+                    <I18nText path='page.landing.leaveRequest.subtitle' />
                   </span>
                 }
               />