added pagination params page

src/pages/tours/ui/StepOne.tsx

@@ -272,7 +272,7 @@ const StepOne = ({
 
   function onSubmit(value: z.infer<typeof TourformSchema>) {
     const formData = new FormData();
-
+    const tour = data ? data.data : null;
     // Asosiy ma'lumotlar
     formData.append("title", value.title);
     formData.append("location_name", value.location_name);
@@ -315,7 +315,7 @@ const StepOne = ({
       formData.append("hotel_meals_ru", value.hotel_meals_info_ru);
     }
     formData.append("duration_days", String(value.duration));
-    formData.append("rating", String("0.0"));
+    formData.append("rating", tour ? String(tour.rating) : "0.0");
 
     if (value.banner instanceof File) {
       formData.append("image_banner", value.banner);

src/pages/tours/ui/Tours.tsx

@@ -37,7 +37,7 @@ import {
 } from "lucide-react";
 import { useState } from "react";
 import { useTranslation } from "react-i18next";
-import { useNavigate } from "react-router-dom";
+import { useNavigate, useSearchParams } from "react-router-dom";
 import { toast } from "sonner";
 
 type Role =
@@ -51,15 +51,17 @@ type Role =
 
 const Tours = ({ user }: { user: Role }) => {
   const { t } = useTranslation();
-  const [page, setPage] = useState(1);
   const [deleteId, setDeleteId] = useState<number | null>(null);
   const [showPopularDialog, setShowPopularDialog] = useState(false);
   const navigate = useNavigate();
   const queryClient = useQueryClient();
+  const [searchParams, setSearchParams] = useSearchParams();
+  const initialPage = Number(searchParams.get("page")) || 1;
+  const [page, setPage] = useState(initialPage);
 
   const { data, isLoading, isError, refetch } = useQuery({
     queryKey: ["all_tours", page],
-    queryFn: () => getAllTours({ page: page, page_size: 10 }),
+    queryFn: () => getAllTours({ page, page_size: 10 }),
   });
 
   const { data: popularTour } = useQuery({
@@ -110,6 +112,11 @@ const Tours = ({ user }: { user: Role }) => {
     setShowPopularDialog(false);
   };
 
+  const updatePage = (newPage: number) => {
+    setPage(newPage);
+    setSearchParams({ page: newPage.toString() });
+  };
+
   if (isLoading) {
     return (
       <div className="flex flex-col items-center justify-center min-h-screen bg-slate-900 text-white gap-4 w-full">
@@ -343,32 +350,35 @@ const Tours = ({ user }: { user: Role }) => {
       <div className="flex justify-end mt-10 gap-3">
         <button
           disabled={page === 1}
-          onClick={() => setPage((p) => Math.max(p - 1, 1))}
-          className="p-2 rounded-lg border border-slate-600 text-slate-300 hover:bg-slate-700/50 disabled:opacity-50 disabled:cursor-not-allowed transition-all"
+          onClick={() => updatePage(Math.max(page - 1, 1))}
+          className="p-2 rounded-lg border border-slate-600 text-slate-300 hover:bg-slate-700/50 disabled:opacity-50"
         >
           <ChevronLeft className="w-5 h-5" />
         </button>
-        {[...Array(data?.data.data.total_pages)].map((_, i) => (
-          <button
-            key={i}
-            onClick={() => setPage(i + 1)}
-            className={`px-4 py-2 rounded-lg border transition-all font-medium ${
-              page === i + 1
-                ? "bg-gradient-to-r from-blue-600 to-cyan-600 border-blue-500 text-white shadow-lg shadow-cyan-500/50"
-                : "border-slate-600 text-slate-300 hover:bg-slate-700/50 hover:border-slate-500"
-            }`}
-          >
-            {i + 1}
-          </button>
-        ))}
+
+        {[...Array(data?.data.data.total_pages)].map((_, i) => {
+          const pageNum = i + 1;
+          return (
+            <button
+              key={i}
+              onClick={() => updatePage(pageNum)}
+              className={`px-4 py-2 rounded-lg border font-medium transition-all ${
+                page === pageNum
+                  ? "bg-gradient-to-r from-blue-600 to-cyan-600 text-white border-blue-500"
+                  : "border-slate-600 text-slate-300 hover:bg-slate-700/50"
+              }`}
+            >
+              {pageNum}
+            </button>
+          );
+        })}
+
         <button
           disabled={page === data?.data.data.total_pages}
           onClick={() =>
-            setPage((p) =>
-              Math.min(p + 1, data ? data.data.data.total_pages : 1),
-            )
+            updatePage(Math.min(page + 1, data?.data.data.total_pages ?? 1))
           }
-          className="p-2 rounded-lg border border-slate-600 text-slate-300 hover:bg-slate-700/50 disabled:opacity-50 disabled:cursor-not-allowed transition-all"
+          className="p-2 rounded-lg border border-slate-600 text-slate-300 hover:bg-slate-700/50 disabled:opacity-50"
         >
           <ChevronRight className="w-5 h-5" />
         </button>

src/pages/tours/ui/ToursSetting.tsx

@@ -25,6 +25,39 @@ import React, { useState } from "react";
 import { useTranslation } from "react-i18next";
 import { useNavigate, useSearchParams } from "react-router-dom";
 
+// Error Component
+const ErrorDisplay: React.FC<{ message: string; onRetry: () => void }> = ({
+  message,
+  onRetry,
+}) => {
+  const { t } = useTranslation();
+  return (
+    <div className="flex flex-col items-center justify-center min-h-[300px] bg-slate-800/50 rounded-lg text-center text-white gap-4 p-6">
+      <AlertTriangle className="w-10 h-10 text-red-500" />
+      <p className="text-lg">{message}</p>
+      <Button
+        onClick={onRetry}
+        className="bg-gradient-to-r from-blue-600 to-cyan-600 text-white rounded-lg px-5 py-2 hover:opacity-90"
+      >
+        {t("Qayta urinish")}
+      </Button>
+    </div>
+  );
+};
+
+// Loading Component
+const LoadingDisplay: React.FC<{ message?: string }> = ({ message }) => {
+  const { t } = useTranslation();
+  return (
+    <div className="flex flex-col items-center justify-center min-h-[300px] bg-slate-800/50 rounded-lg text-white gap-4">
+      <Loader2 className="w-10 h-10 animate-spin text-cyan-400" />
+      <p className="text-slate-400">
+        {message || t("Ma'lumotlar yuklanmoqda...")}
+      </p>
+    </div>
+  );
+};
+
 const ToursSetting: React.FC = () => {
   const { t } = useTranslation();
   const [searchParams] = useSearchParams();
@@ -134,61 +167,12 @@ const ToursSetting: React.FC = () => {
     isError: amenitiesError,
     refetch: amenitiesRef,
   } = useQuery({
-    queryKey: ["all_amenities", page, pageSize],
-    queryFn: () => getAllAmenities({ page, page_size: pageSize }),
+    queryKey: ["all_amenities", pageAmenities, pageSizeAmenities],
+    queryFn: () =>
+      getAllAmenities({ page: pageAmenities, page_size: pageSizeAmenities }),
     select: (res) => res.data.data,
   });
 
-  if (
-    isLoading ||
-    tarifLoad ||
-    transportLoad ||
-    typeLoad ||
-    featureLoad ||
-    featureTypeLoad ||
-    amenitiesLoad
-  ) {
-    return (
-      <div className="flex flex-col items-center justify-center min-h-screen bg-slate-900 text-white gap-4 w-full">
-        <Loader2 className="w-10 h-10 animate-spin text-cyan-400" />
-        <p className="text-slate-400">{t("Ma'lumotlar yuklanmoqda...")}</p>
-      </div>
-    );
-  }
-
-  if (
-    isError ||
-    tarifError ||
-    transportError ||
-    typeError ||
-    featureError ||
-    featureTypeError ||
-    amenitiesError
-  ) {
-    return (
-      <div className="flex flex-col items-center justify-center min-h-screen bg-slate-900 w-full text-center text-white gap-4">
-        <AlertTriangle className="w-10 h-10 text-red-500" />
-        <p className="text-lg">
-          {t("Ma'lumotlarni yuklashda xatolik yuz berdi.")}
-        </p>
-        <Button
-          onClick={() => {
-            refetch();
-            tarifRef();
-            transportRef();
-            typeRef();
-            featureRef();
-            featureTypeRef();
-            amenitiesRef();
-          }}
-          className="bg-gradient-to-r from-blue-600 to-cyan-600 text-white rounded-lg px-5 py-2 hover:opacity-90"
-        >
-          {t("Qayta urinish")}
-        </Button>
-      </div>
-    );
-  }
-
   const handleTabChange = (value: string) => {
     setActiveTab(value);
     navigate({
@@ -217,52 +201,121 @@ const ToursSetting: React.FC = () => {
           </TabsList>
 
           <TabsContent value="badge" className="space-y-4">
-            <BadgeTable data={data} page={page} pageSize={pageSize} />
+            {isLoading ? (
+              <LoadingDisplay />
+            ) : isError ? (
+              <ErrorDisplay
+                message={t("Belgilarni yuklashda xatolik yuz berdi.")}
+                onRetry={refetch}
+              />
+            ) : (
+              <BadgeTable data={data} page={page} pageSize={pageSize} />
+            )}
           </TabsContent>
+
           <TabsContent value="tarif" className="space-y-4">
-            <TarifTable
-              data={tarifData}
-              page={pageTarif}
-              pageSize={pageSizeTarif}
-            />
+            {tarifLoad ? (
+              <LoadingDisplay />
+            ) : tarifError ? (
+              <ErrorDisplay
+                message={t("Tariflarni yuklashda xatolik yuz berdi.")}
+                onRetry={tarifRef}
+              />
+            ) : (
+              <TarifTable
+                data={tarifData}
+                page={pageTarif}
+                pageSize={pageSizeTarif}
+              />
+            )}
           </TabsContent>
+
           <TabsContent value="transport" className="space-y-4">
-            <TransportTable
-              data={transportData}
-              page={pageTransport}
-              pageSize={pageSizeTransport}
-            />
+            {transportLoad ? (
+              <LoadingDisplay />
+            ) : transportError ? (
+              <ErrorDisplay
+                message={t("Transportlarni yuklashda xatolik yuz berdi.")}
+                onRetry={transportRef}
+              />
+            ) : (
+              <TransportTable
+                data={transportData}
+                page={pageTransport}
+                pageSize={pageSizeTransport}
+              />
+            )}
           </TabsContent>
+
           <TabsContent value="meal" className="space-y-4">
-            <Amenities
-              data={amenitiesData}
-              page={pageAmenities}
-              pageSize={pageSizeAmenities}
-            />
+            {amenitiesLoad ? (
+              <LoadingDisplay />
+            ) : amenitiesError ? (
+              <ErrorDisplay
+                message={t("Qulayliklarni yuklashda xatolik yuz berdi.")}
+                onRetry={amenitiesRef}
+              />
+            ) : (
+              <Amenities
+                data={amenitiesData}
+                page={pageAmenities}
+                pageSize={pageSizeAmenities}
+              />
+            )}
           </TabsContent>
+
           <TabsContent value="hotel_type" className="space-y-4">
-            <MealTable
-              data={typeData}
-              page={pageTransport}
-              pageSize={pageSizeTransport}
-            />
+            {typeLoad ? (
+              <LoadingDisplay />
+            ) : typeError ? (
+              <ErrorDisplay
+                message={t("Otel turlarini yuklashda xatolik yuz berdi.")}
+                onRetry={typeRef}
+              />
+            ) : (
+              <MealTable
+                data={typeData}
+                page={pageType}
+                pageSize={pageSizeType}
+              />
+            )}
           </TabsContent>
+
           <TabsContent value="hotel_features" className="space-y-4">
-            <FeaturesTable
-              data={featureData}
-              page={pageFeature}
-              pageSize={pageSizeFeature}
-              setActiveTab={setActiveTab}
-              setFeatureId={setFeatureId}
-            />
+            {featureLoad ? (
+              <LoadingDisplay />
+            ) : featureError ? (
+              <ErrorDisplay
+                message={t("Otel sharoitlarini yuklashda xatolik yuz berdi.")}
+                onRetry={featureRef}
+              />
+            ) : (
+              <FeaturesTable
+                data={featureData}
+                page={pageFeature}
+                pageSize={pageSizeFeature}
+                setActiveTab={setActiveTab}
+                setFeatureId={setFeatureId}
+              />
+            )}
           </TabsContent>
+
           <TabsContent value="feature_type" className="space-y-4">
-            <FeaturesTableType
-              data={featureTypeData}
-              page={pageFeature}
-              featureId={featureId}
-              pageSize={pageSizeFeature}
-            />
+            {featureTypeLoad ? (
+              <LoadingDisplay />
+            ) : featureTypeError ? (
+              <ErrorDisplay
+                message={t("Sharoit turlarini yuklashda xatolik yuz berdi.")}
+                onRetry={featureTypeRef}
+              />
+            ) : (
+              <FeaturesTableType
+                data={featureTypeData}
+                page={pageFeature}
+                featureId={featureId}
+                pageSize={pageSizeFeature}
+              />
+            )}
           </TabsContent>
         </Tabs>
       </div>