From f70fc2ef94226a0faca598ca5016aecc696d618b Mon Sep 17 00:00:00 2001 From: Tapesh Date: Tue, 28 May 2024 22:32:26 +0530 Subject: [PATCH 01/12] added dark colors in docgrid --- client/src/components/DocGrid/DocGrid.jsx | 489 +++++++++++----------- 1 file changed, 249 insertions(+), 240 deletions(-) diff --git a/client/src/components/DocGrid/DocGrid.jsx b/client/src/components/DocGrid/DocGrid.jsx index d0e018a..6aed72f 100644 --- a/client/src/components/DocGrid/DocGrid.jsx +++ b/client/src/components/DocGrid/DocGrid.jsx @@ -40,7 +40,7 @@ const DocGrid = () => { const [searchInput, setSearchInput] = useState(""); const [activeTab, setActiveTab] = useState("All"); const { user, setUser, getUser } = useContext(UserContext); - const langKey=useSelector((store)=>store.config.lang) + const langKey = useSelector((store) => store.config.lang); console.log(user); @@ -126,12 +126,12 @@ const DocGrid = () => { if (notes.length == 0 && activeTab == "All") { return ( -
+
setSearchInput(e.target.value)} @@ -145,7 +145,7 @@ const DocGrid = () => { }} />
-

+

{lang[langKey].NoResultsFound}

@@ -164,262 +164,271 @@ const DocGrid = () => { } return ( - <> -
-
-
-
- setSearchInput(e.target.value)} - onKeyPress={(e) => { - if (e.key === "Enter") { - const searchTerm = e.target.value; - window.location.href = `?search=${encodeURIComponent( - searchTerm - )}`; - } - }} - /> - -
- - - -
-
-
{ - setActiveTab("All"); - }} - className={`flex-1 border-2 ${ - activeTab === "All" - ? "bg-indigo-600 text-white" - : "border-black" - } rounded-lg p-2 `} - > -

- {lang[langKey].AllNotes} -

-
-
{ - setActiveTab("BookMarked"); - }} - className={`flex-1 border-2 ${ - activeTab === "BookMarked" - ? "bg-indigo-600 text-white" - : "border-black" - } rounded-lg p-2 `} - > -

- {lang[langKey].BookMarkedNotes} -

-
-
- -

- {lang[langKey].FindYourNotesHere} + } + }} + /> + +

+ + + +
+
+
{ + setActiveTab("All"); + }} + className={`flex-1 border-2 ${ + activeTab === "All" + ? "bg-indigo-600 text-white" + : "border-black dark:border-white" + } rounded-lg p-2 `} + > +

+ {lang[langKey].AllNotes} +

+
+
{ + setActiveTab("BookMarked"); + }} + className={`flex-1 border-2 ${ + activeTab === "BookMarked" + ? "bg-indigo-600 text-white" + : "border-black dark:border-white" + } rounded-lg p-2 `} + > +

+ {lang[langKey].BookMarkedNotes}

+
+
-
- {notes.map((note, index) => ( -
handleNoteClick(note)} - > -
-
- -
-
-

-

{note.title}

-

-

- {note.subject.subjectName} -

-
-
- {note.likes > 0 ? ( -

- - {note.likes} -

- ) : ( -

- 0 -

- )} -
-
+

+ {lang[langKey].FindYourNotesHere} +

+ +
+ {notes.map((note, index) => ( +
handleNoteClick(note)} + > +
+
+ +
+
+

+

{note.title}

+

+

+ {note.subject.subjectName} +

+
+
+ {note.likes > 0 ? ( +

+ + {note.likes} +

+ ) : ( +

+ 0 +

+ )}
- ))} +
- - {activeTab !== "All" && notes.length === 0 ? ( -

- {lang[langKey].NoBookMarkedNotes} -

- ) : ( - "" - )} -
+ ))}
- - + + {activeTab !== "All" && notes.length === 0 ? ( +

+ {lang[langKey].NoBookMarkedNotes} +

+ ) : ( + "" + )} +
+
+ + + +
+ + +
+
-
- + +
+ -
-
- - -
- - -
-
- {note_.thumbnail} -
-
-
-

- {note_.title} -

-

- {lang[langKey].Productinformation} -

- -

- {lang[langKey].Subject}:{" "} - {note_.subject?.subjectName} -

+

+ {note_.title} +

+

+ {lang[langKey].Productinformation} +

-

- {lang[langKey].Description}:{" "} - {note_.description} -

+

+ + {lang[langKey].Subject}: + {" "} + {note_.subject?.subjectName} +

-

- {lang[langKey].Year}:{" "} - {note_.year} -

+

+ + {lang[langKey].Description}: + {" "} + {note_.description} +

-

- {lang[langKey].Course}:{" "} - {note_.course} -

+

+ + {lang[langKey].Year}: + {" "} + {note_.year} +

-

- {lang[langKey].Likes}:{" "} - {note_.likes} -

-
-
- -
-
- {user?.bookMarkedNotes?.includes(note_._id) ? ( - handleBookMark(note_._id)} - className="text-2xl cursor-pointer" - /> - ) : ( - handleBookMark(note_._id)} - className="text-2xl cursor-pointer" - /> - )} -
-
-
+

+ + {lang[langKey].Course}: + {" "} + {note_.course} +

-
-

- {lang[langKey].Productoptions} -

-

- Uploaded by {" "} - - @{note_.author?.username} - -

- - {lang[langKey].Download} - -
+

+ + {lang[langKey].Likes}: + {" "} + {note_.likes} +

+
+
+ +
+
+ {user?.bookMarkedNotes?.includes(note_._id) ? ( + handleBookMark(note_._id)} + className="text-2xl cursor-pointer" + /> + ) : ( + handleBookMark(note_._id)} + className="text-2xl cursor-pointer" + /> + )} +
-
+ + +
+

+ {lang[langKey].Productoptions} +

+

+ {lang[langKey].UploadedBy}{" "} + + @{note_.author?.username} + +

+ + {lang[langKey].Download} + +
- - -
-
-
- - +
+ + + + + + + + + ); }; From 95ca544784f0ab839ed7fdff861aa608fb83ab7d Mon Sep 17 00:00:00 2001 From: Tapesh Date: Tue, 28 May 2024 22:35:00 +0530 Subject: [PATCH 02/12] added dark mode support in like button --- client/src/components/LikeButton/LikeButton.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/client/src/components/LikeButton/LikeButton.jsx b/client/src/components/LikeButton/LikeButton.jsx index 4f40525..fa709d1 100644 --- a/client/src/components/LikeButton/LikeButton.jsx +++ b/client/src/components/LikeButton/LikeButton.jsx @@ -1,8 +1,8 @@ -// LikeButton.js import React, { useState, useEffect } from "react"; import axios from "axios"; import Heart from "react-heart"; import { Bounce, toast } from "react-toastify"; +import 'react-toastify/dist/ReactToastify.css'; const LikeButton = ({ noteId }) => { const [isLiked, setIsLiked] = useState(false); @@ -53,7 +53,7 @@ const LikeButton = ({ noteId }) => { pauseOnHover: false, draggable: false, progress: undefined, - theme: "light", + theme: document.documentElement.classList.contains('dark') ? "dark" : "light", transition: Bounce, }); } catch (error) { @@ -84,7 +84,7 @@ const LikeButton = ({ noteId }) => { pauseOnHover: false, draggable: false, progress: undefined, - theme: "light", + theme: document.documentElement.classList.contains('dark') ? "dark" : "light", transition: Bounce, }); } catch (error) { From 29c4f494391885d637200028833ff7b0251dbbbd Mon Sep 17 00:00:00 2001 From: Tapesh Date: Tue, 28 May 2024 22:56:53 +0530 Subject: [PATCH 03/12] added dark mode support in leaderboard table --- .../LeaderBoardTable/LeaderBoardTable.jsx | 60 +++++++++---------- 1 file changed, 30 insertions(+), 30 deletions(-) diff --git a/client/src/components/LeaderBoardTable/LeaderBoardTable.jsx b/client/src/components/LeaderBoardTable/LeaderBoardTable.jsx index 8426d09..684435f 100644 --- a/client/src/components/LeaderBoardTable/LeaderBoardTable.jsx +++ b/client/src/components/LeaderBoardTable/LeaderBoardTable.jsx @@ -6,23 +6,23 @@ import { useSelector } from "react-redux"; const LeaderBoardTable = () => { const [leaderData, setLeaderData] = useState([]); const [currentPage, setCurrentPage] = useState(1); - const [itemsPerPage, setItemsPerPage] = useState(10); - const langKey=useSelector((store)=>store.config.lang) + const [itemsPerPage] = useState(10); + const langKey = useSelector((store) => store.config.lang); - const fetchLeaderData = async () => { - try { - const response = await axios.get( - `${import.meta.env.VITE_BASE_URL}/user/leaderboard` - ); - if (response.status === 200) { - setLeaderData(response.data); + useEffect(() => { + const fetchLeaderData = async () => { + try { + const response = await axios.get( + `${import.meta.env.VITE_BASE_URL}/user/leaderboard` + ); + if (response.status === 200) { + setLeaderData(response.data); + } + } catch (error) { + console.error("Error fetching leaderboard data:", error); } - } catch (error) { - console.log(error); - } - }; + }; - useEffect(() => { fetchLeaderData(); }, []); @@ -36,7 +36,7 @@ const LeaderBoardTable = () => {
- + {lang[langKey].Page} {currentPage} {lang[langKey].of} {totalPages}