added blog pages

app/api/gyms/fetchAllGyms.ts

@@ -0,0 +1,7 @@
+import config from '@/lib/config';
+import axios from 'axios';
+
+export default async function fetchAllGyms() {
+  const res = await axios.get(`${config.backendUrl}gym`);
+  return res.data.data.gyms;
+}

app/api/gyms/fetchGymById.ts

@@ -0,0 +1,8 @@
+import config from '@/lib/config';
+import axios from 'axios';
+
+export default async function fetchGymById(id: string) {
+  const res = await axios.get(`${config.backendUrl}gym/${id}`);
+  console.log(res.data.gym);
+  return res.data.gym;
+}

app/gym/[id]/page.tsx

@@ -18,7 +18,7 @@ import {
   X,
 } from 'lucide-react';
 import { Gym } from '@/types/gym';
-import gymsData from '@/data/gym.json';
+import fetchGymById from '@/app/api/gyms/fetchGymById';
 
 export default function GymDetailPage() {
   const params = useParams();
@@ -30,10 +30,15 @@ export default function GymDetailPage() {
   const [isFavorite, setIsFavorite] = useState(false);
 
   useEffect(() => {
-    const foundGym = gymsData.find((g: Gym) => g.id === params.id);
-    if (foundGym) {
-      setGym(foundGym);
-    }
+    // const foundGym = gymsData.find((g: Gym) => g.id === params.id);
+    // if (foundGym) {
+    //   setGym(foundGym);
+    // }
+    const fetchAll = async () => {
+      const gym = await fetchGymById(params.id?.toString() || '');
+      setGym(gym);
+    };
+    fetchAll();
   }, [params.id]);
 
   if (!gym) {
@@ -47,12 +52,16 @@ export default function GymDetailPage() {
     );
   }
 
-  const formatTiming = (timing: { [key: string]: string }) => {
+  const formatTiming = (timing: {
+    [key: string]: { open: string; close: string };
+  }) => {
     if (typeof timing === 'object') {
       return Object.entries(timing).map(([day, time]) => (
         <div key={day} className="flex justify-between">
           <span className="font-medium capitalize">{day}:</span>
-          <span>{time}</span>
+          <span>
+            {time.open} - {time.close}{' '}
+          </span>
         </div>
       ));
     }

app/gym/page.tsx

@@ -5,8 +5,8 @@ import { useSearchParams, useRouter } from 'next/navigation';
 import Link from 'next/link';
 import Image from 'next/image';
 import {
-  Edit,
-  Trash2,
+  // Edit,
+  // Trash2,
   Eye,
   Search,
   MapPin,
@@ -28,7 +28,10 @@ import {
   Clock,
 } from 'lucide-react';
 import { Gym } from '@/types/gym';
-import gymsData from '@/data/gym.json';
+// import gymsData from '@/data/gym.json';
+import fetchAllGyms from '../api/gyms/fetchAllGyms';
+import { useDispatch } from 'react-redux';
+import { setGyms as setGymData } from '../store/features/gym/gymSlice';
 
 const GYMS_PER_PAGE = 12;
 
@@ -40,6 +43,7 @@ function GymPageContent() {
   const [sortBy, setSortBy] = useState('name');
   const [viewMode, setViewMode] = useState<'grid' | 'list'>('list');
   const [showFilters, setShowFilters] = useState(false);
+  const dispatch = useDispatch();
 
   const searchParams = useSearchParams();
   const router = useRouter();
@@ -61,8 +65,13 @@ function GymPageContent() {
   }, [searchParams]);
 
   useEffect(() => {
-    setGyms(gymsData);
-  }, []);
+    const updateData = async () => {
+      const data = await fetchAllGyms();
+      setGyms(data);
+      dispatch(setGymData(data));
+    };
+    updateData();
+  }, [dispatch]);
 
   // Update URL when filters change
   const updateURL = (updates: Record<string, string>) => {
@@ -150,13 +159,13 @@ function GymPageContent() {
     router.push(`/gym${newURL}`);
   };
 
-  const handleDelete = (id: string) => {
-    if (confirm('Are you sure you want to delete this gym?')) {
-      setGyms(
-        gyms.map(gym => (gym.id === id ? { ...gym, isDeleted: true } : gym))
-      );
-    }
-  };
+  // const handleDelete = (id: string) => {
+  //   if (confirm('Are you sure you want to delete this gym?')) {
+  //     setGyms(
+  //       gyms.map(gym => (gym.id === id ? { ...gym, isDeleted: true } : gym))
+  //     );
+  //   }
+  // };
 
   const resetFilters = () => {
     setSearchQuery('');
@@ -514,7 +523,7 @@ function GymPageContent() {
                             >
                               <Eye className="w-5 h-5" />
                             </Link>
-                            <Link
+                            {/* <Link
                               href={`/gym/edit/${gym.id}`}
                               className="w-12 h-12 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-xl hover:bg-blue-500 hover:text-white transition-all duration-200"
                             >
@@ -525,7 +534,7 @@ function GymPageContent() {
                               className="w-12 h-12 bg-white/90 backdrop-blur-sm rounded-full flex items-center justify-center shadow-xl hover:bg-red-500 hover:text-white transition-all duration-200"
                             >
                               <Trash2 className="w-5 h-5" />
-                            </button>
+                            </button> */}
                           </div>
                         </div>
                       </div>
@@ -722,7 +731,7 @@ function GymPageContent() {
                             >
                               View Details
                             </Link>
-                            <Link
+                            {/* <Link
                               href={`/gym/edit/${gym.id}`}
                               className="p-3 text-blue-600 hover:bg-blue-100 rounded-xl transition-colors duration-200"
                             >
@@ -733,7 +742,7 @@ function GymPageContent() {
                               className="p-3 text-red-600 hover:bg-red-100 rounded-xl transition-colors duration-200"
                             >
                               <Trash2 className="w-5 h-5" />
-                            </button>
+                            </button> */}
                           </div>
                         </div>
                       </div>

app/store/features/gym/gymSlice.ts

@@ -0,0 +1,27 @@
+import { createSlice, PayloadAction } from '@reduxjs/toolkit';
+import { Gym } from '@/types/gym';
+
+interface GymState {
+  gyms: Gym[] | null;
+}
+
+const initialState: GymState = {
+  gyms: [],
+};
+
+const gymSlice = createSlice({
+  name: 'gyms',
+  initialState,
+  reducers: {
+    setGyms(state, action: PayloadAction<Gym[]>) {
+      console.log(action.payload);
+      state.gyms = action.payload;
+    },
+    clearGyms(state) {
+      state.gyms = null;
+    },
+  },
+});
+
+export const { setGyms, clearGyms } = gymSlice.actions;
+export default gymSlice.reducer;

app/store/store.ts

@@ -1,11 +1,13 @@
 import { configureStore } from '@reduxjs/toolkit';
 import userReducers from './features/user/userSlice';
-import blogsReducers from './features/blogs/blogsSlice';
+import blogReducers from './features/blogs/blogsSlice';
+import gymReducers from './features/gym/gymSlice';
 
 export const store = configureStore({
   reducer: {
     user: userReducers,
-    blogs: blogsReducers,
+    blogs: blogReducers,
+    gyms: gymReducers,
   },
 });
 

types/gym.ts

@@ -11,7 +11,7 @@ export interface Gym {
   videos: string[];
   lockerFacility: boolean;
   timing: {
-    [key: string]: string;
+    [key: string]: { open: string; close: string };
   };
   categories: string[];
   rateCard?: string;