{project.title}
+{project.title}
{/* Project showcase */} -
+
{/* Image Slider */}
-
+
{project.images && project.images.length > 0 ? (
<>
@@ -142,7 +287,7 @@ const ProjectDetailPage = () => {
alt="Project image"
className="object-cover"
/>
-
{/* Project info */}
+
-
-
+
) : (
No images available
@@ -175,7 +314,7 @@ const ProjectDetailPage = () => {
- Slider
-
- Image snapshots are below
-
-
+
@@ -206,7 +349,7 @@ const ProjectDetailPage = () => {
{/* Thumbnails */}
-
{project.image_url ? (
{
Cover Image goes here
)}
-
+
From
{project.group}
{project.description}
-
+
{project.likes_count} Likes
-
+
{project.followers_count} Followers
+
{
+ const tabNames = [
+ "overview",
+ "updates",
+ "members",
+ "wanted",
+ "discussions",
+ "contact",
+ "edit",
+ ];
+ const selectedTab = tabNames[index];
+
+ if (selectedTab === "edit") {
+ setIsOpen(true); // Open the dialog
+ setActiveTab("overview"); // Stay on the default tab (e.g., Overview)
+ } else {
+ setActiveTab(selectedTab); // Change tab normally
+ }
+ }}
>
-
+
Overview
Updates
Members
Wanted
Discussions
Contact
+
+ {
+ setIsOpen(true);
+ e.preventDefault();
+ }}
+ >
+ Edit Project
+
+
+
+
-
{project.images &&
project.images.map((image, index) => (
@@ -220,8 +363,8 @@ const ProjectDetailPage = () => {
@@ -231,149 +374,451 @@ const ProjectDetailPage = () => {
{/* Tabs */}
-
- Overview
+Overview
+
Background & More Details About the Project
-
+
- setIsModalOpen(false)}
- >
-
+
- This space will be filled in by the owner -
-{project.description}
- -Edit Project
-
-
-
- Title
- -Description
- -{project.full_description}
-
-
- Updates content will go here -
+
+
+
+ Updates{" "} + (W.I.P) +
+
+
+ Title
+ + {showCommentForm ? ( +
+
+ )}
+
+
+
+
+ + Add your comments here +
+
+
+
+
+
-
-
- Members content will go here -
+
+ {/* Search and Add Member Section */}
+
+
+
+ {/* Members List Section */}
+
+
+
+
+
+
+ Students Working on This Project{" "} + (W.I.P) +
+ +
+ {/* Member 1 */}
+
+
-
-
- {/* "More" Button */} -
- Wanted content will go here -
+
+ {/* Wanted Header */}
+
- + Wanted{" "} + (W.I.P) +
+ {/* Positions Section */} +
+
+
+
+ + Positions Needed for This Project +
+ +
+
+
-
+
-
+ {/* Landing Page Sections */}
+ setShowModal(false)} />}
+
+ );
+}
+
+// Extracted Modal for clarity
+function Modal({ onClose }) {
+ return (
+
- Discussions content will go here -
+
+ {/* Discussions Header */}
+
+
+
+ {/* Comment Form */}
+
+
+ Discussions{" "}
+ (W.I.P)
+
+
+
+ {showCommentForm ? (
+
+
+ )}
+
+ {/* Discussion Posts */}
+
+
+
+
+ + Add your comments here +
+
+
+
+
+
+ {discussions.length > 0 ? (
+ discussions.map((discussion) => (
+
+
+
+ ))
+ ) : (
+
+
+ )}
+
+ {discussion.replies &&
+ discussion.replies.map((reply) => (
+
+
+ ))}
+
+
+ )}
+ + No discussions yet. Start the conversation! +
+ )} +
-
diff --git a/frontend/bitmatch/src/views/LandingPage.jsx b/frontend/bitmatch/src/views/LandingPage.jsx
new file mode 100644
index 0000000..7d97d1a
--- /dev/null
+++ b/frontend/bitmatch/src/views/LandingPage.jsx
@@ -0,0 +1,68 @@
+import React, { useEffect, useState } from "react";
+import { useUser } from "@clerk/clerk-react";
+import { motion } from "framer-motion";
+
+import { HeroSection } from "../components/Landing/HeroSection";
+import { HowItWorks } from "../components/Landing/HowItWorks";
+import { Features } from "../components/Landing/Features";
+import { Button } from "@/components/ui/button";
+
+export default function LandingPage() {
+ const { user } = useUser();
+ const [showModal, setShowModal] = useState(true);
+
+ // Scroll to top on mount
+ useEffect(() => {
+ window.scrollTo({ top: 0, behavior: "smooth" });
+ }, []);
+
+ // Show development modal once per session for signed-in users
+ useEffect(() => {
+ if (user && !sessionStorage.getItem("seenDevelopmentModal")) {
+ setShowModal(true);
+ sessionStorage.setItem("seenDevelopmentModal", "true");
+ }
+ }, [user]);
+
+ return (
+ - Contact content will go here -
+
+
+
+
+ Contact The Owner of This Project{" "} + (W.I.P) +
+Full Name
+ +Email Address
+ +Subject
+ +Description
+ + +
+
+
+
+ );
+}
diff --git a/frontend/bitmatch/src/views/OnboardPage.jsx b/frontend/bitmatch/src/views/OnboardPage.jsx
new file mode 100644
index 0000000..c738e89
--- /dev/null
+++ b/frontend/bitmatch/src/views/OnboardPage.jsx
@@ -0,0 +1,81 @@
+import React, { useState } from "react";
+import { useNavigate } from "react-router-dom";
+import { Button } from "@/components/ui/button";
+import { Input } from "@/components/ui/input";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+
+export default function OnboardPage() {
+ const navigate = useNavigate();
+ const [formData, setFormData] = useState({
+ role: "",
+ interests: "",
+ bio: "",
+ });
+
+ const handleChange = (e) => {
+ const { name, value } = e.target;
+ setFormData((prev) => ({ ...prev, [name]: value }));
+ };
+
+ const handleSubmit = (e) => {
+ e.preventDefault();
+
+ // You can send this data to Supabase, Clerk user metadata, or your backend here
+ console.log("Onboarding data submitted:", formData);
+
+ // Redirect to dashboard or home
+ navigate("/dashboard");
+ };
+
+ return (
+ + 🚧 Heads up! +
++ BitMatch is currently undergoing maintenance, so some features may not + work as expected. +
+ +
+
+ );
+}
diff --git a/frontend/bitmatch/src/views/ProjectListPage.jsx b/frontend/bitmatch/src/views/ProjectListPage.jsx
index da0099f..97aa371 100644
--- a/frontend/bitmatch/src/views/ProjectListPage.jsx
+++ b/frontend/bitmatch/src/views/ProjectListPage.jsx
@@ -1,6 +1,7 @@
import { useEffect, useState } from "react";
import { ChevronRight, Plus } from "lucide-react";
import { Button } from "@/components/ui/button";
+import { Link } from "react-router-dom";
import ProjectCardLarge from "@/components/project/ProjectCardLarge";
const SERVER_HOST = import.meta.env.VITE_SERVER_HOST;
import axios from "axios";
@@ -51,21 +52,15 @@ export default function ProjectListPage() {
+
+ Work in Progress!
++ This is just a placeholder for the onboarding process. Nothing works right now. +
+ + +Public Projects List
- + + +- {/* "More" Button */} -
-
-
-
{/* Project Grid */}
{projects.map((project, index) => (
diff --git a/frontend/bitmatch/src/views/SignInPage.jsx b/frontend/bitmatch/src/views/SignInPage.jsx
new file mode 100644
index 0000000..7aec7bc
--- /dev/null
+++ b/frontend/bitmatch/src/views/SignInPage.jsx
@@ -0,0 +1,24 @@
+import React from "react";
+import { SignIn } from "@clerk/clerk-react";
+
+export default function SignInPage() {
+ return (
+
+
+ );
+}
diff --git a/frontend/bitmatch/src/views/SignUpPage.jsx b/frontend/bitmatch/src/views/SignUpPage.jsx
new file mode 100644
index 0000000..94c7ae5
--- /dev/null
+++ b/frontend/bitmatch/src/views/SignUpPage.jsx
@@ -0,0 +1,24 @@
+import React from "react";
+import { SignUp } from "@clerk/clerk-react";
+
+export default function SignUpPage() {
+ return (
+
+
+
+
+ );
+}
+
+