feat: add account pages, add static export

.gitignore

@@ -14,7 +14,7 @@
 /out/
 
 # production
-/build
+/dist
 
 # ide
 /.idea

messages/de.json

@@ -21,6 +21,15 @@
             "settings": "Profile Settings",
             "messages": "Messages",
             "work-with-us": "Work With Us"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Messages"
         }
     },
     "Footer": {

messages/en.json

@@ -22,6 +22,15 @@
             "settings": "Profile Settings",
             "messages": "Messages",
             "work-with-us": "Work With Us"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Messages"
         }
     },
     "Footer": {

messages/es.json

@@ -21,6 +21,15 @@
             "settings": "Profile Settings",
             "messages": "Messages",
             "work-with-us": "Work With Us"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Messages"
         }
     },
     "Footer": {

messages/fr.json

@@ -21,6 +21,15 @@
             "settings": "Profile Settings",
             "messages": "Messages",
             "work-with-us": "Work With Us"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Messages"
         }
     },
     "Footer": {

messages/it.json

@@ -21,6 +21,15 @@
             "settings": "Profile Settings",
             "messages": "Messages",
             "work-with-us": "Work With Us"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Messages"
         }
     },
     "Footer": {

messages/ru.json

@@ -21,6 +21,15 @@
             "settings": "Настройки профиля",
             "messages": "Сообщения",
             "work-with-us": "Работать с нами"
+        },
+        "WorkWithUs": {
+            "title": "Become a BBuddy Expert",
+            "insert-info": "Insert your personal information to start your journey as a BBuddy Expert",
+            "start": "Get Started",
+            "base-text": "Your info can either be added or amended at anytime"
+        },
+        "Messages": {
+            "title": "Сообщения"
         }
     },
     "Footer": {

next.config.js

@@ -13,7 +13,10 @@ const nextConfig = {
 	},
 	sassOptions: {
 		includePaths: [path.join(__dirname, 'styles')],
-	}
+	},
+	output: 'export',
+	cleanDistDir: true,
+	distDir: 'dist'
 };
 
 module.exports = withNextIntl(nextConfig);

src/app/[locale]/(main)/layout.tsx

@@ -1,6 +1,5 @@
 import React, { ReactNode } from 'react';
 import { getTranslations } from 'next-intl/server';
-import { Header, Footer } from '../../../components/Page';
 
 export async function generateMetadata({
     params: { locale }
@@ -13,23 +12,18 @@ export async function generateMetadata({
     };
 }
 
-export default function MainLayout({ children, news, directions, experts, params: { locale } }: {
+export default function MainLayout({ children, news, directions, experts }: {
     children: ReactNode,
     news: ReactNode,
     directions: ReactNode,
-    experts: ReactNode,
+    experts: ReactNode
-    params: { locale: string }
 }) {
     return (
-        <div className="b-wrapper">
+        <>
-            <div className="b-content">
+            {children}
-                <Header locale={locale} />
+            {news}
-                {children}
+            {directions}
-                {news}
+            {experts}
-                {directions}
+        </>
-                {experts}
-            </div>
-            <Footer />
-        </div>
     );
 };

src/app/[locale]/[userId]/layout.tsx

@@ -1,15 +1,64 @@
-import React from 'react';
+import React, { ReactNode } from 'react';
+import { Metadata } from 'next';
+import { notFound } from 'next/navigation';
+import { useTranslations } from 'next-intl';
 import { AccountMenu } from '../../../components/Account';
 
-export default function Layout({ children }: { children: React.ReactNode }) {
+type AccountLayoutProps = {
+    children: ReactNode;
+    params: Record<string, string>;
+};
+
+export const metadata: Metadata = {
+    title: 'Bbuddy User Account'
+};
+
+export function generateStaticParams({
+    params: { locale },
+}: { params: { locale: string } }) {
+    const result: { locale: string, userId: string }[] = [];
+    const users = [{ userId: '1' }, { userId: '2' }];
+
+    users.forEach(({ userId }) => {
+        result.push({ locale, userId });
+    });
+
+    return result;
+}
+
+const ROUTES = ['sessions', 'notifications', 'support', 'information', 'settings', 'messages', 'work-with-us'];
+const COUNTS: Record<string, number> = {
+    sessions: 12,
+    notifications: 5,
+    messages: 113
+};
+
+
+export default function AccountLayout({ children, params }: AccountLayoutProps) {
+    if (!params?.userId || isNaN(Number(params?.userId))) notFound();
+
+    const t = useTranslations('Account');
+
+    const getMenuConfig = () => ROUTES.map((path) => ({
+        path,
+        title: t(`menu.${path}`),
+        count: COUNTS[path] || undefined
+    }));
 
     return (
-        <section>
+        <div className="page-account">
-            <aside>
+            <div className="b-inner">
-                <AccountMenu />
+                <div className="row">
-                <span>Log Out</span>
+                    <div className="col-xl-3 col-lg-4 d-none d-lg-block">
-            </aside>
+                        <AccountMenu userId={params.userId} menu={getMenuConfig()} />
-            <section>{children}</section>
+                    </div>
-        </section>
+                    <div className="col-xl-9 col-lg-8 ">
-    )
+                        <div className="page-account__inner">
-}
+                            {children}
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+};

src/app/[locale]/[userId]/messages/[textId]/page.tsx

@@ -0,0 +1,69 @@
+import React from 'react';
+import { useTranslations } from 'next-intl';
+import { Link } from '../../../../../navigation';
+
+export function generateStaticParams({
+    params: { locale, userId },
+}: { params: { locale: string, userId: string } }) {
+    const result: { locale: string, userId: string, textId: string }[] = [];
+    const chats = [{ textId: '1' }, { textId: '2' }, { textId: '3' }];
+
+    chats.forEach(({ textId }) => {
+        result.push({ locale, userId, textId });
+    });
+
+    return result;
+}
+
+export default function Message({ params }: { params: { userId: string, textId: string } }) {
+    const t = useTranslations('Account.Messages');
+
+    return (
+        <>
+            <ol className="breadcrumb">
+                <li className="breadcrumb-item">
+                    <Link href={`/${params.userId}/messages` as any}>
+                        {t('title')}
+                    </Link>
+                </li>
+                <li className="breadcrumb-item active" aria-current="page">{`Person ${params.textId}`}</li>
+            </ol>
+
+            <div className="b-message">
+                <div className="b-message__inner">
+                    <div className="b-message__list b-message__list--me">
+                        <div className="b-message__item ">
+                            <div className="b-message__avatar">
+                                <img src="/images/person.png" className="" alt="" />
+                            </div>
+                            <div className="b-message__text">
+                                🤩 It all for you!
+
+                                <span className="date">07.09.2022</span>
+                            </div>
+                        </div>
+                    </div>
+                    <div className="b-message__list">
+                        <div className="b-message__item">
+                            <div className="b-message__avatar">
+                                <img src="/images/person.png" className="" alt="" />
+                            </div>
+                            <div className="b-message__text">
+                                🤩 It all for you!
+                                <span className="date">07.09.2022</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <form className="b-message__form" action="">
+                    <textarea placeholder="Type your message here" name="" id="" />
+                    <label className="b-message__upload-file">
+                        <input type="file" required />
+                    </label>
+                    <div className="b-message__microphone" />
+                    <button className="b-message__btn" type="submit" />
+                </form>
+            </div>
+        </>
+    );
+};

src/app/[locale]/[userId]/messages/page.tsx

@@ -0,0 +1,83 @@
+import React from 'react';
+import type { Metadata } from 'next';
+import { useTranslations } from 'next-intl';
+import { Link } from '../../../../navigation';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Messages',
+    description: 'Bbuddy desc messages'
+};
+
+export default function Messages({ params }: { params: { userId: string } }) {
+    const t = useTranslations('Account.Messages');
+
+    return (
+        <>
+            <ol className="breadcrumb">
+                <li className="breadcrumb-item active" aria-current="page">{t('title')}</li>
+            </ol>
+            <div className="messages-session">
+                <Link
+                    className="card-profile"
+                    href={`/${params.userId}/messages/1` as any}
+                >
+                    <div className="card-profile__header">
+                        <div className="card-profile__header__portrait">
+                            <img src="/images/person.png" className="" alt="" />
+                        </div>
+                        <div className="card-profile__header__inner">
+                            <div className="card-profile__header__name">
+                                David
+                                <span className="count">14</span>
+                            </div>
+                            <div className="card-profile__header__title">
+                                Lorem ipsum dolor sit at, consecte...
+                            </div>
+                            <div className="card-profile__header__date ">
+                                25 may
+                            </div>
+                        </div>
+                    </div>
+                </Link>
+                <Link
+                    className="card-profile"
+                    href={`/${params.userId}/messages/2` as any}
+                >
+                    <div className="card-profile__header">
+                        <div className="card-profile__header__portrait">
+                            <img src="/images/person.png" className="" alt="" />
+                        </div>
+                        <div className="card-profile__header__inner">
+                            <div className="card-profile__header__name">David</div>
+                            <div className="card-profile__header__title">
+                                Lorem ipsum dolor sit at, consecte...
+                            </div>
+                            <div className="card-profile__header__date ">
+                                25 may
+                            </div>
+                        </div>
+                    </div>
+                </Link>
+                <Link
+                    className="card-profile"
+                    href={`/${params.userId}/messages/3` as any}
+                >
+                    <div className="card-profile__header">
+                        <div className="card-profile__header__portrait">
+                            <img src="/images/person.png" className="" alt="" />
+                        </div>
+                        <div className="card-profile__header__inner">
+                            <div className="card-profile__header__name">David</div>
+                            <div className="card-profile__header__title">
+                                Lorem ipsum dolor sit at, consecte...
+                            </div>
+                            <div className="card-profile__header__date ">
+                                25 may
+                            </div>
+                        </div>
+                    </div>
+                </Link>
+            </div>
+        </>
+    );
+};

src/app/[locale]/[userId]/notifications/page.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Information',
+    description: 'Bbuddy desc information'
+};
+
+export default function Information() {
+    return (
+        <div>
+            Страница Информации о пользователе
+        </div>
+    );
+}

src/app/[locale]/[userId]/page.tsx

@@ -0,0 +1,5 @@
+import { redirect } from 'next/navigation';
+
+export default function AccountMainPage({ params }: { params: { userId: string } }) {
+    redirect(`/${params.userId}/sessions`);
+};

src/app/[locale]/[userId]/sessions/page.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Information',
+    description: 'Bbuddy desc information'
+};
+
+export default function Sessions() {
+    return (
+        <div>
+            Страница Информации о пользователе
+        </div>
+    );
+}

src/app/[locale]/[userId]/settings/page.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Information',
+    description: 'Bbuddy desc information'
+};
+
+export default function Information() {
+    return (
+        <div>
+            Страница Информации о пользователе
+        </div>
+    );
+}

src/app/[locale]/[userId]/support/page.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import type { Metadata } from 'next';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Information',
+    description: 'Bbuddy desc information'
+};
+
+export default function Information() {
+    return (
+        <div>
+            Страница Информации о пользователе
+        </div>
+    );
+}

src/app/[locale]/[userId]/work-with-us/page.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+import type { Metadata } from 'next';
+import { useTranslations } from "next-intl";
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - Account - Work with us',
+    description: 'Bbuddy desc work with us'
+};
+
+export default function WorkWithUs() {
+    const t = useTranslations('Account.WorkWithUs');
+
+    return (
+        <>
+            <ol className="breadcrumb">
+                <li className="breadcrumb-item active" aria-current="page">{t('title')}</li>
+            </ol>
+
+            <div className="b-info">
+                <div className="image-info">
+                    <img className="" src="/images/info.png" alt="" />
+                </div>
+                <div className="b-info__title">{t('insert-info')}</div>
+                <button className="btn-apply">{t('start')}</button>
+                <div className="base-text">{t('base-text')}</div>
+            </div>
+        </>
+    );
+}

src/app/[locale]/experts/[expertId]/page.tsx

@@ -1,13 +1,196 @@
 import React from 'react';
 import type { Metadata } from 'next';
+import { notFound } from 'next/navigation';
+import { Link } from '../../../../navigation';
 
 export const metadata: Metadata = {
     title: 'Bbuddy - Experts item',
     description: 'Bbuddy desc experts'
 };
 
-export default function Expert({ params }: { params: { expertId: string | number } }) {
+export function generateStaticParams() {
-    return (
+    return [{ expertId: '1' }, { expertId: '2' }];
-        <div>Current expert: {params.expertId}</div>
-    );
 }
+
+export default function ExpertItem({ params }: { params: { expertId: string } }) {
+    if (!params?.expertId) notFound();
+
+    return (
+        <div className="b-page">
+            <div className="b-inner">
+                <div className="b-page__back">
+                    <Link href={'/experts' as any} className="btn-back">
+                        <img src="/images/arrow-back.svg" className="" alt="" />
+                        Back to experts list
+                    </Link>
+                </div>
+                <div className="expert-card">
+                    <div className="expert-card__wrap">
+                        <div className="expert-card__avatar">
+                            <img src="/images/person.png" className="" alt="" />
+                        </div>
+                        <div className="expert-card__inner">
+                            <h1 className="expert-card__title">{`Matthew Weeks | id ${params.expertId}`}</h1>
+                            <div className="expert-card__info">
+                                <span>12 Practice hours</span>
+                                <i>|</i>
+                                <span>15 Supervision per year</span>
+                            </div>
+                            <div className="expert-card__rating">
+                                <img src="/images/stars.svg" className="" alt="" />
+                                    <span>4/5 (out of 345)</span>
+                            </div>
+                        </div>
+                    </div>
+                    <div className="expert-card__wrap-btn">
+                        <a href="#" className="btn-apply">
+                            <img src="/images/calendar-outline.svg" className="" alt="" />
+                                Schedule
+                        </a>
+                        <a href="#" className="btn-video">
+                            <img src="/images/videocam-outline.svg" className="" alt="" />
+                                Video
+                        </a>
+                    </div>
+                </div>
+                <h2 className="title-h2">Current Offer</h2>
+                <div className="skills__list">
+                    <div className="skills__list__item">Engineering &amp; Data</div>
+                    <div className="skills__list__item">Communication</div>
+                    <div className="skills__list__item">Communication</div>
+                </div>
+                <p className="base-text">
+                    Hello, my name is Marcelo. I am a Senior UX Designer with more than 6 years of experience working
+                    with the largest companies in the world such as Disney, Globant and currently IBM.
+                    During my career, I have helped organizations solve complex problems using aesthetically pleasing
+                    designs with design while building teams and mentoring other designers.
+                    I can help you: <br />
+                    Prepare for interviews, prepare your resume or CV and work on your LinkedIn profile <br />
+                    Get ready for whiteboard challenges and take-home exercises <br />
+                    Create a great portfolio and case study presentation. <br />
+                    Provide industry information. <br />
+                    Professional orientation <br />
+                    Strategic thinking <br /><br />
+
+                    Oh, and I also speak Spanish!
+                </p>
+                <div className="wrap-btn-prise">
+                    <a href="#" className="btn-apply">
+                        Sign Up Now
+                    </a>
+                    <div className="wrap-btn-prise__text">
+                        45$ <span> / 45min</span>
+                    </div>
+                </div>
+                <h2 className="title-h2">Expert Background</h2>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">Education</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <div className="sertific">
+                    <img src="/images/sertific.png" className="" alt="" />
+                </div>
+                <h3 className="title-h3">Professional Certification</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">Trainings | Seminars | Courses</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">MBA Information</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">Managerial Experience</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">Entrepreneurial Experience</h3>
+                <p className="base-text">
+                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                    malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                </p>
+                <h3 className="title-h3">Successful Cases From Practice</h3>
+                <div className="case-list">
+                    <div className="skills__list">
+                        <div className="skills__list__item">Engineering &amp; Data</div>
+                        <div className="skills__list__item">Communication</div>
+                        <div className="skills__list__item">Communication</div>
+                    </div>
+                    <p className="base-text">
+                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                        malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                    </p>
+                </div>
+                <div className="case-list">
+                    <div className="skills__list">
+                        <div className="skills__list__item">Engineering &amp; Data</div>
+                        <div className="skills__list__item">Communication</div>
+                        <div className="skills__list__item">Communication</div>
+                    </div>
+                    <p className="base-text">
+                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam aliquet, lectus nec viverra
+                        malesuada, ligula sem tempor risus, non posuere urna diam a libero.
+                    </p>
+                </div>
+                <h2 className="title-h2">All Offers by this Expert</h2>
+                <div className="offers-list">
+                    <div className="card-profile">
+                        <div className="card-profile__skills">
+                            <div className="skills__list">
+                                <div className="skills__list__item">Engineering & Data</div>
+                                <div className="skills__list__item">Engineering & Data</div>
+                                <div className="skills__list__more">+6</div>
+                            </div>
+                        </div>
+                        <div className="card-profile__title">Senior Software Engineer</div>
+                        <div className="card-profile__subtitle">Auth0</div>
+                        <div className="card-profile__desc">
+                            I have worked across a variety of organizations, lead teams, and delivered quality software
+                            for 8 years. In that time I've worked as an independent consultant, at agencies as a team
+                            lead, and as a senior engineer at Auth0. I also host a podcast
+                            https://anchor.fm/work-in-programming where I break down how …
+                        </div>
+                        <div className="card-profile__footer">
+                            <a href="#">Details
+                                <img className="" src="/images/chevron-forward.svg" alt="" />
+                            </a>
+                        </div>
+                    </div>
+                    <div className="card-profile">
+                        <div className="card-profile__skills">
+                            <div className="skills__list">
+                                <div className="skills__list__item">Engineering & Data</div>
+                                <div className="skills__list__item">Engineering & Data</div>
+                                <div className="skills__list__more">+6</div>
+                            </div>
+                        </div>
+                        <div className="card-profile__title">Senior Software Engineer</div>
+                        <div className="card-profile__subtitle">Auth0</div>
+                        <div className="card-profile__desc">
+                            I have worked across a variety of organizations, lead teams, and delivered quality software
+                            for 8 years. In that time I've worked as an independent consultant, at agencies as a team
+                            lead, and as a senior engineer at Auth0. I also host a podcast
+                            https://anchor.fm/work-in-programming where I break down how …
+                        </div>
+                        <div className="card-profile__footer">
+                            <a href="#">Details
+                                <img className="" src="/images/chevron-forward.svg" alt="" />
+                            </a>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    );
+};

src/app/[locale]/experts/page.tsx

@@ -1,15 +1,182 @@
 import React from 'react';
 import type { Metadata } from 'next';
+import { ExpertsFilter, ExpertsAdditionalFilter } from '../../../components/Experts';
 
 export const metadata: Metadata = {
     title: 'Bbuddy - Experts',
     description: 'Bbuddy desc experts'
 };
 
-export default function Experts() {
+export default function Experts({ searchParams }: { searchParams: { [key: string]: string | string[] | undefined } }) {
+    console.log('search params', searchParams);
+
     return (
-        <div>
+        <div className="page-search">
-            Страница экспертов
+            <div className="main-find">
+                <div className="b-inner">
+                    <div className="main-find__top">
+                        <h2 className="title-h2">Find a expert</h2>
+                        <div className="open-filter">
+                            <img src="/images/options-outline.svg" className="" alt="" />
+                        </div>
+                    </div>
+                    <div className="row">
+                        <div className="col-xl-3 col-lg-4 d-none d-lg-block">
+                            <ExpertsFilter />
+                        </div>
+                        <div className="col-xl-9 col-lg-8 ">
+                            <ExpertsAdditionalFilter />
+                            <div className="search-result">
+                                <div className="card-profile">
+                                    <div className="card-profile__header">
+                                        <div className="card-profile__header__portrait">
+                                            <img src="/images/person.png" className="" alt="" />
+                                        </div>
+                                        <div className="card-profile__header__inner">
+                                            <div className="card-profile__header__name">Matthew Weeks</div>
+                                            <div className="card-profile__header__price">
+                                                45$ <span>/ 45min</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__skills">
+                                        <div className="skills__list">
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__more">+6</div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__title">Senior Software Engineer</div>
+                                    <div className="card-profile__subtitle">Auth0</div>
+                                    <div className="card-profile__desc">
+                                        I have worked across a variety of organizations, lead teams, and delivered
+                                        quality software for 8 years. In that time I've worked as an independent
+                                        consultant, at agencies as a team lead, and as a senior engineer at Auth0. I
+                                        also host a podcast https://anchor.fm/work-in-programming where I break down how
+                                        …
+                                    </div>
+                                    <div className="card-profile__footer">
+                                        <a href="#">Details
+                                            <img className="" src="/images/chevron-forward.svg" alt="" />
+                                        </a>
+                                    </div>
+                                </div>
+                                <div className="card-profile">
+                                    <div className="card-profile__header">
+                                        <div className="card-profile__header__portrait">
+                                            <img src="/images/person.png" className="" alt="" />
+                                        </div>
+                                        <div className="card-profile__header__inner">
+                                            <div className="card-profile__header__name">Matthew Weeks</div>
+                                            <div className="card-profile__header__price">
+                                                45$ <span>/ 45min</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__skills">
+                                        <div className="skills__list">
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__more">+6</div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__title">Senior Software Engineer</div>
+                                    <div className="card-profile__subtitle">Auth0</div>
+                                    <div className="card-profile__desc">
+                                        I have worked across a variety of organizations, lead teams, and delivered
+                                        quality software for 8 years. In that time I've worked as an independent
+                                        consultant, at agencies as a team lead, and as a senior engineer at Auth0. I
+                                        also host a podcast https://anchor.fm/work-in-programming where I break down how
+                                        …
+                                    </div>
+                                    <div className="card-profile__footer">
+                                        <a href="#">Details
+                                            <img className="" src="/images/chevron-forward.svg" alt="" />
+                                        </a>
+                                    </div>
+                                </div>
+                                <div className="card-profile">
+                                    <div className="card-profile__header">
+                                        <div className="card-profile__header__portrait">
+                                            <img src="/images/person.png" className="" alt="" />
+                                        </div>
+                                        <div className="card-profile__header__inner">
+                                            <div className="card-profile__header__name">Matthew Weeks</div>
+                                            <div className="card-profile__header__price">
+                                                45$ <span>/ 45min</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__skills">
+                                        <div className="skills__list">
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__more">+6</div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__title">Senior Software Engineer</div>
+                                    <div className="card-profile__subtitle">Auth0</div>
+                                    <div className="card-profile__desc">
+                                        I have worked across a variety of organizations, lead teams, and delivered
+                                        quality software for 8 years. In that time I've worked as an independent
+                                        consultant, at agencies as a team lead, and as a senior engineer at Auth0. I
+                                        also host a podcast https://anchor.fm/work-in-programming where I break down how
+                                        …
+                                    </div>
+                                    <div className="card-profile__footer">
+                                        <a href="#">Details
+                                            <img className="" src="/images/chevron-forward.svg" alt="" />
+                                        </a>
+                                    </div>
+                                </div>
+                                <div className="card-profile">
+                                    <div className="card-profile__header">
+                                        <div className="card-profile__header__portrait">
+                                            <img src="/images/person.png" className="" alt="" />
+                                        </div>
+                                        <div className="card-profile__header__inner">
+                                            <div className="card-profile__header__name">Matthew Weeks</div>
+                                            <div className="card-profile__header__price">
+                                                45$ <span>/ 45min</span>
+                                            </div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__skills">
+                                        <div className="skills__list">
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__item">Engineering & Data</div>
+                                            <div className="skills__list__more">+6</div>
+                                        </div>
+                                    </div>
+                                    <div className="card-profile__title">Senior Software Engineer</div>
+                                    <div className="card-profile__subtitle">Auth0</div>
+                                    <div className="card-profile__desc">
+                                        I have worked across a variety of organizations, lead teams, and delivered
+                                        quality software for 8 years. In that time I've worked as an independent
+                                        consultant, at agencies as a team lead, and as a senior engineer at Auth0. I
+                                        also host a podcast https://anchor.fm/work-in-programming where I break down how
+                                        …
+                                    </div>
+                                    <div className="card-profile__footer">
+                                        <a href="#">Details
+                                            <img className="" src="/images/chevron-forward.svg" alt="" />
+                                        </a>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <ul className="pagination">
+                                <li className="page-item"><a className="page-link" href="#">1</a></li>
+                                <li className="page-item active" aria-current="page">
+                                    <a className="page-link" href="#">2</a>
+                                </li>
+                                <li className="page-item"><a className="page-link" href="#">3</a></li>
+                                <li className="page-item"><a className="page-link" href="#">4</a></li>
+                            </ul>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
     );
-}
+};

src/app/[locale]/layout.tsx

@@ -7,6 +7,7 @@ import theme from '../../constants/theme';
 import { ALLOWED_LOCALES } from '../../constants/locale';
 import StyledComponentsRegistry from '../../lib/AntdRegistry';
 import StyledRegistry from '../../lib/StyleRegistry';
+import { Header, Footer } from '../../components/Page';
 
 type LayoutProps = {
     children: ReactNode;
@@ -30,7 +31,13 @@ export default function LocaleLayout({ children, params: { locale } }: LayoutPro
         <StyledRegistry>
             <StyledComponentsRegistry>
                 <ConfigProvider theme={theme}>
-                    {children}
+                    <div className="b-wrapper">
+                        <div className="b-content">
+                            <Header locale={locale} />
+                            {children}
+                        </div>
+                        <Footer />
+                    </div>
                 </ConfigProvider>
             </StyledComponentsRegistry>
         </StyledRegistry>

src/app/[locale]/news/[newsId]/page.tsx

@@ -0,0 +1,150 @@
+import React from 'react';
+import type { Metadata } from 'next';
+import { notFound } from 'next/navigation';
+
+export const metadata: Metadata = {
+    title: 'Bbuddy - News item',
+    description: 'Bbuddy desc news item'
+};
+
+export function generateStaticParams() {
+    return [{ newsId: 'news-1' }, { newsId: 'news-2' }];
+}
+
+export default function NewsItem({ params }: { params: { newsId: string } }) {
+    if (!params?.newsId) notFound();
+
+    return (
+        <div className="b-news-page">
+            <div className="b-inner">
+                <h1 className="b-news-page__title">6 learnings from Shivpuri to Silicon Valley</h1>
+                <div className="news-item__badge">Leadership & Management</div>
+                <div className="b-news-page__text">
+                    {`news id ${params.newsId}`}<br />
+                    I’m excited to kick off this series of newsletters where I’ll be sharing my experiences, learnings,
+                    and best practices which helped me to grow both in my personal and professional life. My hope is to
+                    give back to the community and help anyone connect directly with me who may have got impacted with
+                    recent layoffs, dealing with immigration challenges.
+                </div>
+                <div className="b-news-page__image">
+                    <img className="" src="/images/news1.png" alt="" />
+                </div>
+                <div className="news-item__info">
+                    <div className="news-item__info__author">
+                        <img className="" src="/images/author.png" alt="" />
+                        <div className="news-item__info__author__inner">
+                            <div className="news-item__info__name">Sonali Garg</div>
+                            <div className="news-item__info__date">February 6th, 2023</div>
+                        </div>
+                    </div>
+                    <div className="news-item__info__counter">
+                        <div className="news-item__info__like">
+                            <img className="" src="/images/heart-outline.svg" alt="" />
+                            165
+                        </div>
+                        <div className="news-item__info__share">
+                            <img className="" src="/images/share-social.svg" alt="" />
+                            Share
+                        </div>
+                    </div>
+                </div>
+                <div className="b-news-page__inner">
+                    <h2 className="title-h2">
+                        This is not about layoffs, it's about living with whatever life throws at you..
+                    </h2>
+                    <p className="b-news-page__text">
+                        Over the past few months, as the macro-economic events have unfolded, I have heard voices filled
+                        with anxiety, helplessness and general lack of confidence to deal with this ambiguity from my
+                        mentees, colleagues, friends and family. I was laid off from Meta last November and I firmly
+                        believe this is nothing but a bump in the road that might seem like a steep climb in the
+                        short-term. I may not have all the answers but this has inspired me to share my story. If you
+                        are looking for a sob story, you can stop reading now. Ever wondered what it takes for a girl
+                        born into a conservative family in a small sleepy town in India, who lost one of her parents at
+                        age 17, earned her living while pursuing engineering, moved to the UK by herself and ended up
+                        working in big tech in Silicon valley? My goal with this series of posts is to inspire and share
+                        my mental models that helped me throughout my professional and personal life.
+                    </p>
+                    <p className="b-news-page__text">
+                        After completing my engineering, I started my career at a small software company in Bhopal and
+                        then worked for TCS(Tata Consultancy Services), one of the largest IT-outsourcing companies in
+                        the world for almost 5 years. Over the past 14 years, I have worked for big tech companies like
+                        Meta (Facebook) and Google, wore multiple hats, led strategic programs, scaled multi
+                        billion-dollar businesses, built teams and helped achieve business operational excellence.
+                        Throughout my career, I’ve dealt with several challenges from execution to scale to building a
+                        high performance team. A lot of my early struggles were about how to assimilate in a new
+                        culture, create a network in a new environment, earn trust, create and nurture work
+                        relationships into fruitful friendships and so on.
+                    </p>
+                    <p className="b-news-page__text">
+                        I was born in a conservative family in a small town called ‘Shivpuri’, also known as ‘Mini
+                        Kashmir’ because of its natural beauty. My father was a civil engineer working on Madikheda Dam
+                        on Sindh river and was a strict disciplinarian. He was gone from dawn to dusk and was always
+                        focused. My mother was a teacher in a school that was about 30 kms from our home. We (me and my
+                        sister) would often be left with neighbors to be taken care of and this led us to become
+                        independent at an early age. Our otherwise slow paced, simple life with only a few families
+                        around in the government quarters that were set up to support construction of the dam was filled
+                        with natural beauty, wildlife and a community of close friends. Our lives were balanced and
+                        while my parents worked hard to provide basic needs, we were satisfied. There were only a few
+                        schools with Hindi being the prevalent language as the medium of teaching. There were no
+                        colleges for advanced studies and most girls did not go to college often married off by their
+                        18th birthday. Generally speaking, we had a joyous childhood with just the basics. While most
+                        folks we interacted with were not highly educated nor ambitious, earned lower middle class
+                        salaries and lacked exposure to the outside world but there was plenty to learn from them.
+                        People had learnt to stick together in good and bad times. They embodied the old school
+                        qualities of hard work, dedication and commitment. Be willing to give it all- hard work,
+                        dedication and commitment.
+                    </p>
+                    <p className="b-news-page__text">
+                        In 2003, my father passed away suddenly and we found ourselves in crisis. My mother was a
+                        teacher and she did not have time to deal with her grief. Rather, she was struggling to garner
+                        support to get transferred to a school in Bhopal, capital of Madhya Pradesh to be closer to our
+                        maternal grandparents. As we uprooted ourselves from Shivpuri to Bhopal, one of my father’s
+                        loyal friends came to help load the moving truck. While he had nothing to gain out of us, he
+                        continued to serve us until the last day in Shivpuri. Remember, in crisis your team matters more
+                        than any other time. Advocate for them ruthlessly in good and bad times, they will come through
+                        in crisis.
+                    </p>
+                    <p className="b-news-page__text">
+                        Eventually we found our footing, my mother’s job was transferred to a local school in Bhopal and
+                        I got admission in a government engineering college. My sister was still attending high school
+                        and both of us were teaching tuition classes to middle school students in the evenings to make
+                        ends meet. I also started a tiffin service for a few out of town students while attending
+                        college to pay for my transportation and cost of supplies. We refused to give up. Persevere when
+                        all else fails.
+                    </p>
+                    <p className="b-news-page__text">
+                        Our 5 years went by quickly in Bhopal as we worked towards improving our financial situation and
+                        I completed my Bachelors in Computer Science. This was the time I first stepped out to live in a
+                        metropolitan city, Mumbai for my job at TCS. This was a paradigm shift from Bhopal and I was
+                        blown away to meet so many talented folks in Mumbai. In my head, I did not belong in this place.
+                        I had imposter syndrome and felt like an outsider trying to make it in a new city. Most people I
+                        met were fluent in more than 1 language, well-dressed, communicated openly and with confidence,
+                        and presented themselves well. I was always in a dilemma when it came to adopting values. It
+                        took me a while to adjust to it but I was still not confident about my work and communication
+                        while my hard skills that I learnt in engineering were top notch. I kept questioning my
+                        abilities but persisted. This was not the first time I was out of my comfort zone. Persist, when
+                        in discomfort.
+                    </p>
+                    <p className="b-news-page__text">
+                        I worked with multiple global companies who were clients of TCS and was presented an opportunity
+                        to move to Scotland, UK for an year to work for GE, who was also a client. This was my first
+                        opportunity to explore a different culture, food, music, languages etc. I remember working on my
+                        english when in Mumbai, in preparation for my UK trip. It was really difficult to understand the
+                        accent in the UK, even though language was not a barrier. I still remember certain words would
+                        just not get across no matter how hard some of my colleagues tried and they would end up using
+                        signs to convey. Be prepared, opportunities come to those who are prepared.
+                    </p>
+                    <p className="b-news-page__text">
+                        In 2013, I came to the US on a dependent visa after marriage and quickly realized the curse of
+                        H4 visa. I paved my path by going back to school at UC Berkeley and then jumped back into
+                        building my career from scratch. While working in the US over the past years, I realized college
+                        degrees with good grades and certifications definitely help you to get your foot in the door but
+                        are not enough to be successful in your career. As I was again starting from scratch in a new
+                        culture, determined to do whatever it takes, having done this a few times before, it doesn’t
+                        scare me as much. Never be afraid to start from zero again!
+                    </p>
+                </div>
+            </div>
+        </div>
+    );
+};

src/app/[locale]/news/page.tsx

@@ -8,8 +8,206 @@ export const metadata: Metadata = {
 
 export default function News() {
     return (
-        <div>
+        <div className="b-news">
-            Страница новостей
+            <div className="b-news__header">
+                <div className="b-inner">
+                    <h1 className="title-h1">
+                        Mentorship, Career <br />
+                        Development & Coaching.
+                    </h1>
+                    <div className="wrap-text">
+                        <p className="">The ins-and-outs of building a career in tech, gaining <br /> experience</p>
+                        <p className="">from a mentor, and getting your feet wet with coaching.</p>
+                    </div>
+                    <div className="b-news__header__img">
+                        <img className="" src="/images/news-top.png" alt="" />
+                    </div>
+                </div>
+            </div>
+            <div className="b-news__filter ">
+                <div className="b-inner">
+                    <div className="wrap-filter">
+                        <a href="#" className="filter-item">Leadership & Management</a>
+                        <a href="#" className="filter-item">Professional Development</a>
+                        <a href="#" className="filter-item">Research & Insights</a>
+                        <a href="#" className="filter-item">Well-Being</a>
+                        <a href="#" className="filter-item">Diversity & Inclusion</a>
+                        <a href="#" className="filter-item">Culture</a>
+                        <a href="#" className="filter-item">Sales</a>
+                        <a href="#" className="filter-item">Collaboration</a>
+                        <a href="#" className="filter-item">Hiring</a>
+                        <a href="#" className="filter-item active">BBuddy product</a>
+                        <a href="#" className="filter-item">Customer Stories</a>
+                        <a href="#" className="filter-item">Coaching</a>
+                    </div>
+                </div>
+            </div>
+            <div className="b-news__result-list">
+                <div className="b-inner">
+                    <div className="news-list">
+                        <a href="#" className="news-item">
+                            <div className="news-item__image">
+                                <img className="" src="/images/news.png" alt="" />
+                            </div>
+                            <div className="news-item__inner">
+                                <div className="">
+                                    <div className="news-item__title">
+                                        6 learnings from Shivpuri to Silicon Valley
+                                    </div>
+                                    <div className="news-item__badge">Leadership & Management</div>
+                                    <div className="news-item__text">
+                                        I’m excited to kick off this series of newsletters where I’ll be sharing my
+                                        experiences,
+                                        learnings, and best practices which helped me to grow both in my personal and
+                                        professional life. My hope is to give back to the community and help anyone
+                                        connect directly with me who may have got impacted with recent layoffs,
+                                        dealing with immigration challenges.
+                                    </div>
+                                </div>
+                                <div className="news-item__info">
+                                    <div className="news-item__info__author">
+                                        <img className="" src="/images/author.png" alt="" />
+                                        <div className="news-item__info__author__inner">
+                                            <div className="news-item__info__name">Sonali Garg</div>
+                                            <div className="news-item__info__date">February 6th, 2023</div>
+                                        </div>
+                                    </div>
+                                    <div className="news-item__info__counter">
+                                        <div className="news-item__info__like">
+                                            <img className="" src="/images/heart-outline.svg" alt="" />
+                                            165
+                                        </div>
+                                        <div className="news-item__info__share">
+                                            <img className="" src="/images/share-social.svg" alt="" />
+                                            Share
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </a>
+                        <a href="#" className="news-item">
+                            <div className="news-item__image">
+                                <img className="" src="/images/news.png" alt="" />
+                            </div>
+                            <div className="news-item__inner">
+                                <div className="">
+                                    <div className="news-item__title">
+                                        6 learnings from Shivpuri to Silicon Valley
+                                    </div>
+                                    <div className="news-item__badge">Leadership & Management</div>
+                                    <div className="news-item__text">
+                                        I’m excited to kick off this series of newsletters where I’ll be sharing my
+                                        experiences,
+                                        learnings, and best practices which helped me to grow both in my personal and
+                                        professional life. My hope is to give back to the community and help anyone
+                                        connect directly with me who may have got impacted with recent layoffs,
+                                        dealing with immigration challenges.
+                                    </div>
+                                </div>
+                                <div className="news-item__info">
+                                    <div className="news-item__info__author">
+                                        <img className="" src="/images/author.png" alt="" />
+                                        <div className="news-item__info__author__inner">
+                                            <div className="news-item__info__name">Sonali Garg</div>
+                                            <div className="news-item__info__date">February 6th, 2023</div>
+                                        </div>
+                                    </div>
+                                    <div className="news-item__info__counter">
+                                        <div className="news-item__info__like">
+                                            <img className="" src="/images/heart-outline.svg" alt="" />
+                                            165
+                                        </div>
+                                        <div className="news-item__info__share">
+                                            <img className="" src="/images/share-social.svg" alt="" />
+                                            Share
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </a>
+                        <a href="#" className="news-item">
+                            <div className="news-item__image">
+                                <img className="" src="/images/news.png" alt="" />
+                            </div>
+                            <div className="news-item__inner">
+                                <div className="">
+                                    <div className="news-item__title">
+                                        6 learnings from Shivpuri to Silicon Valley
+                                    </div>
+                                    <div className="news-item__badge">Leadership & Management</div>
+                                    <div className="news-item__text">
+                                        I’m excited to kick off this series of newsletters where I’ll be sharing my
+                                        experiences,
+                                        learnings, and best practices which helped me to grow both in my personal and
+                                        professional life. My hope is to give back to the community and help anyone
+                                        connect directly with me who may have got impacted with recent layoffs,
+                                        dealing with immigration challenges.
+                                    </div>
+                                </div>
+                                <div className="news-item__info">
+                                    <div className="news-item__info__author">
+                                        <img className="" src="/images/author.png" alt="" />
+                                        <div className="news-item__info__author__inner">
+                                            <div className="news-item__info__name">Sonali Garg</div>
+                                            <div className="news-item__info__date">February 6th, 2023</div>
+                                        </div>
+                                    </div>
+                                    <div className="news-item__info__counter">
+                                        <div className="news-item__info__like">
+                                            <img className="" src="/images/heart-outline.svg" alt="" />
+                                            165
+                                        </div>
+                                        <div className="news-item__info__share">
+                                            <img className="" src="/images/share-social.svg" alt="" />
+                                            Share
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </a>
+                        <a href="#" className="news-item">
+                            <div className="news-item__image">
+                                <img className="" src="/images/news.png" alt="" />
+                            </div>
+                            <div className="news-item__inner">
+                                <div className="">
+                                    <div className="news-item__title">
+                                        6 learnings from Shivpuri to Silicon Valley
+                                    </div>
+                                    <div className="news-item__badge">Leadership & Management</div>
+                                    <div className="news-item__text">
+                                        I’m excited to kick off this series of newsletters where I’ll be sharing my
+                                        experiences,
+                                        learnings, and best practices which helped me to grow both in my personal and
+                                        professional life. My hope is to give back to the community and help anyone
+                                        connect directly with me who may have got impacted with recent layoffs,
+                                        dealing with immigration challenges.
+                                    </div>
+                                </div>
+                                <div className="news-item__info">
+                                    <div className="news-item__info__author">
+                                        <img className="" src="/images/author.png" alt="" />
+                                        <div className="news-item__info__author__inner">
+                                            <div className="news-item__info__name">Sonali Garg</div>
+                                            <div className="news-item__info__date">February 6th, 2023</div>
+                                        </div>
+                                    </div>
+                                    <div className="news-item__info__counter">
+                                        <div className="news-item__info__like">
+                                            <img className="" src="/images/heart-outline.svg" alt="" />
+                                            165
+                                        </div>
+                                        <div className="news-item__info__share">
+                                            <img className="" src="/images/share-social.svg" alt="" />
+                                            Share
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        </a>
+                    </div>
+                </div>
+            </div>
         </div>
     );
 }

src/components/Account/AccountMenu.tsx

@@ -1,22 +1,28 @@
+'use client';
+
 import React from 'react';
+import { useSelectedLayoutSegment } from 'next/navigation';
 import { Link } from '../../navigation';
-import { useTranslations } from 'next-intl';
 
-const ROUTES = ['sessions', 'notifications', 'support', 'information', 'settings', 'messages', 'work-with-us'];
+export const AccountMenu = ({ userId, menu }: { userId: string, menu: { path: string, title: string, count?: number }[] }) => {
-
+    const selectedLayoutSegment = useSelectedLayoutSegment();
-export const AccountMenu = () => {
+    const pathname = selectedLayoutSegment || '';
-    const t = useTranslations('Account');
-    const userId = 5;
 
     return (
-        <ul>
+        <ul className="list-sidebar">
-            {ROUTES.map((item) => (
+            {menu.map(({ path, title, count }) => (
-                <li key={item}>
+                <li key={path} className="list-sidebar__item">
-                    <Link href={`/${userId}/${item}` as any}>
+                    <Link href={`/${userId}/${path}` as any} className={path === pathname ? 'active' : ''}>
-                        {t(`menu.${item}`)}
+                        {title}
+                        {count ? (
+                            <span className="count">{count}</span>
+                        ) : null}
                     </Link>
                 </li>
             ))}
+            <li className="list-sidebar__item">
+                <a href="#" className="">Log Out</a>
+            </li>
         </ul>
     )
 };

src/navigation.ts

@@ -6,12 +6,12 @@ export const { Link, redirect, usePathname, useRouter } =
         locales: ALLOWED_LOCALES,
         pathnames: {
             '/': '/',
-            '/experts': '/experts',
+            // '/experts': '/experts',
-            '/experts/[expertId]': '/experts/[expertId]',
+            // '/experts/[expertId]': '/experts/[expertId]',
-            '/news': '/news',
+            // '/news': '/news',
-            '/privacy-policy': '/privacy-policy',
+            // '/privacy-policy': '/privacy-policy',
-            '/[userId]': '/[userId]',
+            // '/[userId]': '/[userId]',
-            '/[userId]/[...slug]': '/[userId]/[...slug]',
+            // '/[userId]/[...slug]': '/[userId]/[...slug]',
         } satisfies Pathnames<typeof ALLOWED_LOCALES>,
         localePrefix: LOCALE_PREFIX
     });

src/styles/_pages.scss

@@ -1048,6 +1048,8 @@
   margin-bottom: 16px;
 
   .card-profile {
+    cursor: pointer;
+
     &__header {
       gap: 8px;
 

tsconfig.json

@@ -2,7 +2,11 @@
   "compilerOptions": {
     "baseUrl": "src",
     "target": "es5",
-    "lib": ["dom", "dom.iterable", "esnext"],
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
     "allowJs": true,
     "skipLibCheck": true,
     "strict": true,
@@ -20,6 +24,14 @@
       }
     ]
   },
-  "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+  "include": [
-  "exclude": ["node_modules"]
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    "dist/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
 }