From 6c521436adabc468dc5f9dd1e62f93b90d8359eb Mon Sep 17 00:00:00 2001
From: Caio Cabral <ocaiocabral@gmail.com>
Date: Wed, 13 Nov 2024 06:08:58 -0500
Subject: [PATCH] chore adding comments

---
 Client/src/Components/Alert/index.jsx | 4 +++-
 Client/src/Utils/Theme/constants.js   | 5 +++++
 Client/src/Utils/Theme/lightTheme.js  | 9 ++-------
 3 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/Client/src/Components/Alert/index.jsx b/Client/src/Components/Alert/index.jsx
index 116ac5dea..bf941368a 100644
--- a/Client/src/Components/Alert/index.jsx
+++ b/Client/src/Components/Alert/index.jsx
@@ -31,7 +31,9 @@ const icons = {
 
 const Alert = ({ variant, title, body, isToast, hasIcon = true, onClick }) => {
 	const theme = useTheme();
-	/* TODO check if this still works. text bg and border not necessarilly exist. Text becomes contrastText. border becomes contrastText. bg becomes dark */
+	/* TODO 
+	This needs fixing. text bg and border not necessarilly exist. Probably text becomes contrastText. border becomes contrastText. bg becomes dark.
+	Check possible variants, see implementation in light and dark theme, and adjust */
 	const { text, bg, border } = theme.palette[variant];
 	const icon = icons[variant];
 
diff --git a/Client/src/Utils/Theme/constants.js b/Client/src/Utils/Theme/constants.js
index 4fa2292c3..1944da40f 100644
--- a/Client/src/Utils/Theme/constants.js
+++ b/Client/src/Utils/Theme/constants.js
@@ -1,4 +1,9 @@
 const typographyBase = 14;
+
+/* TODO
+Check for px in codebase. All font sizes should be in REM and should live here.
+Rest should be checked on each case
+*/
 const typographyLevels = {
 	base: typographyBase,
 	xs: `${(typographyBase - 4) / 16}rem`,
diff --git a/Client/src/Utils/Theme/lightTheme.js b/Client/src/Utils/Theme/lightTheme.js
index d65146486..e03fd9ee7 100644
--- a/Client/src/Utils/Theme/lightTheme.js
+++ b/Client/src/Utils/Theme/lightTheme.js
@@ -4,13 +4,7 @@ import { colors } from "./constants";
 
 /* 
 TODO
-Next step: check if all here are being used.
-*/
-/* TODO
-
-Check for Hex in code base
-
-Check for px in codebase
+Next step: check if all keys here are being used in the codebase. e.g.: Search codebase for palette.primary; also check for destructuring palette ('= theme.palette')
 */
 
 const {
@@ -111,6 +105,7 @@ const palette = {
 	},
 };
 
+/* TODO I figured out we could have just one theme by passing mode as parameter for theme function. Implement later */
 const lightTheme = createTheme({
 	palette,
 	...baseTheme(palette),