fix: fix back link, fix search text

src/actions/experts.ts

@@ -7,8 +7,7 @@ export const getExpertsList = async (filter: GeneralFilter, locale: string) => {
     { ...filter },
         {
             headers: {
-                'X-User-Language': locale,
+                'X-User-Language': locale
-                Authorization: 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCIsImN0eSI6IkpXVCJ9.eyJuYW1laWQiOiIxNzIiLCJuYmYiOjE3MDM2ODMyMDgsImV4cCI6MTczNTIxOTIwOCwiaWF0IjoxNzAzNjgzMjA4fQ.KgnYfKO7oVFLlDuKhfyNN6RAaXKdeSzJd7F4r6_15AA'
             }
         }
     );
@@ -22,8 +21,7 @@ export const getExpertById = async (id: string, locale: string) => {
         { id },
         {
             headers: {
-                'X-User-Language': locale,
+                'X-User-Language': locale
-                Authorization: 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCIsImN0eSI6IkpXVCJ9.eyJuYW1laWQiOiIxNzIiLCJuYmYiOjE3MDM2ODMyMDgsImV4cCI6MTczNTIxOTIwOCwiaWF0IjoxNzAzNjgzMjA4fQ.KgnYfKO7oVFLlDuKhfyNN6RAaXKdeSzJd7F4r6_15AA'
             }
         }
     );

src/actions/tags.ts

@@ -7,8 +7,7 @@ export const getTagList = async (locale: string) => {
         {},
         {
             headers: {
-                'X-User-Language': locale,
+                'X-User-Language': locale
-                Authorization: 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCIsImN0eSI6IkpXVCJ9.eyJuYW1laWQiOiIxNzIiLCJuYmYiOjE3MDM2ODMyMDgsImV4cCI6MTczNTIxOTIwOCwiaWF0IjoxNzAzNjgzMjA4fQ.KgnYfKO7oVFLlDuKhfyNN6RAaXKdeSzJd7F4r6_15AA'
             }
         }
     );
@@ -21,8 +20,7 @@ export const getLanguages = async (locale: string) => {
         '/home/languages',
         {
             headers: {
-                'X-User-Language': locale,
+                'X-User-Language': locale
-                Authorization: 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCIsImN0eSI6IkpXVCJ9.eyJuYW1laWQiOiIxNzIiLCJuYmYiOjE3MDM2ODMyMDgsImV4cCI6MTczNTIxOTIwOCwiaWF0IjoxNzAzNjgzMjA4fQ.KgnYfKO7oVFLlDuKhfyNN6RAaXKdeSzJd7F4r6_15AA'
             }
         }
     );

src/app/[locale]/(main)/@experts/page.tsx

@@ -8,7 +8,7 @@ export default function ExpertsPage({ params }: { params: { locale: string } })
     return (
         <div className="main-find">
             <div className="b-inner">
-                <div className="main-find__top">
+                <div id="filter" className="main-find__top">
                     <h2 className="title-h2">{t('title')}</h2>
                     <div className="open-filter">
                         <img src="/images/options-outline.svg" className="" alt=""/>

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

@@ -1,7 +1,6 @@
-import React from 'react';
+import React, { Suspense } from 'react';
 import type { Metadata } from 'next';
 import { notFound } from 'next/navigation';
-import { Link } from '../../../../navigation';
 import { getExpertById, getExpertsList } from '../../../../actions/experts';
 import {
     ExpertCard,
@@ -10,6 +9,7 @@ import {
     ExpertPractice
 } from '../../../../components/Experts/ExpertDetails';
 import { Details } from '../../../../types/experts';
+import { BackButton } from '../../../../components/view';
 
 export const metadata: Metadata = {
     title: 'Bbuddy - Experts item',
@@ -80,10 +80,12 @@ export default async function ExpertItem({ params: { expertId = '', locale} }: {
         <div className="b-page">
             <div className="b-inner">
                 <div className="b-page__back">
-                    <Link href={'/experts' as any} className="btn-back">
+                    <Suspense>
-                        <img src="/images/arrow-back.svg" className="" alt="" />
+                        <BackButton className="btn-back">
-                        Back to experts list
+                            <img src="/images/arrow-back.svg" className="" alt="" />
-                    </Link>
+                            Back to experts list
+                        </BackButton>
+                    </Suspense>
                 </div>
                 <ExpertCard expert={expert} />
                 <ExpertInformation expert={expert} locale={locale} />

src/app/not-found.tsx

@@ -35,7 +35,9 @@ export default function NotFound() {
                                             <div className="error__description">
                                                 <div className="error__code">404</div>
                                                 <div className="error__subtitle">We can't seem to find a page you're looking for</div>
-                                                <BackButton className="btn-apply error__button" text="Go back" />
+                                                <BackButton className="btn-apply error__button">
+                                                    Go back
+                                                </BackButton>
                                             </div>
                                         </div>
                                     </div>

src/components/Experts/AdditionalFilter.tsx

@@ -47,7 +47,7 @@ export const ExpertsAdditionalFilter = ({
         setFilter(newFilter);
     }, [filter]);
 
-    useEffect(() => {
+    const updateRoute = debounce(() => {
         router.push({
             pathname: basePath as any,
             query: {
@@ -55,6 +55,10 @@ export const ExpertsAdditionalFilter = ({
                 ...filter
             }
         })
+    }, 300);
+
+    useEffect(() => {
+        updateRoute();
     }, [filter]);
 
     return (

src/components/Experts/Experts.tsx

@@ -18,7 +18,7 @@ export const Experts = async ({ basePath = '/', locale, pageSize = DEFAULT_PAGE_
     const t = await getTranslations('Experts');
     const searchData = await getTagList(locale);
     const languages = await getLanguages(locale);
-    const filter = getFilter({ searchData, pageSize });
+    const filter = getFilter({ pageSize });
     const experts = await getExpertsList(filter, locale);
 
     return (

src/components/view/BackButton.tsx

@@ -1,8 +1,10 @@
-import React from 'react';
+'use client'
+
+import React, { ReactNode } from 'react';
 import { Button } from 'antd';
 import { useRouter } from 'next/navigation';
 
-export const BackButton = ({ className, text }: { className?: string, text: string }) => {
+export const BackButton = ({ className, children }: { className?: string, children: ReactNode }) => {
     const router = useRouter();
 
     return (
@@ -10,7 +12,7 @@ export const BackButton = ({ className, text }: { className?: string, text: stri
             className={className}
             onClick={() => router.back()}
         >
-            {text}
+            {children}
         </Button>
     );
 };

src/components/view/CustomPagination.tsx

@@ -24,6 +24,13 @@ const Pagination = styled(AntdPagination)`
         }
     }
     
+    .ant-pagination-jump-next {
+        margin-inline-end: 0 !important;
+        height: 40px !important;
+        width: 40px !important;
+        line-height: 38px !important;
+    }
+    
     .ant-pagination-item-active {
         background: #2c7873 !important;
     
@@ -50,6 +57,7 @@ export const CustomPagination = (props: PaginationProps) => (
     <Pagination
         itemRender={itemRender}
         defaultCurrent={1}
+        showTitle={false}
         {...props}
     />
 );

src/styles/_default.scss

@@ -547,16 +547,16 @@ a {
   text-decoration: none;
   width: 100%;
   cursor: pointer;
-  border-radius: 8px;
+  border-radius: 8px !important;
-  background: #2C7873;
+  background: #2C7873 !important;
-  box-shadow: 0px 2px 4px 0px rgba(252, 214, 70, 0.16);
+  box-shadow: 0px 2px 4px 0px rgba(252, 214, 70, 0.16) !important;
-  display: flex;
+  display: flex !important;
-  gap: 10px;
+  gap: 10px !important;
-  height: 54px;
+  height: 54px !important;
   padding: 8px 31px;
   justify-content: center;
-  align-items: center;
+  align-items: center !important;
-  color: $white;
+  color: $white !important;
   @include rem(15);
   font-style: normal;
   font-weight: 400;

src/utils/filter.ts

@@ -2,18 +2,18 @@ import { SearchData } from '../types/tags';
 import { AdditionalFilter, Filter, GeneralFilter } from '../types/experts';
 import { DEFAULT_PAGE } from '../constants/common';
 
-export const getDefaultFilter = (searchData: SearchData | null, pageSize?: number): Filter => {
+export const getDefaultFilter = (pageSize?: number): Filter => {
-    const themesTagIds = searchData?.themesGroups?.reduce<number[]>((result, { tags }) => {
+    // const themesTagIds = searchData?.themesGroups?.reduce<number[]>((result, { tags }) => {
-        const t = tags?.map(({ id }) => id) || [];
+    //     const t = tags?.map(({ id }) => id) || [];
-
+    //
-        return t ? [
+    //     return t ? [
-            ...result,
+    //         ...result,
-            ...t
+    //         ...t
-        ] : result;
+    //     ] : result;
-    }, []);
+    // }, []);
 
     return {
-        themesTagIds,
+        themesTagIds: [],
         priceFrom: null,
         priceTo: null,
         durationFrom: null,
@@ -24,13 +24,12 @@ export const getDefaultFilter = (searchData: SearchData | null, pageSize?: numbe
 };
 
 type FilterProps = {
-    searchData: SearchData | null,
     pageSize?: number,
     searchParams?: { [key: string]: string | string[] | undefined }
 }
 
-export const getFilter = ({ searchData, searchParams, pageSize }: FilterProps): Filter => {
+export const getFilter = ({ searchParams, pageSize }: FilterProps): Filter => {
-    const filter = getDefaultFilter(searchData, pageSize);
+    const filter = getDefaultFilter(pageSize);
 
     if (searchParams) {
         const { themesTagIds, priceFrom, priceTo, durationFrom, durationTo, page, pageSize } = searchParams;