Skip to content

Commit 2ec9d62

Browse files
DinoxhDinoxh
committed
merge issues fixed
1 parent f79a5cc commit 2ec9d62

4 files changed

Lines changed: 167 additions & 388 deletions

File tree

‎my-app/src/pages/App.jsx‎

Lines changed: 9 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,9 @@ import React from 'react';
22
import { SidebarPresenter } from '../presenters/SidebarPresenter.jsx';
33
import { SearchbarPresenter } from '../presenters/SearchbarPresenter.jsx';
44
import { ListViewPresenter } from '../presenters/ListViewPresenter.jsx';
5-
import { model } from '/src/model.js';
65
import { Routes, Route } from 'react-router-dom';
7-
import { SidebarPresenter } from "../presenters/SidebarPresenter.jsx";
8-
import { SearchbarPresenter } from "../presenters/SearchbarPresenter.jsx";
9-
import { ListViewPresenter } from '../presenters/ListViewPresenter.jsx';
10-
import SharedView from '../pages/SharedView.jsx';
6+
import SharedView from '../pages/SharedView.jsx';
7+
import { model } from '/src/model.js';
118

129
function MainAppLayout({ model }) {
1310
return (
@@ -20,32 +17,20 @@ function MainAppLayout({ model }) {
2017
<SearchbarPresenter model={model} />
2118
</div>
2219
<div className="flex-auto border bg-[#121212] relative">
23-
<div className="flex overflow-hidden h-screen w-screen">
24-
<div className="flex-auto w-40% h-full bg-gradient-to-t from-[#4f3646] to-[#6747c0]">
25-
<SidebarPresenter model={model} />
26-
</div>
27-
<div className="w-3/4 h-full flex flex-col">
28-
<div className="bg-gradient-to-t from-[#6246a8] to-[#6747c0] text-white" style={{color: "red"}}>
29-
<SearchbarPresenter model={model} />
30-
</div>
31-
<div className="flex-auto border bg-[#121212]">
3220
<ListViewPresenter model={model} />
3321
</div>
3422
</div>
3523
</div>
3624
);
3725
}
3826

39-
export default App;
4027
function App({ model }) {
41-
//return (
42-
//<Routes>
43-
// <Route path="/" element={<MainAppLayout model={model} />} />
44-
// <Route path="/share" element={<SharedView />} />
45-
//</Routes>
46-
return <MainAppLayout model={model} />;
47-
//);
28+
return (
29+
<Routes>
30+
<Route path="/" element={<MainAppLayout model={model} />} />
31+
<Route path="/share" element={<SharedView model={model} />} />
32+
</Routes>
33+
);
4834
}
4935

50-
export default App;
51-
36+
export default App;

‎my-app/src/views/Components/CoursePagePopup.jsx‎

Lines changed: 16 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -1,118 +1,14 @@
11
import React, { useEffect, useRef } from 'react';
22

33
function CoursePagePopup({
4-
favouriteCourses,
5-
handleFavouriteClick,
6-
isOpen,
7-
onClose,
8-
course,
9-
prerequisiteTree,
10-
reviewPresenter,
11-
}) {
12-
const treeRef = useRef(null);
13-
14-
useEffect(() => {
15-
const handleKeyDown = (event) => {
16-
if (event.key === 'Escape') {
17-
onClose();
18-
}
19-
};
20-
if (isOpen) {
21-
window.addEventListener('keydown', handleKeyDown);
22-
}
23-
return () => {
24-
window.removeEventListener('keydown', handleKeyDown);
25-
};
26-
}, [isOpen, onClose]);
27-
28-
const handleTreeClick = () => {
29-
if (treeRef.current) {
30-
treeRef.current.focus();
31-
}
32-
};
33-
34-
if (!isOpen || !course) return null;
35-
36-
return (
37-
<div
38-
className="fixed backdrop-blur-sm inset-0 bg-transparent flex justify-end z-50"
39-
onClick={onClose}
40-
>
41-
<div
42-
className="bg-indigo-300/75 backdrop-blur-lg h-full w-3/4 flex flex-col overflow-auto"
43-
onClick={(e) => e.stopPropagation()}
44-
>
45-
<div className="flex-1">
46-
<div className="px-10 py-10 md:px-20 md:py-16 text-slate-900 space-y-12 font-sans">
47-
{/* Course Title Section */}
48-
<div>
49-
<h2 className="text-5xl font-extrabold text-[#2e2e4f]">
50-
<span className="text-violet-700">{course.code}</span> - {course.name}
51-
<span className="ml-4 text-lg text-violet-700 whitespace-nowrap">
52-
({course.credits} Credits)
53-
</span>
54-
</h2>
55-
<div className="my-6 h-1.5 w-full bg-violet-500"></div>
56-
</div>
57-
<div>
58-
<button
59-
className="text-yellow-100 bg-yellow-400 cursor-pointer"
60-
onClick={(e) => {
61-
e.stopPropagation();
62-
handleFavouriteClick(course);
63-
}}
64-
>
65-
{favouriteCourses.some((fav) => fav.code === course.code)
66-
? 'Remove from Favourites'
67-
: 'Add to Favourites'}
68-
</button>
69-
</div>
70-
{/* Description Section */}
71-
<div>
72-
<h3 className="text-2xl font-bold text-[#2e2e4f] mb-0.5">Course Description</h3>
73-
<div className="mb-3 h-0.5 w-full bg-violet-500"></div>
74-
<div
75-
className="text-lg leading-8 text-[#2e2e4f] font-semibold tracking-wide prose prose-slate max-w-full"
76-
dangerouslySetInnerHTML={{ __html: course.description }}
77-
/>
78-
</div>
79-
{/* Prerequisite Graph Tree Section */}
80-
<div>
81-
<h3 className="text-2xl font-semibold text-[#2e2e4f] mb-0.5">Prerequisite Graph Tree</h3>
82-
<div className="mb-4 h-0.5 w-full bg-violet-500"></div>
83-
<div
84-
className="bg-indigo-300/50 outline-none focus:outline-none focus:ring-2 focus:ring-violet-600 rounded-lg transition-shadow"
85-
ref={treeRef}
86-
onClick={handleTreeClick}
87-
tabIndex={0}
88-
>
89-
{prerequisiteTree}
90-
</div>
91-
</div>
92-
{/* Reviews Section (optional) */}
93-
{reviewPresenter && (
94-
<div>
95-
<h3 className="text-2xl font-semibold text-[#2e2e4f] mb-0.5">Reviews</h3>
96-
<div className="mb-4 h-0.5 w-full bg-violet-500"></div>
97-
{reviewPresenter}
98-
</div>
99-
)}
100-
</div>
101-
</div>
102-
<button onClick={onClose} className="px-4 py-2 bg-violet-500 text-white">
103-
Close
104-
</button>
105-
</div>
106-
</div>
107-
);
108-
favouriteCourses,
109-
handleFavouriteClick,
110-
isOpen,
111-
onClose,
112-
course,
113-
prerequisiteTree,
114-
reviewPresenter,
115-
}) {
4+
favouriteCourses,
5+
handleFavouriteClick,
6+
isOpen,
7+
onClose,
8+
course,
9+
prerequisiteTree,
10+
reviewPresenter,
11+
}) {
11612
const treeRef = useRef(null);
11713

11814
useEffect(() => {
@@ -153,20 +49,20 @@ function CoursePagePopup({
15349
<h2 className="text-5xl font-extrabold text-[#2e2e4f]">
15450
<span className="text-violet-700">{course.code}</span> - {course.name}
15551
<span className="ml-4 text-lg text-violet-700 whitespace-nowrap">
156-
({course.credits} Credits)
157-
</span>
52+
({course.credits} Credits)
53+
</span>
15854
</h2>
15955
<div className="my-6 h-1.5 w-full bg-violet-500"></div>
16056
</div>
16157
<div>
16258
<button
16359
className={`inline-flex items-center px-4 py-2 gap-2 rounded-lg
164-
transition-all duration-300 ease-in-out
165-
font-semibold text-sm shadow-sm
166-
${favouriteCourses.some((fav) => fav.code === course.code)
167-
? 'bg-yellow-400 /90 hover:bg-yellow-500/90 border-2 border-yellow-600 hover:border-yellow-700 text-yellow-900'
168-
: 'bg-yellow-200/90 hover:bg-yellow-300 border-2 border-yellow-400 hover:border-yellow-500 text-yellow-600 hover:text-yellow-700'
169-
}`}
60+
transition-all duration-300 ease-in-out
61+
font-semibold text-sm shadow-sm
62+
${favouriteCourses.some((fav) => fav.code === course.code)
63+
? 'bg-yellow-400 /90 hover:bg-yellow-500/90 border-2 border-yellow-600 hover:border-yellow-700 text-yellow-900'
64+
: 'bg-yellow-200/90 hover:bg-yellow-300 border-2 border-yellow-400 hover:border-yellow-500 text-yellow-600 hover:text-yellow-700'
65+
}`}
17066
onClick={(e) => {
17167
e.stopPropagation();
17268
handleFavouriteClick(course);

‎my-app/src/views/Components/FavouriteDropdown.jsx‎

Lines changed: 65 additions & 95 deletions
Original file line numberDiff line numberDiff line change
@@ -20,95 +20,74 @@ const FavouritesDropdown = observer((props) => {
2020
}
2121

2222
return (
23-
<div className=" mt-2 w-48 bg-white border border-solid border-black rounded-lg z-50 overflow-y-auto max-h-60">
24-
{props.favouriteCourses.length > 0 ? (
25-
props.favouriteCourses.map(course => (
26-
<div
27-
onClick={() => {
28-
console.log('Clicked:', course);
29-
props.setSelectedCourse(course);
30-
props.setIsPopupOpen(true);
31-
}}
32-
key={course.code}
33-
className="p-2 flex justify-between items-center w-full border border-solid border-black ">
34-
<p className="text-black">{course.name}</p>
35-
<button
36-
className="text-red-500 cursor-pointer "
37-
onClick={(e) => {
38-
e.stopPropagation();
39-
props.removeFavourite(course);
40-
}}>
41-
X
42-
<>
43-
<div className="fixed mt-3 w-[32rem] right-4 bg-indigo-300/75 backdrop-blur-lg border border-violet-500 rounded-lg z-20 shadow-lg flex flex-col max-h-[calc(100vh-8rem)]">
44-
{/* Header */}
45-
<div className="sticky top-0 p-3 rounded-t-md bg-violet-500 flex justify-between items-center w-full border-b border-solid border-violet-600 font-semibold">
46-
<p className="text-white w-1/4">Code</p>
47-
<p className="text-white w-1/2">Name</p>
48-
<p className="text-white w-1/4 text-center">Credits</p>
49-
<div className="w-8"></div>
50-
</div>
23+
<div className="fixed mt-3 w-[32rem] right-4 bg-indigo-300/75 backdrop-blur-lg border border-violet-500 rounded-lg z-20 shadow-lg flex flex-col max-h-[calc(100vh-8rem)]">
24+
{/* Header */}
25+
<div className="sticky top-0 p-3 rounded-t-md bg-violet-500 flex justify-between items-center w-full border-b border-solid border-violet-600 font-semibold">
26+
<p className="text-white w-1/4">Code</p>
27+
<p className="text-white w-1/2">Name</p>
28+
<p className="text-white w-1/4 text-center">Credits</p>
29+
<div className="w-8"></div>
30+
</div>
5131

52-
{/* Course list */}
53-
<div className="overflow-y-auto flex-1">
54-
{props.favouriteCourses.length > 0 ? (
55-
props.favouriteCourses.map(course => (
56-
<div
57-
onClick={() => {
58-
props.setSelectedCourse(course);
59-
props.setIsPopupOpen(true);
32+
{/* Course list */}
33+
<div className="overflow-y-auto flex-1">
34+
{props.favouriteCourses.length > 0 ? (
35+
props.favouriteCourses.map(course => (
36+
<div
37+
onClick={() => {
38+
props.setSelectedCourse(course);
39+
props.setIsPopupOpen(true);
40+
}}
41+
key={course.code}
42+
className="p-3 hover:bg-indigo-400/50 cursor-pointer flex justify-between items-center w-full border-b border-solid border-violet-400"
43+
>
44+
<p className="text-violet-700 font-semibold w-1/4">{course.code}</p>
45+
<p className="text-slate-900 font-semibold w-1/2">{course.name}</p>
46+
<p className="text-slate-900 font-semibold w-1/4 text-center">{course.credits} hp</p>
47+
<button
48+
className="text-violet-700 hover:text-red-500 cursor-pointer w-8 text-center font-bold"
49+
onClick={(e) => {
50+
e.stopPropagation();
51+
props.removeFavourite(course);
6052
}}
61-
key={course.code}
62-
className="p-3 hover:bg-indigo-400/50 cursor-pointer flex justify-between items-center w-full border-b border-solid border-violet-400"
6353
>
64-
<p className="text-violet-700 font-semibold w-1/4">{course.code}</p>
65-
<p className="text-slate-900 font-semibold w-1/2">{course.name}</p>
66-
<p className="text-slate-900 font-semibold w-1/4 text-center">{course.credits} hp</p>
67-
<button
68-
className="text-violet-700 hover:text-red-500 cursor-pointer w-8 text-center font-bold"
69-
onClick={(e) => {
70-
e.stopPropagation();
71-
props.removeFavourite(course);
72-
}}
73-
>
74-
×
75-
</button>
76-
</div>
77-
))
78-
) : (
79-
<div className="p-3 text-slate-900 font-semibold">
80-
No favourites
54+
×
55+
</button>
8156
</div>
82-
)}
83-
</div>
84-
85-
{/* Footer */}
86-
<div className="sticky bottom-0 border-t border-solid border-violet-400 bg-indigo-300/75 backdrop-blur-lg">
87-
<div className='p-3 flex justify-between items-center bg-violet-400/30'>
88-
<p className='text-slate-900 font-bold w-1/2'>Total:</p>
89-
<p className='text-slate-900 font-bold w-1/4'></p>
90-
<p className='text-slate-900 font-bold w-1/4 text-center'>{props.totalCredits} hp</p>
91-
<div className="w-8"></div>
57+
))
58+
) : (
59+
<div className="p-3 text-slate-900 font-semibold">
60+
No favourites
9261
</div>
62+
)}
63+
</div>
9364

94-
<div className="flex border-t border-solid border-violet-400">
95-
{props.favouriteCourses.length > 0 && (
96-
<>
97-
<button
98-
onClick={props.removeAllFavourites}
99-
className="w-1/2 p-3 cursor-pointer text-red-600 hover:bg-red-600 hover:text-white border-r border-solid border-violet-400 font-semibold transition-colors"
100-
>
101-
Clear All
102-
</button>
103-
<button
104-
onClick={handleShareCourses}
105-
className="w-1/2 p-3 cursor-pointer text-violet-700 hover:bg-blue-500 hover:text-white flex items-center justify-center gap-2 font-semibold"
106-
>
107-
Share Courses
108-
</button>
109-
</>
110-
)}
111-
</div>
65+
{/* Footer */}
66+
<div className="sticky bottom-0 border-t border-solid border-violet-400 bg-indigo-300/75 backdrop-blur-lg">
67+
<div className='p-3 flex justify-between items-center bg-violet-400/30'>
68+
<p className='text-slate-900 font-bold w-1/2'>Total:</p>
69+
<p className='text-slate-900 font-bold w-1/4'></p>
70+
<p className='text-slate-900 font-bold w-1/4 text-center'>{props.totalCredits} hp</p>
71+
<div className="w-8"></div>
72+
</div>
73+
74+
<div className="flex border-t border-solid border-violet-400">
75+
{props.favouriteCourses.length > 0 && (
76+
<>
77+
<button
78+
onClick={props.removeAllFavourites}
79+
className="w-1/2 p-3 cursor-pointer text-red-600 hover:bg-red-600 hover:text-white border-r border-solid border-violet-400 font-semibold transition-colors"
80+
>
81+
Clear All
82+
</button>
83+
<button
84+
onClick={handleShareCourses}
85+
className="w-1/2 p-3 cursor-pointer text-violet-700 hover:bg-blue-500 hover:text-white flex items-center justify-center gap-2 font-semibold"
86+
>
87+
Share Courses
88+
</button>
89+
</>
90+
)}
11291
</div>
11392
</div>
11493

@@ -132,22 +111,13 @@ const FavouritesDropdown = observer((props) => {
132111
</div>
133112
</div>
134113
)}
114+
115+
{/* Optional course popup */}
135116
<div className="relative z-100">
136117
{props.isPopupOpen && props.popup}
137118
</div>
138-
{props.favouriteCourses.length > 0 && (
139-
<button
140-
onClick={props.removeAllFavourites}
141-
className="mt-2 text-red-500 ">
142-
Clear Favourites
143-
</button>
144-
)}
145119
</div>
146-
147-
{/* Optional course popup */}
148-
{props.isPopupOpen && props.popup}
149-
</>
150120
);
151121
});
152122

153-
export default FavouritesDropdown;
123+
export default FavouritesDropdown;

0 commit comments

Comments
 (0)