Skip to content
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

215 cull all unused code #263

Closed
wants to merge 6 commits into from
Closed

215 cull all unused code #263

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
8f86361
removed all unused components
John-Moore-UOA Sep 18, 2024
b2c02f5
removed json data in frontend
John-Moore-UOA Sep 18, 2024
81675dd
commenting on axios use
John-Moore-UOA Sep 18, 2024
f11d610
removed admin and starter code
John-Moore-UOA Sep 18, 2024
ef72662
styling
John-Moore-UOA Sep 18, 2024
2fe92b5
Merge branch 'main' into 215-cull-all-unused-code
John-Moore-UOA Sep 23, 2024
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
38 changes: 17 additions & 21 deletions web/src/App.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,42 +1,38 @@
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { createBrowserRouter, RouterProvider } from 'react-router-dom';
import { useState } from 'react';
import MainMenu from '@pages/MainMenu';
import NotFound from '@pages/NotFound';
import TestingComponent from '@components/TestComponent';
// import Signup from '@pages/Signup';
// import SignupAdditional from '@pages/SignupAdditional';
// import SignupEmergency from '@pages/SignupEmergency';
import SignUpPage from '@pages/SignUpPage';
import RegisterModalErrorContextProvider from './context/RegisterModalErrorContextProvider';
import RegisterErrorModal from '@components/register/RegisterErrorModal';
import Dashboard from '@pages/Dashboard';

import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { createBrowserRouter, RouterProvider } from "react-router-dom";
import { useState } from "react";
import MainMenu from "@pages/MainMenu";
import NotFound from "@pages/NotFound";
import TestingComponent from "@components/TestComponent";
import SignUpPage from "@pages/SignUpPage";
import RegisterModalErrorContextProvider from "./context/RegisterModalErrorContextProvider";
import RegisterErrorModal from "@components/register/RegisterErrorModal";
import Dashboard from "@pages/Dashboard";

const router = createBrowserRouter([
{
path: '/',
path: "/",
element: <MainMenu />,
},
{
path: '*',
path: "*",
element: <NotFound />,
},
{
path: 'register',
path: "register",
element: (
<RegisterModalErrorContextProvider>
<RegisterErrorModal />
<SignUpPage />
<SignUpPage />
</RegisterModalErrorContextProvider>
),
),
},
{
path: '/testing',
path: "/testing",
element: <TestingComponent />,
},
{
path: '/dashboard', // can probably change this to /dashboard/community or something idk, im not sure how we are handling changing tabs within the dashboard
path: "/dashboard", // can probably change this to /dashboard/community or something idk, im not sure how we are handling changing tabs within the dashboard
element: <Dashboard />,
},
]);
Expand Down
99 changes: 61 additions & 38 deletions web/src/components/Dashboard/DashboardCommunity/CommunityGallery.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,61 +1,84 @@
import axios from 'axios';
import { useState, useEffect } from 'react';
import CommunityGalleryCard from '../dashboardCommunity/CommunityGalleryCard';
import axios from "axios";
import { useState, useEffect } from "react";
import CommunityGalleryCard from "../dashboardCommunity/CommunityGalleryCard";

interface GalleryData {
title: string;
image: string;
}

const CommunityGallery = ({event, location}: {event: string, location: string}) => {

// TEMPORARY DATA, we should be getting the profile data from somewhere
const name = 'John Doe';
const hours = '14';
const [data, setData] = useState<GalleryData[]>([
const CommunityGallery = ({
event,
location,
}: {
event: string;
location: string;
}) => {
// TEMPORARY DATA, we should be getting the profile data from somewhere
const name = "John Doe";
const hours = "14";
const [data, setData] = useState<GalleryData[]>([
{
title: "Relay For Life",
image: "/assets/EventHighlights/Events/RelayForLife/imgB.png"
title: "Relay For Life",
image: "/assets/EventHighlights/Events/RelayForLife/imgB.png",
},
{
title:"Volunteers Day",
image: "/assets/EventHighlights/Events/VolunteersDay/imgB.png"
title: "Volunteers Day",
image: "/assets/EventHighlights/Events/VolunteersDay/imgB.png",
},
{
title:"Blind Low Vision",
image: "/assets/EventHighlights/Events/BlindLowVision/imgB.png"
title: "Blind Low Vision",
image: "/assets/EventHighlights/Events/BlindLowVision/imgB.png",
},
{
title: "Pub Quiz",
image: "/assets/EventHighlights/Events/PubQuiz/imgB.png"
}
]);
image: "/assets/EventHighlights/Events/PubQuiz/imgB.png",
},
]);

useEffect(() => {
// TODO: replace this axios call with a utility function within utils/---.ts
useEffect(() => {
// Fetch gallery data
axios.get('http://localhost:3000/api/homepage/gallery')
axios
.get("http://localhost:3000/api/homepage/gallery")
.then((res) => {
setData(res.data);
})
.catch((err) => {
console.log(err);
});
}
, []);
}, []);


return (
<div className='bg-white rounded-3xl py-10 px-[4%] w-full text-subheading text-black shadow-lg max-[1887px]:px-[6%] max-[1770px]:px-[3%] max-[1510px]:px-[8%]'>
<p>People you may know from {event} at {location}</p>
<div className='flex gap-x-[5px] justify-between gap-y-2 flex-wrap '>
{/* hardcoded 4 people, this shoulded be mapped with however many people in the event?? */}
<CommunityGalleryCard name={name} hours={hours} profileImgLink={data[0].image}/>
<CommunityGalleryCard name={name} hours={hours} profileImgLink={data[1].image}/>
<CommunityGalleryCard name={name} hours={hours} profileImgLink={data[2].image}/>
<CommunityGalleryCard name={name} hours={hours} profileImgLink={data[3].image}/>
</div>
</div>
);
}

export default CommunityGallery;
return (
<div className="bg-white rounded-3xl py-10 px-[4%] w-full text-subheading text-black shadow-lg max-[1887px]:px-[6%] max-[1770px]:px-[3%] max-[1510px]:px-[8%]">
<p>
People you may know from {event} at {location}
</p>
<div className="flex gap-x-[5px] justify-between gap-y-2 flex-wrap ">
{/* hardcoded 4 people, this shoulded be mapped with however many people in the event?? */}
<CommunityGalleryCard
name={name}
hours={hours}
profileImgLink={data[0].image}
/>
<CommunityGalleryCard
name={name}
hours={hours}
profileImgLink={data[1].image}
/>
<CommunityGalleryCard
name={name}
hours={hours}
profileImgLink={data[2].image}
/>
<CommunityGalleryCard
name={name}
hours={hours}
profileImgLink={data[3].image}
/>
</div>
</div>
);
};

export default CommunityGallery;
94 changes: 55 additions & 39 deletions web/src/components/Dashboard/DashboardCommunity/CommunityGalleryCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,43 +6,59 @@ interface CommunityGalleryCardProps {
profileImgLink: string;
}

const CommunityGalleryCard = ({name, hours, profileImgLink}: CommunityGalleryCardProps) => {

const handleAddFriend = () => {
console.log('add friend');
};

return (
<div className="w-[300px] h-[540px] rounded-2xl relative max-[1887px]:w-[270px] max-[1887px]:h-[510px] max-[1755px]:w-[300px]">
<div className="bg-primary h-[23%] rounded-t-2xl">
</div>

<div className="bg-lightGrey absolute w-[150px] top-[7%] right-[25%] rounded-full max-[1887px]:w-[125px] max-[1887px]:right-[26%] max-[1755px]:right-[28%]">
<img src={profileImgLink} alt="" className="w-[100%] object-cover aspect-square rounded-full"/>
</div>

<div className="border-b-[1px] border-x-[1px] rounded-b-2xl border-lightGrey2 h-[70%] flex flex-col items-center">
<p className="text-[25px] mt-[5.8rem] mb-0 text-black max-[1887px]:mt-[4rem]">{name}</p>
<p className="text-[40px] my-1 text-black">{hours}</p>
<p className="text-body text-m text-lightGrey2 mb-6">hours</p>

<div className="flex items-center w-[70%] justify-between">
<div className="bg-lightGrey w-[40px] rounded-full flex-shrink-0">
<img src={profileImgLink} alt="" className="aspect-square rounded-full"/>
</div>
{/* THIS DOES NOT HANDLE MUTUALS, IDK HOW WE ARE GONNA DO THAT SO I HAVENT MADE PROPS FOR THE BELOW STUFF */}
<p className="text-body text-sm text-lightGrey2 ml-4 mb-0 mr-0">jaquallelina and 12 other mutual friends</p>
</div>

<button className="bg-primary text-body text-xl rounded-full py-2 px-9 mt-5 hover:bg-primary-dark hover:text-[#f7f7fb] active:bg-[#264268] active:translate-y-0.5 transition-all ease-in-out duration-100">
<div className="flex items-center gap-2">
<BsFillPersonPlusFill className="inline"/>
<p className="m-0" onClick={ handleAddFriend }>Add Friend</p>
</div>
</button>
</div>
const CommunityGalleryCard = ({
name,
hours,
profileImgLink,
}: CommunityGalleryCardProps) => {
const handleAddFriend = () => {
console.log("add friend");
};

return (
<div className="w-[300px] h-[540px] rounded-2xl relative max-[1887px]:w-[270px] max-[1887px]:h-[510px] max-[1755px]:w-[300px]">
<div className="bg-primary h-[23%] rounded-t-2xl"></div>

<div className="bg-lightGrey absolute w-[150px] top-[7%] right-[25%] rounded-full max-[1887px]:w-[125px] max-[1887px]:right-[26%] max-[1755px]:right-[28%]">
<img
src={profileImgLink}
alt=""
className="w-[100%] object-cover aspect-square rounded-full"
/>
</div>

<div className="border-b-[1px] border-x-[1px] rounded-b-2xl border-lightGrey2 h-[70%] flex flex-col items-center">
<p className="text-[25px] mt-[5.8rem] mb-0 text-black max-[1887px]:mt-[4rem]">
{name}
</p>
<p className="text-[40px] my-1 text-black">{hours}</p>
<p className="text-body text-m text-lightGrey2 mb-6">hours</p>

<div className="flex items-center w-[70%] justify-between">
<div className="bg-lightGrey w-[40px] rounded-full flex-shrink-0">
<img
src={profileImgLink}
alt=""
className="aspect-square rounded-full"
/>
</div>
{/* THIS DOES NOT HANDLE MUTUALS, IDK HOW WE ARE GONNA DO THAT SO I HAVENT MADE PROPS FOR THE BELOW STUFF */}
<p className="text-body text-sm text-lightGrey2 ml-4 mb-0 mr-0">
jaquallelina and 12 other mutual friends
</p>
</div>
);
}

export default CommunityGalleryCard;

<button className="bg-primary text-body text-xl rounded-full py-2 px-9 mt-5 hover:bg-primary-dark hover:text-[#f7f7fb] active:bg-[#264268] active:translate-y-0.5 transition-all ease-in-out duration-100">
<div className="flex items-center gap-2">
<BsFillPersonPlusFill className="inline" />
<p className="m-0" onClick={handleAddFriend}>
Add Friend
</p>
</div>
</button>
</div>
</div>
);
};

export default CommunityGalleryCard;
57 changes: 29 additions & 28 deletions web/src/components/Dashboard/DashboardCommunity/CommunityGalleryWhole.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/*
* So like the purpose of this file is to have a container for every event, then for every event it will have x amount of profile cards shown
*/
*/

import axios from "axios";
import { useState, useEffect } from "react";
Expand All @@ -12,49 +12,50 @@ interface EventData {
}

const CommunityGalleryWhole = () => {
// TEMPORARY DATA passing down events into community gallery vvvvvvvvvvvvvvvvvvvvvvvvvvvvv
const [data, setData] = useState<EventData[]>([
// TEMPORARY DATA passing down events into community gallery vvvvvvvvvvvvvvvvvvvvvvvvvvvvv
const [data, setData] = useState<EventData[]>([
{
title: "Quiz Night",
location: "Uni"
title: "Quiz Night",
location: "Uni",
},
{
title:"Launch Night",
location: "Somewhere"
title: "Launch Night",
location: "Somewhere",
},
{
title:"C",
location: "Somewhere"
title: "C",
location: "Somewhere",
},
{
title: "Beach Cleanup",
location: "Beach"
}
]);
location: "Beach",
},
]);

// TODO: replace this axios call with a utility function within utils/---.ts
useEffect(() => {
// Fetch gallery data
axios.get('http://localhost:3000/api/homepage/highlights')
axios
.get("http://localhost:3000/api/homepage/highlights")
.then((res) => {
setData(res.data);
})
.catch((err) => {
console.log(err);
});
}
, []);
// TEMPORARY ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
}, []);
// TEMPORARY ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^

return (
<div>
{/* passing event data into community gallery*/}
{data.map(( event ) => (
<div className="mb-5">
<CommunityGallery event={event.title} location={event.location}/>
</div>
))}
return (
<div>
{/* passing event data into community gallery*/}
{data.map((event) => (
<div className="mb-5">
<CommunityGallery event={event.title} location={event.location} />
</div>
);
}

export default CommunityGalleryWhole;
))}
</div>
);
};

export default CommunityGalleryWhole;
13 changes: 8 additions & 5 deletions web/src/components/Dashboard/DashboardCommunity/SearchBar.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,12 +1,14 @@
import React, { useState } from 'react';
import { FiSearch } from 'react-icons/fi'; // magnifying glass icon
import React, { useState } from "react";
import { FiSearch } from "react-icons/fi"; // magnifying glass icon

interface SearchBarProps {
placeholder?: string; // Optional placeholder for the search input
}

const SearchBar: React.FC<SearchBarProps> = ({ placeholder = "Search by name" }) => {
const [searchTerm, setSearchTerm] = useState<string>('');
const SearchBar: React.FC<SearchBarProps> = ({
placeholder = "Search by name",
}) => {
const [searchTerm, setSearchTerm] = useState<string>("");

const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
const value = event.target.value;
Expand All @@ -16,7 +18,8 @@ const SearchBar: React.FC<SearchBarProps> = ({ placeholder = "Search by name" })
return (
<div className="w-full max-w-md mx-auto relative">
<div className="relative flex items-center">
<FiSearch className="absolute left-3 text-gray-400" /> {/* Magnifying glass icon */}
<FiSearch className="absolute left-3 text-gray-400" />{" "}
{/* Magnifying glass icon */}
<input
type="text"
placeholder={placeholder}
Expand Down
Loading