From 09fd00849a41dbe25dd95e88e85873aadc11cc34 Mon Sep 17 00:00:00 2001 From: darshan2006-op Date: Tue, 1 Jul 2025 00:23:52 +0530 Subject: [PATCH] added blog pages --- app/api/gyms/fetchAllGyms.ts | 7 +++++ app/api/gyms/fetchGymById.ts | 8 ++++++ app/gym/[id]/page.tsx | 23 ++++++++++++----- app/gym/page.tsx | 41 ++++++++++++++++++------------ app/store/features/gym/gymSlice.ts | 27 ++++++++++++++++++++ app/store/store.ts | 6 +++-- types/gym.ts | 2 +- 7 files changed, 88 insertions(+), 26 deletions(-) create mode 100644 app/api/gyms/fetchAllGyms.ts create mode 100644 app/api/gyms/fetchGymById.ts create mode 100644 app/store/features/gym/gymSlice.ts diff --git a/app/api/gyms/fetchAllGyms.ts b/app/api/gyms/fetchAllGyms.ts new file mode 100644 index 0000000..5510be7 --- /dev/null +++ b/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; +} diff --git a/app/api/gyms/fetchGymById.ts b/app/api/gyms/fetchGymById.ts new file mode 100644 index 0000000..4e7880f --- /dev/null +++ b/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; +} diff --git a/app/gym/[id]/page.tsx b/app/gym/[id]/page.tsx index 2c8a84d..5443186 100644 --- a/app/gym/[id]/page.tsx +++ b/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]) => (
{day}: - {time} + + {time.open} - {time.close}{' '} +
)); } diff --git a/app/gym/page.tsx b/app/gym/page.tsx index d938e34..e1c404b 100644 --- a/app/gym/page.tsx +++ b/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) => { @@ -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() { > - @@ -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" > - + */} @@ -722,7 +731,7 @@ function GymPageContent() { > View Details - @@ -733,7 +742,7 @@ function GymPageContent() { className="p-3 text-red-600 hover:bg-red-100 rounded-xl transition-colors duration-200" > - + */} diff --git a/app/store/features/gym/gymSlice.ts b/app/store/features/gym/gymSlice.ts new file mode 100644 index 0000000..54f3d7e --- /dev/null +++ b/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) { + console.log(action.payload); + state.gyms = action.payload; + }, + clearGyms(state) { + state.gyms = null; + }, + }, +}); + +export const { setGyms, clearGyms } = gymSlice.actions; +export default gymSlice.reducer; diff --git a/app/store/store.ts b/app/store/store.ts index 288174b..e05eb06 100644 --- a/app/store/store.ts +++ b/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, }, }); diff --git a/types/gym.ts b/types/gym.ts index edd7f98..5c64b9e 100644 --- a/types/gym.ts +++ b/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;