technical/layout into [email protected] 🐢 minor global changes (not found page, page metadata, titles)

app/(landing)/[city]/layout.tsx

@@ -1,4 +1,5 @@
-import type { CITIES } from '@/utils/constants';
+import { NotFoundComponent } from '@/components/common';
+import { CITIES, ROUTES } from '@/utils/constants';
 
 import { Footer } from '../(components)/Footer/Footer';
 import { Header } from '../(components)/Header/Header';
@@ -10,12 +11,17 @@ interface LandingCityLayoutProps {
   };
 }
 
-const LandingCityLayout = ({ children, params }: LandingCityLayoutProps) => (
-  <>
-    <Header cityId={params.city} />
-    {children}
-    <Footer cityId={params.city} />
-  </>
-);
+const LandingCityLayout = ({ children, params }: LandingCityLayoutProps) => {
+  if (!Object.keys(CITIES).includes(params.city.toUpperCase()))
+    return <NotFoundComponent link={ROUTES.LANDING.ROOT} />;
+
+  return (
+    <>
+      <Header cityId={params.city} />
+      {children}
+      <Footer cityId={params.city} />
+    </>
+  );
+};
 
 export default LandingCityLayout;

app/app/(main)/activities/page.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import type { Metadata } from 'next';
 
 import { I18nText } from '@/components/common';
 import { Typography } from '@/components/ui';
@@ -12,6 +13,11 @@ interface ActivitiesPageProps {
   searchParams: SearchParams;
 }
 
+export const metadata: Metadata = {
+  title: 'Большой Квест | Каталог активностей',
+  description: 'Большой Квест | Каталог активностей'
+};
+
 const ActivitiesPage = async ({ searchParams }: ActivitiesPageProps) => {
   const [getCategoryResponse, getActivityResponse] = await Promise.all([
     getCategory({ config: { cache: 'no-store' } }),

app/layout.tsx

@@ -17,8 +17,8 @@ const fontSans = FontSans({
 });
 
 export const metadata: Metadata = {
-  title: 'Create Next App',
-  description: 'Generated by create next app'
+  title: 'Большой Квест',
+  description: 'Большой Квест'
 };
 
 const TOASTER_DURATION = 5000;

app/not-found.tsx

@@ -0,0 +1,26 @@
+import { NotFoundComponent } from '@/components/common';
+import { ROUTES } from '@/utils/constants';
+import { getUserSession } from '@/utils/helpers/server';
+
+import Layout from './org/(panel)/layout';
+
+const NotFound = () => {
+  const userSession = getUserSession();
+
+  return (
+    <>
+      {!userSession && (
+        <div className='h-screen w-screen'>
+          <NotFoundComponent link={ROUTES.LANDING.ROOT} />
+        </div>
+      )}
+      {userSession && (
+        <Layout>
+          <NotFoundComponent link={ROUTES.ORG.ORGANIZATIONS.DASHBOARD} />
+        </Layout>
+      )}
+    </>
+  );
+};
+
+export default NotFound;

app/org/(panel)/organizations/[organizationId]/(constants)/navigation.tsx

@@ -3,6 +3,14 @@ import { ActivityIcon, MapPinIcon, UserIcon, UsersRoundIcon } from 'lucide-react
 
 import { ROUTES } from '@/utils/constants';
 
+export const ORGANIZATION_PROFILE_TAB_TEXTS = {
+  PROFILE: 'Профиль',
+  ACTIVITIES: 'Активности',
+  ADDRESSES: 'Адреса',
+  EMPLOYEES: 'Сотрудники',
+  SCHEDULE: 'Расписание'
+};
+
 export const ORGANIZATION_PROFILE_TAB_VALUES = {
   PROFILE: 'profile',
   ADDRESSES: 'addresses',

app/org/(panel)/organizations/[organizationId]/layout.tsx

@@ -1,15 +1,36 @@
+import type { Metadata, ResolvedMetadata } from 'next';
+
 import { getOrganizationById } from '@/utils/api/requests';
 import { ROUTES } from '@/utils/constants';
+import { getPathnameFromMetadataState } from '@/utils/helpers';
 
 import { OrgBreadcrumbs } from '../../(components)/OrgBreadcrumbs/OrgBreadcrumbs';
 
 import { OrganizationHeader } from './(components)/OrganizationHeader/OrganizationHeader';
+import { ORGANIZATION_PROFILE_TAB_TEXTS } from './(constants)/navigation';
 
 interface OrganizationPageLayoutProps {
   params: { organizationId: string };
   children: React.ReactNode;
 }
 
+export async function generateMetadata(
+  { params }: OrganizationPageLayoutProps,
+  parent: ResolvedMetadata
+): Promise<Metadata> {
+  const organization = await getOrganizationById({
+    params: { id: params.organizationId }
+  });
+
+  const pathname = getPathnameFromMetadataState(parent);
+  const pathnameParts = pathname.split('/');
+  const lastPart = pathnameParts[pathnameParts.length - 1];
+
+  return {
+    title: `ЛК Организатора | ${organization.name} | ${ORGANIZATION_PROFILE_TAB_TEXTS[lastPart.toUpperCase()]}`
+  };
+}
+
 const OrganizationPageLayout = async ({ params, children }: OrganizationPageLayoutProps) => {
   const organization = await getOrganizationById({
     params: { id: params.organizationId }

app/org/(panel)/organizations/dashboard/page.tsx

@@ -1,3 +1,4 @@
+import type { Metadata } from 'next';
 import { notFound } from 'next/navigation';
 
 import { getOrganization } from '@/utils/api';
@@ -7,6 +8,11 @@ import { OrgBreadcrumbs } from '../../(components)/OrgBreadcrumbs/OrgBreadcrumbs
 import { OrganizationsDashboard } from './(components)/OrganizationsDashboard/OrganizationsDashboard';
 import { OrganizationsTable } from './(components)/OrganizationsTable/OrganizationsTable';
 
+export const metadata: Metadata = {
+  title: 'ЛК Организатора | Организации',
+  description: 'ЛК Организатора | Организации'
+};
+
 export interface OrganizationsPageProps {
   searchParams: SearchParams;
 }

app/org/auth/page.tsx

@@ -1,3 +1,4 @@
+import type { Metadata } from 'next';
 import Image from 'next/image';
 
 import authImage from '@/assets/images/auth.webp';
@@ -7,6 +8,11 @@ import { ROUTES } from '@/utils/constants';
 
 import { LoginForm } from './(components)/LoginForm/LoginForm';
 
+export const metadata: Metadata = {
+  title: 'ЛК Организатора | Авторизация',
+  description: 'ЛК Организатора | Авторизация'
+};
+
 const OrgAuthPage = () => (
   <div className='flex min-h-screen flex-col items-center justify-between p-2'>
     <div className='flex flex-1 items-center justify-around gap-28 xlx:gap-12 xlx:p-5'>

src/components/common/NotFoundComponent/NotFoundComponent.tsx

@@ -0,0 +1,25 @@
+import Link from 'next/link';
+
+import { I18nText } from '@/components/common';
+import { buttonVariants, Typography } from '@/components/ui';
+import { cn } from '@/lib/utils';
+
+interface NotFoundComponentProps {
+  link: string;
+}
+
+export const NotFoundComponent = ({ link }: NotFoundComponentProps) => (
+  <div className='flex h-full w-full flex-col items-center justify-center gap-2 p-6'>
+    <Typography variant='h3'>
+      <I18nText path='page.notFound.title' />
+    </Typography>
+    <Link
+      href={{
+        pathname: link
+      }}
+      className={cn(buttonVariants({ size: 'lg', variant: 'primary' }), 'w-full max-w-96')}
+    >
+      <I18nText path='button.backToRoot' />
+    </Link>
+  </div>
+);

src/components/common/index.ts

@@ -1,5 +1,6 @@
 export * from './I18nText/I18nText';
 export * from './Logo/Logo';
+export * from './NotFoundComponent/NotFoundComponent';
 export * from './NotificationsDropdownMenu/NotificationsDropdownMenu';
 export * from './QRCode/QRCode';
 export * from './texts';

src/utils/helpers/getPathnameFromMetadataState.ts

@@ -0,0 +1,10 @@
+import type { ResolvedMetadata } from 'next';
+
+export const getPathnameFromMetadataState = (state: ResolvedMetadata) => {
+  const res = Object.getOwnPropertySymbols(state || {})
+    .map((p) => state[p])
+    // eslint-disable-next-line no-prototype-builtins
+    .find((state) => state?.hasOwnProperty?.('urlPathname'));
+
+  return res?.urlPathname.replace(/\?.+/, '');
+};

src/utils/helpers/index.ts

@@ -1,2 +1,3 @@
 export * from './getMessagesByLocale';
 export * from './getNavigationLinksByUserRoles';
+export * from './getPathnameFromMetadataState';

static/locales/ru.json

@@ -6,6 +6,8 @@
   "site.error": "Что-то пошло не так",
   "site.loading": "Пожалуйста подождите...",
 
+  "page.notFound.title": "404 Страница не найдена",
+
   "partners.addresses.title": "Адреса",
   "partners.activities.title": "Активности",
   "partners.employees.title": "Сотрудники",
@@ -81,6 +83,7 @@
   "button.haveNotUserId": "У меня нет User ID",
   "button.logout": "Выйти",
   "button.addQR": "Добавить новый QR",
+  "button.backToRoot": "Вернуться на главную",
 
   "organization.stage.request": "Заявка",
   "organization.stage.negotiation": "Сотрудничество",