bhavnish.arora/POC-client
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

minor changes done

Browse source
This commit is contained in:
bhavnish.arora 2025-01-29 23:45:48 +05:30
parent 1a8a7f21b1
commit 1261906328
4 changed files with 98 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/components/Coach.jsx
View file

@ -8,8 +8,14 @@ const Coach = () => {
const [message, setMessage] = useState("");
const [editingId, setEditingId] = useState(null);
// API URL
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL;
// Coaches SORTED
const sortedCoaches = coaches.sort(
(a, b) => new Date(b.createdAt) - new Date(a.createdAt)
);
// Fetch coaches
const fetchCoaches = async () => {
try {
@ -154,7 +160,7 @@ const Coach = () => {
{/* Coach List */}
<ul className="space-y-4 mt-16">
<h2 className="text-2xl font-semibold mb-4">Coahes</h2>
{coaches.map((coach) => (
{sortedCoaches.map((coach) => (
<li
key={coach.id}
className="flex items-center justify-between bg-gray-800 p-4 rounded-lg shadow-md"

26
src/components/Events.jsx
View file

@ -1,4 +1,4 @@
import React, { useState, useEffect } from "react";
import React, { useState, useEffect, useRef } from "react";
import axios from "axios";
import { toast } from "react-toastify";
@ -8,7 +8,16 @@ const Events = () => {
const [errorMessage, setErrorMessage] = useState("");
const [editId, setEditId] = useState(null);
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL
// reference
const dateInputRef = useRef(null);
// API URL
const API_BASE_URL = import.meta.env.VITE_API_BASE_URL;
// SORTED EVENTS
const sortedEvents = events.sort(
(a, b) => new Date(b.createdAt) - new Date(a.createdAt)
);
// Fetch events
const fetchEvents = async () => {
@ -63,13 +72,10 @@ const Events = () => {
if (!validateForm()) return;
try {
const isoDate = new Date(form.date).toISOString();
const response = await axios.put(
`${API_BASE_URL}/event/${editId}`,
{
const response = await axios.put(`${API_BASE_URL}/event/${editId}`, {
...form,
date: isoDate,
}
);
});
setEvents((prev) =>
prev.map((event) => (event.id === editId ? response.data.data : event))
);
@ -121,7 +127,9 @@ const Events = () => {
name="date"
value={form.date}
onChange={handleChange}
className="px-4 py-2 border rounded-lg bg-gray-800 text-white focus:ring focus:ring-gray-500"
ref={dateInputRef}
onClick={() => dateInputRef.current.showPicker()}
className="px-4 py-2 border rounded-lg bg-gray-800 text-white focus:ring focus:ring-gray-500 cursor-pointer"
/>
<textarea
name="description"
@ -151,7 +159,7 @@ const Events = () => {
{/* Event List */}
<ul className="space-y-4 mt-16">
<h2 className="text-2xl font-semibold mb-4">Events</h2>
{events.map((event) => (
{sortedEvents.map((event) => (
<li
key={event.id}
className="flex items-center justify-between bg-gray-800 p-4 rounded-lg shadow-md"

69
src/components/Hero.jsx
View file

@ -1,4 +1,3 @@
import React, { useState, useEffect } from "react";
import { Swiper, SwiperSlide } from "swiper/react";
import "swiper/css";
@ -7,29 +6,33 @@ import { Navigation } from "swiper/modules";
import { toast } from "react-toastify";
const Hero = () => {
const defaultImages = [
"/banner1.jpg",
"/banner2.jpg",
"/banner3.jpg",
];
const [images, setImages] = useState(() => {
try {
const savedImages = localStorage.getItem("heroImages");
return savedImages ? JSON.parse(savedImages) : defaultImages;
return savedImages ? JSON.parse(savedImages) : [];
} catch (error) {
console.error("Error accessing localStorage", error);
return [];
}
});
// Save images to localStorage
useEffect(() => {
if (images.length > 0) {
try {
localStorage.setItem("heroImages", JSON.stringify(images));
} catch (error) {
console.error("Error saving images to localStorage", error);
}
}
}, [images]);
// Handle file upload
const handleAddImage = (event) => {
const file = event.target.files[0];
if (file) {
const reader = new FileReader();
reader.onload = (e) => {
setImages([...images, e.target.result]);
setImages([e.target.result, ...images]);
toast.success("Image added successfully!");
};
reader.readAsDataURL(file);
@ -58,31 +61,62 @@ const Hero = () => {
const handleRemoveImage = (index) => {
const updatedImages = images.filter((_, i) => i !== index);
setImages(updatedImages.length > 0 ? updatedImages : defaultImages);
setImages(updatedImages);
toast.success("Image removed successfully!");
};
return (
<div>
<Swiper modules={[Navigation]} navigation loop={true} className="rounded-xl overflow-hidden shadow-lg mb-6" spaceBetween={10} slidesPerView={1}>
{images.length > 0 ? (
<Swiper
modules={[Navigation]}
navigation
loop={true}
spaceBetween={10}
slidesPerView={1}
>
{images.map((image, index) => (
<SwiperSlide key={index} className="relative">
<img src={image} alt={`Slide ${index + 1}`} className="w-full lg:h-[600px] md:h-[350px] object-cover" />
<img
src={image}
alt={`Slide ${index + 1}`}
className="w-full object-cover h-[300px] md:h-[350px] lg:h-[600px]"
/>
<div className="flex items-center space-x-2">
<button onClick={() => handleUpdateImage(index)} className="absolute top-4 right-4 bg-blue-500 text-white px-4 py-2 rounded-full hover:bg-blue-600 cursor-pointer">
<button
onClick={() => handleUpdateImage(index)}
className="absolute top-4 right-4 bg-blue-500 text-white px-2 py-1 md:px-4 md:py-2 rounded-full hover:bg-blue-600 cursor-pointer"
>
Update
</button>
<button onClick={() => handleRemoveImage(index)} className="absolute top-4 right-24 bg-red-500 mr-6 text-white px-4 py-2 rounded-full hover:bg-red-600 cursor-pointer">
<button
onClick={() => handleRemoveImage(index)}
className="absolute top-4 right-24 bg-red-500 mr-3 md:mr-6 text-white px-2 py-1 md:px-4 md:py-2 rounded-full hover:bg-red-600 cursor-pointer"
>
Remove
</button>
</div>
</SwiperSlide>
))}
</Swiper>
) : (
<p className="text-center text-gray-500 mt-4">
No images available. Please add one.
</p>
)}
<div className="flex items-center space-x-2 mt-3">
<input type="file" accept="image/*" onChange={handleAddImage} className="border border-gray-300 rounded-lg px-3 py-2 w-60 hidden" id="fileInput" />
<label htmlFor="fileInput" className="bg-white text-black px-4 py-2 rounded-lg hover:bg-gray-300 cursor-pointer">
<input
type="file"
accept="image/*"
onChange={handleAddImage}
className="hidden"
id="fileInput"
/>
<label
htmlFor="fileInput"
className="bg-white text-black px-4 py-2 rounded-lg hover:bg-gray-300 cursor-pointer"
>
Add Image
</label>
</div>
@ -90,5 +124,4 @@ const Hero = () => {
);
};
export default Hero;

9
src/components/LoginForm.jsx
View file

@ -8,8 +8,13 @@ const LoginForm = () => {
const navigate = useNavigate();
const handleLogin = () => {
const validEmail = process.env.VITE_USERNAME;
const validPassword = process.env.VITE_PASSWORD;
const validEmail = import.meta.env.VITE_USERNAME;
const validPassword = import.meta.env.VITE_PASSWORD;
if (!username || !password) {
toast.error("Please fill in your credentials.");
return;
}
if (username === validEmail && password === validPassword) {
toast.success("Login successful!");