search page without from-to

frontend/app/(urls)/search/[category]/page.tsx

@@ -1,26 +1,58 @@
 import React, { Suspense } from 'react'
+import type { Metadata } from 'next'
 import SearchCard from '../components/SearchCard'
+import { SearchCardProps, SearchPageProps } from '@/app/types'
+import { fetchRoutes } from '@/lib/search/fetchRoutes'
 
-interface SearchPageProps {
-  params: {
-    category: string
+export async function generateMetadata(): Promise<Metadata> {
+  return {
+    title: 'Поиск перевозчиков и посылок | Tripwb',
+    description:
+      'Найдите самые быстрые варианты по перевозке своих посылок | Tripwb - текст текст текст',
+    openGraph: {
+      title: 'Поиск текст текст | Tripwb - текст текст текст',
+      description: 'Найдите лучшие что то',
+      url: 'https://tripwb.com/search',
+      siteName: 'TripWB',
+      images: [
+        {
+          url: 'https://i.ibb.co/gmqzzmb/header-logo-mod-1200x630.png',
+          width: 1200,
+          height: 630,
+          alt: 'Tripwb - текст текст текст',
+        },
+      ],
+      locale: 'ru_RU',
+      type: 'website',
+    },
+    twitter: {
+      card: 'summary_large_image',
+      title: 'Поиск текст текст | TripWB',
+      description: 'Ттекст текст текст текст',
+      images: [
+        {
+          url: 'https://i.ibb.co/gmqzzmb/header-logo-mod-1200x630.png',
+          width: 1200,
+          height: 630,
+          alt: 'Tripwb - текст текст текст',
+        },
+      ],
+    },
+    alternates: {
+      canonical: 'https://tripwb.com/search/',
+    },
+    robots: {
+      index: true,
+      follow: true,
+    },
   }
-  searchParams: {
-    [key: string]: string | string[] | undefined
-  }
-}
-
-// получаем все предложения по выбранному owner_type
-async function fetchSearch(category: string, query: string = '') {
-  // get search api(owner_type)
-  return []
 }
 
 export default async function SearchPage(props: SearchPageProps) {
   const params = await props.params
   const { category } = params
 
-  const initialData = await fetchSearch(category)
+  const { results, count } = await fetchRoutes(category)
 
   return (
     <div className="container mx-auto p-4">
@@ -29,14 +61,12 @@ export default async function SearchPage(props: SearchPageProps) {
       </h1>
 
       <Suspense fallback={<div>Загрузка результатов...</div>}>
-        {/* Здесь будет компонент с результатами поиска */}
         <div className="space-y-4">
-          {initialData.map((item: any, index: number) => (
-            <div key={index} className="rounded-lg border p-4">
-              {/* Здесь будет карточка с результатом */}
-              <p>Результат поиска {index + 1}</p>
-            </div>
-          ))}
+          {results.length > 0 ? (
+            results.map((item: SearchCardProps) => <SearchCard key={item.id} {...item} />)
+          ) : (
+            <div className="text-center text-gray-500">Объявления не найдены</div>
+          )}
         </div>
       </Suspense>
     </div>

frontend/app/types/index.ts

@@ -226,3 +226,17 @@ export interface PricingCardProps {
   isActive?: boolean
   onPlanChange?: () => void
 }
+
+export interface SearchResponse {
+  count: number
+  results: SearchCardProps[]
+}
+
+export interface SearchPageProps {
+  params: {
+    category: string
+  }
+  searchParams: {
+    [key: string]: string | string[] | undefined
+  }
+}