Skip to content

Source folder #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
PTHARRISH merged 2 commits into from
Dec 10, 2025
Merged

Source folder #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
3c1f2c8
re usable components
GaneshArumugam05 Dec 10, 2025
dac45a4
missing file added
GaneshArumugam05 Dec 10, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
199 changes: 169 additions & 30 deletions frontend/src/App.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,35 +1,174 @@
import { useState } from 'react'
import reactLogo from './assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'
// src/App.jsx
import React from "react";
import LandingPage from "./Pages/LandingPage";

function App() {
const [count, setCount] = useState(0)

return (
<>
<div>
<a href="https://vite.dev" target="_blank">
<img src={viteLogo} className="logo" alt="Vite logo" />
</a>
<a href="https://react.dev" target="_blank">
<img src={reactLogo} className="logo react" alt="React logo" />
</a>
</div>
<h1>Vite + React</h1>
<div className="card">
<button onClick={() => setCount((count) => count + 1)}>
count is {count}
</button>
<p>
Edit <code>src/App.jsx</code> and save to test HMR
</p>
</div>
<p className="read-the-docs">
Click on the Vite and React logos to learn more
</p>
</>
)
<div className="min-h-screen bg-gray-50">
<LandingPage />
</div>
);
}

export default App
export default App;



// // src/App.jsx
// import { useState } from "react";
// import { motion } from "framer-motion";
// import Button from "./reusableComponents/Button";
// import Input from "./reusableComponents/Input";
// import ProductCard from "./reusableComponents/ProductCard";
// import Navbar from "./reusableComponents/Navbar";
// import Footer from "./reusableComponents/Footer";
// import BentoGrid from "./reusableComponents/BentoGrid";

// import FilterOptions from "./reusableComponents/FilterOption";
// import Modal from "./reusableComponents/ModalPopup";
// import Carousel from "./reusableComponents/CarouselSlider";
// import BannerCard from "./reusableComponents/BannerCard";
// import SearchBar from "./reusableComponents/Searchbar";

// const products = [
// { id: 1, name: "iPhone 15 Pro", price: 999, image: "https://images.unsplash.com/photo-1690489874296-ea89dd0ba3f3?w=300", category: "Electronics" },
// { id: 2, name: "MacBook Air", price: 1299, image: "https://images.unsplash.com/photo-1517336714731-489689fd1ca8?w=300", category: "Electronics" },
// { id: 3, name: "Nike Air Max", price: 129, image: "https://images.unsplash.com/photo-1542291026-7eec264c27ff?w=300", category: "Clothing" },
// { id: 4, name: "Adidas Ultraboost", price: 189, image: "https://images.unsplash.com/photo-1549298916-b41d501d3772?w=300", category: "Clothing" },
// { id: 5, name: "Coffee Maker", price: 79, image: "https://images.unsplash.com/photo-1495474472287-4d71bcdd2085?w=300", category: "Home" },
// { id: 6, name: "Yoga Mat", price: 39, image: "https://images.unsplash.com/photo-1588854337236-7947b26e6a62?w=300", category: "Sports" }
// ];

// function App() {
// const [cartCount, setCartCount] = useState(3);
// const [isModalOpen, setIsModalOpen] = useState(false);
// const [searchTerm, setSearchTerm] = useState("");
// const [filters, setFilters] = useState([]);
// const [email, setEmail] = useState("");

// const categories = ["Electronics", "Clothing", "Home", "Sports"];
// const carouselImages = [
// "https://images.unsplash.com/photo-1523275335684-37898b6baf30?w=1200",
// "https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=1200",
// "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=1200"
// ];

// const filteredProducts = products.filter(product =>
// product.name.toLowerCase().includes(searchTerm.toLowerCase()) &&
// (filters.length === 0 || filters.includes(product.category))
// );

// return (
// <div className="min-h-screen bg-gray-50">
// {/* Navbar */}
// <Navbar cartCount={cartCount} />

// <main className="max-w-7xl mx-auto px-4 py-12">
// {/* Hero Carousel */}
// <motion.div initial={{ opacity: 0, y: 20 }} animate={{ opacity: 1, y: 0 }} className="mb-12">
// <Carousel images={carouselImages} />
// </motion.div>

// {/* Search + Filters Row */}
// <div className="flex flex-col lg:flex-row gap-6 mb-12">
// <SearchBar onSearch={setSearchTerm} />
// <FilterOptions categories={categories} onFilterChange={setFilters} />
// </div>

// {/* Banner Cards */}
// <div className="grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12">
// <BannerCard
// title="Summer Sale 50% OFF"
// subtitle="Limited time offer on all electronics"
// ctaText="Shop Electronics"
// image="https://images.unsplash.com/photo-1523275335684-37898b6baf30?w=400"
// onClick={() => setFilters(["Electronics"])}
// />
// <BannerCard
// title="Free Shipping"
// subtitle="On orders over $50"
// ctaText="Learn More"
// image="https://images.unsplash.com/photo-1441986300917-64674bd600d8?w=400"
// onClick={() => alert("Free shipping on orders over $50!")}
// />
// <BannerCard
// title="New Arrivals"
// subtitle="Check out latest products"
// ctaText="Explore Now"
// image="https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400"
// onClick={() => setFilters([])}
// />
// </div>

// {/* Featured Products */}
// <section>
// <h2 className="text-3xl font-bold text-gray-900 mb-8">Featured Products</h2>
// <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
// {filteredProducts.map(product => (
// <ProductCard key={product.id} product={product} />
// ))}
// </div>
// </section>

// {/* Newsletter Signup */}
// <motion.section
// initial={{ opacity: 0 }}
// whileInView={{ opacity: 1 }}
// className="mt-20 p-8 bg-white rounded-2xl shadow-xl"
// >
// <h3 className="text-2xl font-bold text-center mb-6">Stay Updated</h3>
// <div className="flex flex-col sm:flex-row gap-4 max-w-md mx-auto">
// <Input
// label=""
// type="email"
// placeholder="Enter your email"
// value={email}
// onChange={(e) => setEmail(e.target.value)}
// />
// <Button size="lg" onClick={() => alert("Subscribed!")}>Subscribe</Button>
// </div>
// </motion.section>

// {/* Bento Grid Demo */}
// <section className="mt-20">
// <h3 className="text-2xl font-bold mb-8">Dashboard Preview</h3>
// <BentoGrid />
// </section>

// {/* Demo Modal Trigger */}
// <div className="mt-12 text-center">
// <Button
// size="lg"
// onClick={() => setIsModalOpen(true)}
// className="bg-gradient-to-r from-purple-600 to-blue-600 text-white"
// >
// Quick Product View
// </Button>
// </div>
// </main>

// {/* Modal */}
// <Modal
// isOpen={isModalOpen}
// onClose={() => setIsModalOpen(false)}
// title="iPhone 15 Pro - Quick View"
// >
// <div className="space-y-4">
// <img src="https://images.unsplash.com/photo-1690489874296-ea89dd0ba3f3?w=400" alt="iPhone" className="w-full h-48 object-cover rounded-lg" />
// <h3 className="text-xl font-bold">$999</h3>
// <p className="text-gray-600">Latest iPhone with A17 Pro chip and titanium design.</p>
// <div className="flex gap-3 pt-4">
// <Button className="flex-1">Add to Cart</Button>
// <Button variant="outline" className="flex-1">View Details</Button>
// </div>
// </div>
// </Modal>

// {/* Footer */}
// <Footer />
// </div>
// );
// }

// export default App;

71 changes: 71 additions & 0 deletions frontend/src/Pages/LandingPage.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
import React from "react";
import { motion } from "framer-motion";
import Navbar from "../reusableComponents/Navbar";
import Carousel from "../reusableComponents/CarouselSlider";
import ListCards from "../reusableComponents/ListCards";
import Footer from "../reusableComponents/Footer";
import ProductCard from "../reusableComponents/ProductCard";
import FeatureList from "../reusableComponents/FeaturesList";
import TechnicianCard from "../reusableComponents/TechnicianCard";
import BentoGrid from "../reusableComponents/BentoGrid";
import BannerCard from "../reusableComponents/BannerCard";

const LandingPage = () => {
return (
<div className="min-h-screen bg-gray-50">
<Navbar cartCount={3} />

{/* Carousel */}
<motion.div
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
className="mb-8 sm:mb-12"
>
<Carousel />
</motion.div>

<ListCards />

{/* Featured Products */}
<section className="py-12 sm:py-16 bg-white">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<motion.h2
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="text-3xl md:text-4xl font-bold text-center text-gray-900 mb-10 sm:mb-14"
>
Featured Products
</motion.h2>
<ProductCard /> {/* Now renders all featured products internally */}
</div>
</section>

{/* Service Features */}
<section className="bg-gray-50">
<FeatureList />
</section>

{/* Technicians Section */}
<section className="py-12 sm:py-16 bg-white">
<div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<motion.h2
initial={{ opacity: 0, y: 20 }}
whileInView={{ opacity: 1, y: 0 }}
transition={{ duration: 0.6 }}
className="text-3xl md:text-4xl font-bold text-center text-gray-900 mb-10 sm:mb-14"
>
Our Top Skilled Technicians
</motion.h2>
<TechnicianCard /> {/* Now renders all technicians internally */}
</div>
</section>

<BentoGrid />
<BannerCard />
<Footer />
</div>
);
};

export default LandingPage;
9 changes: 9 additions & 0 deletions frontend/src/Pages/ProductsDetails.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import React from 'react'

const ProductsDetails = () => {
return (
<div>ProductsDetails</div>
)
}

export default ProductsDetails
Empty file added frontend/src/Pages/ProductsPage.jsx
View file
Open in desktop
Empty file.
Loading