From 5c114e9d4f9c708e40095bc30cc98f7b37b2a77f Mon Sep 17 00:00:00 2001
From: Anthony Weathers <anthonyweathers115@gmail.com>
Date: Fri, 25 Sep 2026 17:31:28 -0700
Subject: [PATCH 1/5] Feature: Added textbox for initial description for new
 tracker in tracker list modal, added info modal for tracker list, and adjust
 infomodal to accept optional initial description if provided

---
 .../EditableModal/EditableInfoModal.jsx       | 10 ++--
 src/components/Warnings/Warnings.jsx          | 16 +++++-
 .../Warnings/modals/WarningTrackerModal.jsx   | 53 +++++++++++++------
 3 files changed, 57 insertions(+), 22 deletions(-)

diff --git a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
index aad4c037f33..3dc393eb256 100644
--- a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
+++ b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
@@ -77,7 +77,7 @@ export class EditableInfoModal extends Component {
 
   // ✅ Centralized: derive modal state from collections + props
   deriveFromCollections = infoCollections => {
-    const { role, areaName, fontSize, isPermissionPage } = this.props;
+    const { role, areaName, fontSize, isPermissionPage, initialInfo } = this.props;
 
     let content = '';
     let visible = '0';
@@ -100,13 +100,16 @@ export class EditableInfoModal extends Component {
       (visible === '2' && role !== 'Volunteer');
 
     const CanEdit = role === 'Owner';
-
+    const contentToDisplay = () => {
+      if (content) return content;
+      return initialInfo ? initialInfo : 'Please input information!';
+    };
     return {
       infoElements: Array.isArray(infoCollections) ? [...infoCollections] : [],
       fetchError: this.props.fetchError,
       loading: this.props.loading,
       infoName: areaName,
-      infoContent: content || 'Please input information!',
+      infoContent: contentToDisplay(),
       visibility: visible,
       CanRead,
       CanEdit,
@@ -365,6 +368,7 @@ EditableInfoModal.propTypes = {
   areaName: PropTypes.string,
   fontSize: PropTypes.number,
   isPermissionPage: PropTypes.bool,
+  initialInfo: PropTypes.string,
   darkMode: PropTypes.bool,
 };
 
diff --git a/src/components/Warnings/Warnings.jsx b/src/components/Warnings/Warnings.jsx
index 50c52e603f7..c0113e91ab1 100644
--- a/src/components/Warnings/Warnings.jsx
+++ b/src/components/Warnings/Warnings.jsx
@@ -3,7 +3,7 @@ import moment from 'moment';
 import PropTypes from 'prop-types';
 import { useEffect, useState } from 'react';
 import { Alert, Button } from 'react-bootstrap';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import { toast } from 'react-toastify';
 import hasPermission from '~/utils/permissions';
 import { ENDPOINTS } from '~/utils/URL';
@@ -18,6 +18,7 @@ import WarningTrackerModal from './modals/WarningTrackerModal';
 import WarningIcons from './WarningIcons';
 import styles from './Warnings.module.css';
 import { permissions } from '../../utils/constants';
+import EditableInfoModal from '~/components/UserProfile/EditableModal/EditableInfoModal';
 // Better Descriptions (“i” = ,ltd = Please be more specific in your time log descriptions.)
 // Log Time to Tasks (“i” = ,lttt = Please log all time working on specific tasks to those tasks rather than the general category. )
 // Log Time as You Go (“i” = ,ltayg = Reminder to please log your time as you go. At a minimum, please log daily any time you work.)
@@ -33,6 +34,7 @@ export default function Warning({
 }) {
   const dispatch = useDispatch();
   const [usersWarnings, setUsersWarnings] = useState([]);
+  const darkMode = useSelector(state => state.theme.darkMode);
 
   const [toggleWarningTrackerModal, setToggleWarningTrackerModal] = useState(false);
   const [toggle, setToggle] = useState(false);
@@ -179,7 +181,17 @@ export default function Warning({
     ? usersWarnings.map(warning => (
         <div className={`${styles['warning-item-container']}`} key={warning.title}>
           <div className={`${styles['warning-wrapper']}`}>
-            <p className={`${styles['warning-text']}`}> {warning.title}</p>
+            <div style={{ display: 'flex', gap: '5px', alignItems: 'center' }}>
+              <p className={`${styles['warning-text']}`}> {warning.title}</p>
+              <EditableInfoModal
+                role={userRole}
+                areaName={`${warning?.title}Info`}
+                areaTitle={`${warning?.title} Tracker`}
+                fontSize={20}
+                initialInfo={warning?.description}
+                darkMode={darkMode}
+              />
+            </div>
             <WarningIcons
               warnings={warning.warnings}
               warningText={warning.title}
diff --git a/src/components/Warnings/modals/WarningTrackerModal.jsx b/src/components/Warnings/modals/WarningTrackerModal.jsx
index 5939cf85279..b89f06bcb87 100644
--- a/src/components/Warnings/modals/WarningTrackerModal.jsx
+++ b/src/components/Warnings/modals/WarningTrackerModal.jsx
@@ -41,6 +41,7 @@ function WarningTrackerModal({
 }) {
   const [toggeleWarningInput, setToggeleWarningInput] = useState(false);
   const [newWarning, setNewWarning] = useState('');
+  const [newWarningDescription, setNewWarningDescription] = useState('');
   const [warningDescriptions, setWarningDescriptions] = useState([]);
   const [toggleDeleteModal, setToggleDeleteModal] = useState(false);
   const [warningToDelete, setWarningToDelete] = useState(null);
@@ -250,23 +251,28 @@ function WarningTrackerModal({
 
     if (newWarning === '') return;
     const trimmedWarning = newWarning.trim();
-    dispatch(postNewWarning({ newWarning: trimmedWarning, activeWarning: true, isPermanent })).then(
-      res => {
-        setNewWarning('');
-        if (res?.error) {
-          setError(res.error);
-          return;
-        }
-        if (res?.message) {
-          setError(res.message);
-          return;
-        }
-        setWarningDescriptions(res.newWarnings);
-        getUsersWarnings();
-        setError(null);
-        setToggeleWarningInput(false);
-      },
-    );
+    dispatch(
+      postNewWarning({
+        newWarning: trimmedWarning,
+        activeWarning: true,
+        isPermanent,
+        newWarningDescription,
+      }),
+    ).then(res => {
+      setNewWarning('');
+      if (res?.error) {
+        setError(res.error);
+        return;
+      }
+      if (res?.message) {
+        setError(res.message);
+        return;
+      }
+      setWarningDescriptions(res.newWarnings);
+      getUsersWarnings();
+      setError(null);
+      setToggeleWarningInput(false);
+    });
   };
 
   if (toggleDeleteModal) {
@@ -500,6 +506,19 @@ function WarningTrackerModal({
                   value={isPermanent}
                 />
               </div>
+
+              <label htmlFor="warningDescription" className={styles.warning__title}>
+                Warning Tracker Description
+              </label>
+              <input
+                type="text"
+                id="warningDescription"
+                required
+                className={styles.warning__input}
+                value={newWarningDescription}
+                onChange={e => setNewWarningDescription(e.target.value)}
+              />
+
               <div className={styles.warning__form__btns}>
                 <Button
                   color="danger"

From e325aa7a7ed29bcb317198d067053f63f6935fb4 Mon Sep 17 00:00:00 2001
From: Anthony Weathers <anthonyweathers115@gmail.com>
Date: Mon, 5 Oct 2026 03:51:19 -0700
Subject: [PATCH 2/5] refactor: addressed dark mode compatibility with hover on
 tracker list, small issues and keeping info modal linked to tracker

---
 .../TeamMemberTasks/TeamMemberTask.jsx        | 11 ++--
 .../TeamMemberTasks/style.module.css          |  4 ++
 .../EditableModal/EditableInfoModal.jsx       |  4 +-
 src/components/Warnings/Warnings.jsx          |  2 +-
 src/components/Warnings/Warnings.module.css   | 10 ++++
 .../Warnings/modals/WarningTrackerModal.jsx   | 60 ++++++++++++++++++-
 6 files changed, 82 insertions(+), 9 deletions(-)

diff --git a/src/components/TeamMemberTasks/TeamMemberTask.jsx b/src/components/TeamMemberTasks/TeamMemberTask.jsx
index bfe5a2be8aa..3893b4640b8 100644
--- a/src/components/TeamMemberTasks/TeamMemberTask.jsx
+++ b/src/components/TeamMemberTasks/TeamMemberTask.jsx
@@ -253,7 +253,7 @@ const TeamMemberTask = React.memo(
     return (
       <tr
         ref={ref}
-        className={`${styles['table-row']} ${darkMode ? 'bg-yinmn-blue' : ''}`}
+        className={`${styles['table-row']} ${darkMode ? `${styles.darkMode} bg-yinmn-blue` : ''}`}
         key={user.personId}
       >
         <td className={styles['remove-padding']} colSpan={6}>
@@ -293,7 +293,7 @@ const TeamMemberTask = React.memo(
             )}
             <Table className={styles['no-bottom-margin']}>
               <tbody>
-                <tr className="remove-child-borders">
+                <tr className={`remove-child-borders ${darkMode ? styles.darkMode : ''}`}>
                   {/* green if member has met committed hours for the week, red if not */}
                   <td colSpan={1} className={`${darkMode ? 'bg-yinmn-blue' : ''}`}>
                     <div style={{ display: 'flex', flexWrap: 'wrap', flexDirection: 'column' }}>
@@ -411,7 +411,10 @@ const TeamMemberTask = React.memo(
                       style={{ margin: '0 auto', width: '100%' }}
                     >
                       <tbody>
-                        <tr style={{ width: '500px' }}>
+                        <tr
+                          className={`${darkMode ? styles.darkMode : ''}`}
+                          style={{ width: '500px' }}
+                        >
                           <td
                             colSpan={2}
                             className={styles['team-member-tasks-user-name']}
@@ -566,7 +569,7 @@ const TeamMemberTask = React.memo(
                                   <tr
                                     key={`${task._id}`}
                                     className={`${styles['task-break']} ${
-                                      darkMode ? 'bg-yinmn-blue' : ''
+                                      darkMode ? `${styles.darkMode} bg-yinmn-blue` : ''
                                     }`}
                                   >
                                     <td
diff --git a/src/components/TeamMemberTasks/style.module.css b/src/components/TeamMemberTasks/style.module.css
index 8adaa6678d5..a2c66e19dab 100644
--- a/src/components/TeamMemberTasks/style.module.css
+++ b/src/components/TeamMemberTasks/style.module.css
@@ -326,6 +326,10 @@
   position: relative;
 }
 
+tr.darkMode:hover {
+  background: #2f4157 !important;
+}
+
 .hidden {
   visibility: hidden;
 }
diff --git a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
index 3dc393eb256..2c70fb27ec1 100644
--- a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
+++ b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
@@ -102,7 +102,7 @@ export class EditableInfoModal extends Component {
     const CanEdit = role === 'Owner';
     const contentToDisplay = () => {
       if (content) return content;
-      return initialInfo ? initialInfo : 'Please input information!';
+      return initialInfo ? this.sanitizeText(initialInfo) : 'Please input information!';
     };
     return {
       infoElements: Array.isArray(infoCollections) ? [...infoCollections] : [],
@@ -261,7 +261,7 @@ export class EditableInfoModal extends Component {
     const { infoContent, editableModalOpen, fontSize, CanRead, CanEdit } = this.state;
     const { darkMode } = this.props;
 
-    const sanitizedContent = infoContent;
+    const sanitizedContent = this.sanitizeText(infoContent);
 
     return (
       CanRead && (
diff --git a/src/components/Warnings/Warnings.jsx b/src/components/Warnings/Warnings.jsx
index c0113e91ab1..cd2d74ae44a 100644
--- a/src/components/Warnings/Warnings.jsx
+++ b/src/components/Warnings/Warnings.jsx
@@ -181,7 +181,7 @@ export default function Warning({
     ? usersWarnings.map(warning => (
         <div className={`${styles['warning-item-container']}`} key={warning.title}>
           <div className={`${styles['warning-wrapper']}`}>
-            <div style={{ display: 'flex', gap: '5px', alignItems: 'center' }}>
+            <div className={styles.trackerInfoIcons}>
               <p className={`${styles['warning-text']}`}> {warning.title}</p>
               <EditableInfoModal
                 role={userRole}
diff --git a/src/components/Warnings/Warnings.module.css b/src/components/Warnings/Warnings.module.css
index 3df44a5cc21..87879c46f5a 100644
--- a/src/components/Warnings/Warnings.module.css
+++ b/src/components/Warnings/Warnings.module.css
@@ -28,6 +28,12 @@
   margin: 0 auto;
 }
 
+.trackerInfoIcons {
+  display: flex;
+  gap: 5px;
+  align-items: center;
+}
+
 .warning-icon {
   display: flex;
   justify-content: flex-start;
@@ -103,6 +109,10 @@
   box-shadow: rgb(0 0 0 / 80%) 0 0 0;
 }
 
+.warnings__descriptions.darkMode {
+  background: none;
+}
+
 .warning__descriptions__btn {
   padding: 0 !important;
   font-size: 1rem;
diff --git a/src/components/Warnings/modals/WarningTrackerModal.jsx b/src/components/Warnings/modals/WarningTrackerModal.jsx
index b89f06bcb87..d95a79d3d90 100644
--- a/src/components/Warnings/modals/WarningTrackerModal.jsx
+++ b/src/components/Warnings/modals/WarningTrackerModal.jsx
@@ -21,6 +21,11 @@ import {
   editWarningDescription,
   reorderWarningDescriptions,
 } from '../../../actions/warnings';
+import {
+  getInfoCollections,
+  updateInfoCollection,
+  deleteInfoCollectionById,
+} from '../../../actions/information';
 
 import styles from '../Warnings.module.css';
 import reorder from '../reorder.svg';
@@ -43,6 +48,7 @@ function WarningTrackerModal({
   const [newWarning, setNewWarning] = useState('');
   const [newWarningDescription, setNewWarningDescription] = useState('');
   const [warningDescriptions, setWarningDescriptions] = useState([]);
+  const [originalWarningDescriptions, setOriginalWarningDescriptions] = useState([]);
   const [toggleDeleteModal, setToggleDeleteModal] = useState(false);
   const [warningToDelete, setWarningToDelete] = useState(null);
   const [warningEdited, setWarningEdited] = useState(false);
@@ -53,6 +59,9 @@ function WarningTrackerModal({
   const [dragIndex, setDragIndex] = useState(null);
   const [initialDragIndex, setInitialDragIndex] = useState(null);
   const [warningsEdited, setWarningsEdited] = useState(false);
+  const [infoCollections, setInfoCollections] = useState({});
+  const [infoCollectionToUpdate, setInfoCollectionToUpdate] = useState(null);
+  const [infoCollectionToDelete, setInfoCollectionToDelete] = useState(null);
   const darkMode = useSelector(state => state.theme.darkMode);
 
   const dispatch = useDispatch();
@@ -77,12 +86,32 @@ function WarningTrackerModal({
         return;
       }
       setWarningDescriptions(res);
+      setOriginalWarningDescriptions(res);
+    });
+    dispatch(getInfoCollections()).then(res => {
+      if (res.error) {
+        setError(res.error);
+        return;
+      }
+      setInfoCollections(res);
     });
   };
   useEffect(() => {
     fetchWarningDescriptions();
   }, []);
 
+  useEffect(() => {
+    if (!editedWarning) return;
+    const originalWarning = originalWarningDescriptions.find(
+      warning => warning._id === editedWarning._id,
+    );
+    if (!infoCollections.find(info => info?.infoName === originalWarning.warningTitle + 'Info'))
+      return;
+    setInfoCollectionToUpdate(
+      infoCollections.find(info => info?.infoName === originalWarning.warningTitle + 'Info'),
+    );
+  }, [editedWarning]);
+
   useEffect(() => {
     setTimeout(() => {
       setWarningWasEdited(false);
@@ -162,6 +191,9 @@ function WarningTrackerModal({
   const handleTriggerDeleteWarningDescription = warning => {
     setToggleDeleteModal(true);
     setWarningToDelete(warning);
+    setInfoCollectionToDelete(
+      infoCollections.find(info => info?.infoName === warning.warningTitle + 'Info'),
+    );
   };
 
   const handleDeactivate = warningId => {
@@ -182,10 +214,16 @@ function WarningTrackerModal({
     });
   };
   const handleDeleteWarningDescription = warningId => {
+    if (infoCollectionToDelete) {
+      dispatch(deleteInfoCollectionById(infoCollectionToDelete._id)).then(res => {
+        if (res.error) return;
+      });
+    }
     dispatch(deleteWarningDescription(warningId)).then(res => {
       if (res.error) {
         setError(res.error);
       }
+      fetchWarningDescriptions();
     });
     setWarningDescriptions(prev => prev.filter(warning => warning._id !== warningId));
   };
@@ -209,10 +247,27 @@ function WarningTrackerModal({
     setWarningEdited(false);
     setWarningsEdited(false);
     setWarningWasEdited(false);
+    setInfoCollectionToUpdate(null);
   };
 
   const handleSaveEditedWarning = () => {
     if (warningEdited) {
+      if (infoCollectionToUpdate) {
+        const newInfo = {
+          infoName: editedWarning.warningTitle + 'Info',
+          infoContent: infoCollectionToUpdate.infoContent,
+          visibility: infoCollectionToUpdate.visibility,
+        };
+        dispatch(updateInfoCollection(infoCollectionToUpdate._id, newInfo)).then(res => {
+          if (res.error) {
+            setError(res.error);
+            setWarningEdited(false);
+            setEditedWarning(null);
+            fetchWarningDescriptions();
+            return;
+          }
+        });
+      }
       dispatch(editWarningDescription(editedWarning)).then(res => {
         if (res.error) {
           setError(res.error);
@@ -260,6 +315,7 @@ function WarningTrackerModal({
       }),
     ).then(res => {
       setNewWarning('');
+      setNewWarningDescription('');
       if (res?.error) {
         setError(res.error);
         return;
@@ -383,7 +439,7 @@ function WarningTrackerModal({
         <ul>
           {warningDescriptions.map((warning, index) => (
             <li
-              className={styles.warnings__descriptions}
+              className={`${styles.warnings__descriptions} ${darkMode ? styles.darkMode : ''}`}
               key={warning._id}
               onDragStart={() => handleDragStart(index, warning?.disabled)}
               onDragOver={e => handleDragOver(e, index, warning?.disabled)}
@@ -513,7 +569,6 @@ function WarningTrackerModal({
               <input
                 type="text"
                 id="warningDescription"
-                required
                 className={styles.warning__input}
                 value={newWarningDescription}
                 onChange={e => setNewWarningDescription(e.target.value)}
@@ -524,6 +579,7 @@ function WarningTrackerModal({
                   color="danger"
                   onClick={() => {
                     setNewWarning(null);
+                    setNewWarningDescription('');
                     setToggeleWarningInput(false);
                   }}
                 >

From ca925a733e5378dc8ecfbdf02b486c2ca8562748 Mon Sep 17 00:00:00 2001
From: Anthony Weathers <anthonyweathers115@gmail.com>
Date: Fri, 16 Oct 2026 00:23:32 -0700
Subject: [PATCH 3/5] refactor: adjusted info collection get function to skip
 endpoint if collections already retrieved, adjusted more styling for dark
 mode

---
 src/actions/information.js                    | 13 ++++++++--
 .../TeamMemberTasks/style.module.css          |  3 +--
 .../EditableModal/EditableInfoModal.jsx       | 11 ++++----
 .../EditableInfoModal.module.css              |  9 +++++++
 .../Warnings/modals/WarningTrackerModal.jsx   | 25 +++++++++++++------
 src/reducers/informationReducer.js            |  3 +++
 6 files changed, 47 insertions(+), 17 deletions(-)

diff --git a/src/actions/information.js b/src/actions/information.js
index 39541dc0360..7c2607725ab 100644
--- a/src/actions/information.js
+++ b/src/actions/information.js
@@ -19,10 +19,19 @@ export const updateInfoSuccess = updatedInfo => ({
   payload: updatedInfo,
 });
 
+export const fetchInfosBegin = () => ({
+  type: actions.FETCH_INFOS_BEGIN,
+});
+
 // Get infoCollections
-export const getInfoCollections = () => {
-  return async dispatch => {
+export const getInfoCollections = (retrieveInfos=false) => {
+  return async (dispatch, getState) => {
     try {
+      const { infoCollections } = getState();
+      if (!retrieveInfos && (infoCollections.loading || infoCollections.loaded)) {
+        return;
+      }
+      dispatch(fetchInfosBegin())
       const response = await axios.get(ENDPOINTS.INFO_COLLECTIONS);
       dispatch(fetchInfosSuccess(response.data));
       return response.data;
diff --git a/src/components/TeamMemberTasks/style.module.css b/src/components/TeamMemberTasks/style.module.css
index a2c66e19dab..93a6fb7f1de 100644
--- a/src/components/TeamMemberTasks/style.module.css
+++ b/src/components/TeamMemberTasks/style.module.css
@@ -742,8 +742,7 @@ tr.darkMode:hover {
   }
 
   .table-row {
-    border: solid #e9ecef 2px;
-    background: #faf7fc;
+    border: solid #3a506b 2px;
     font-size: 0.75rem !important;
   }
 
diff --git a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
index 2c70fb27ec1..cdbd11b29be 100644
--- a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
+++ b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
@@ -233,7 +233,7 @@ export class EditableInfoModal extends Component {
     if (saveResult === 200 || saveResult === 201) {
       await this.handleSaveSuccess();
       // ✅ Refresh collections so UI is always in sync
-      this.props.getInfoCollections();
+      this.props.getInfoCollections(true);
     } else {
       this.handleSaveError();
     }
@@ -243,7 +243,7 @@ export class EditableInfoModal extends Component {
     const { infoId } = this.handleChangeInInfos();
     await this.props.deleteInfoCollectionById(infoId);
     // Refresh collections after delete
-    this.props.getInfoCollections();
+    this.props.getInfoCollections(true);
   };
 
   handleClose = () => {
@@ -270,9 +270,9 @@ export class EditableInfoModal extends Component {
             data-toggle="tooltip"
             data-placement="right"
             title="Click for information about this"
-            style={{ fontSize: fontSize, cursor: 'pointer', color: '#00CCFF', marginRight: '8px' }}
+            style={{ fontSize: fontSize }}
             aria-hidden="true"
-            className="fa fa-info-circle"
+            className={`fa fa-info-circle ${styles.infoIcon}`}
             onClick={() => this.setState({ editableModalOpen: true })}
           />
 
@@ -322,6 +322,7 @@ export class EditableInfoModal extends Component {
                         Who can view this information?
                       </div>
                       <Select
+                        className={`${styles.visibility} ${darkMode ? styles.darkMode: ''}`}
                         options={options}
                         onChange={this.handleSelectChange}
                         value={options.find(option => option.value === this.state.visibility)}
@@ -390,7 +391,7 @@ const mapStateToProps = ({ infoCollections }) => ({
 });
 
 const mapDispatchToProps = dispatch => ({
-  getInfoCollections: () => dispatch(getInfoCollections()),
+  getInfoCollections: retrieveInfos => dispatch(getInfoCollections(retrieveInfos)),
   updateInfoCollection: (infoId, updatedInfo) => dispatch(updateInfoCollection(infoId, updatedInfo)),
   addInfoCollection: newInfo => dispatch(addInfoCollection(newInfo)),
   deleteInfoCollectionById: infoId => dispatch(deleteInfoCollectionById(infoId)),
diff --git a/src/components/UserProfile/EditableModal/EditableInfoModal.module.css b/src/components/UserProfile/EditableModal/EditableInfoModal.module.css
index 3b3a85be067..8a526bac6c3 100644
--- a/src/components/UserProfile/EditableModal/EditableInfoModal.module.css
+++ b/src/components/UserProfile/EditableModal/EditableInfoModal.module.css
@@ -34,3 +34,12 @@
   color: #fff !important;
 }
 
+.infoIcon {
+  cursor: pointer;
+  color: #0CF;
+  margin-right: 8px;
+}
+
+.visibility.darkMode > * {
+  background-color: #1b2a41;
+}
diff --git a/src/components/Warnings/modals/WarningTrackerModal.jsx b/src/components/Warnings/modals/WarningTrackerModal.jsx
index d95a79d3d90..ee35b41b038 100644
--- a/src/components/Warnings/modals/WarningTrackerModal.jsx
+++ b/src/components/Warnings/modals/WarningTrackerModal.jsx
@@ -62,6 +62,7 @@ function WarningTrackerModal({
   const [infoCollections, setInfoCollections] = useState({});
   const [infoCollectionToUpdate, setInfoCollectionToUpdate] = useState(null);
   const [infoCollectionToDelete, setInfoCollectionToDelete] = useState(null);
+  const [retrieveInfoCollections, setRetrieveInfoCollections] = useState(false);
   const darkMode = useSelector(state => state.theme.darkMode);
 
   const dispatch = useDispatch();
@@ -88,13 +89,16 @@ function WarningTrackerModal({
       setWarningDescriptions(res);
       setOriginalWarningDescriptions(res);
     });
-    dispatch(getInfoCollections()).then(res => {
-      if (res.error) {
-        setError(res.error);
-        return;
-      }
-      setInfoCollections(res);
-    });
+    if (retrieveInfoCollections) {
+      dispatch(getInfoCollections(true)).then(res => {
+        if (res.error) {
+          setError(res.error);
+          return;
+        }
+        setRetrieveInfoCollections(false);
+        setInfoCollections(res);
+      });
+    }
   };
   useEffect(() => {
     fetchWarningDescriptions();
@@ -216,7 +220,11 @@ function WarningTrackerModal({
   const handleDeleteWarningDescription = warningId => {
     if (infoCollectionToDelete) {
       dispatch(deleteInfoCollectionById(infoCollectionToDelete._id)).then(res => {
-        if (res.error) return;
+        if (res.error) {
+          setError(res.error);
+          return;
+        }
+        setRetrieveInfoCollections(true);
       });
     }
     dispatch(deleteWarningDescription(warningId)).then(res => {
@@ -266,6 +274,7 @@ function WarningTrackerModal({
             fetchWarningDescriptions();
             return;
           }
+          setRetrieveInfoCollections(true);
         });
       }
       dispatch(editWarningDescription(editedWarning)).then(res => {
diff --git a/src/reducers/informationReducer.js b/src/reducers/informationReducer.js
index c796cc6d45b..f78417a0471 100644
--- a/src/reducers/informationReducer.js
+++ b/src/reducers/informationReducer.js
@@ -3,6 +3,7 @@ import * as actions from '../constants/information';
 const initialState = {
   infos: [],
   loading: false,
+  loaded: false,
   fetchError: null,
 };
 
@@ -13,6 +14,7 @@ export const infoCollectionsReducer = (state = initialState, action) => {
       return {
         ...state,
         loading: true,
+        loaded: false,
         fetchError: null,
       };
 
@@ -20,6 +22,7 @@ export const infoCollectionsReducer = (state = initialState, action) => {
       return {
         ...state,
         loading: false,
+        loaded: true,
         infos: action.payload.infoCollectionsData,
       };
 

From e4c4c11ba3cf0aae27211f1d837ed757525f83b9 Mon Sep 17 00:00:00 2001
From: Anthony Weathers <anthonyweathers115@gmail.com>
Date: Tue, 27 Oct 2026 03:06:46 -0700
Subject: [PATCH 4/5] Fix info modal formatting and warning tracker regressions

- Preserve HTML formatting in info modal content.
- Initialize info collections as an array to prevent tracker crashes.
- Dispatch FETCH_INFOS_ERROR when fetching info collections fails.
- Handle rejected promises in warning tracker delete and rename actions.
- Replace .find() with .some() for the existence check.
- Refactor table row dark-mode class handling to address SonarCloud.
---
 src/actions/information.js                        |  5 +++++
 src/components/TeamMemberTasks/TeamMemberTask.jsx | 11 ++++++-----
 .../EditableModal/EditableInfoModal.jsx           |  2 +-
 .../Warnings/modals/WarningTrackerModal.jsx       | 15 ++++++++++-----
 src/reducers/informationReducer.js                |  1 +
 5 files changed, 23 insertions(+), 11 deletions(-)

diff --git a/src/actions/information.js b/src/actions/information.js
index 7c2607725ab..4066b65dc15 100644
--- a/src/actions/information.js
+++ b/src/actions/information.js
@@ -23,6 +23,10 @@ export const fetchInfosBegin = () => ({
   type: actions.FETCH_INFOS_BEGIN,
 });
 
+export const fetchInfosError = () => ({
+  type: actions.FETCH_INFOS_ERROR,
+})
+
 // Get infoCollections
 export const getInfoCollections = (retrieveInfos=false) => {
   return async (dispatch, getState) => {
@@ -36,6 +40,7 @@ export const getInfoCollections = (retrieveInfos=false) => {
       dispatch(fetchInfosSuccess(response.data));
       return response.data;
     } catch (error) {
+      dispatch(fetchInfosError)
       toast.error(error.message || 'Failed to fetch info collections.');
       return null;
     }
diff --git a/src/components/TeamMemberTasks/TeamMemberTask.jsx b/src/components/TeamMemberTasks/TeamMemberTask.jsx
index a7af82abc28..f98691a7958 100644
--- a/src/components/TeamMemberTasks/TeamMemberTask.jsx
+++ b/src/components/TeamMemberTasks/TeamMemberTask.jsx
@@ -171,6 +171,11 @@ const TeamMemberTask = React.memo(
     const canUnassignTask = dispatch(hasPermission(permissions.removeUserFromTask));
     const numTasksToShow = isTruncated ? NUM_TASKS_SHOW_TRUNCATE : activeTasks.length;
 
+    const tableRowDarkMode = () => {
+      if (darkMode) return `${styles['table-row']} ${styles.darkMode} bg-yinmn-blue`;
+      return `${styles['table-row']}`;
+    };
+
     const colorsObjs = {
       'Assistant Manager': '#849ced', // blue
       Manager: '#90e766', // green
@@ -256,11 +261,7 @@ const TeamMemberTask = React.memo(
     };
 
     return (
-      <tr
-        ref={ref}
-        className={`${styles['table-row']} ${darkMode ? `${styles.darkMode} bg-yinmn-blue` : ''}`}
-        key={user.personId}
-      >
+      <tr ref={ref} className={tableRowDarkMode()} key={user.personId}>
         <td className={styles['remove-padding']} colSpan={6}>
           <div className={styles['row-content']}>
             {isTimeOffContentOpen && (
diff --git a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
index cdbd11b29be..58542b98081 100644
--- a/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
+++ b/src/components/UserProfile/EditableModal/EditableInfoModal.jsx
@@ -261,7 +261,7 @@ export class EditableInfoModal extends Component {
     const { infoContent, editableModalOpen, fontSize, CanRead, CanEdit } = this.state;
     const { darkMode } = this.props;
 
-    const sanitizedContent = this.sanitizeText(infoContent);
+    const sanitizedContent = infoContent; 
 
     return (
       CanRead && (
diff --git a/src/components/Warnings/modals/WarningTrackerModal.jsx b/src/components/Warnings/modals/WarningTrackerModal.jsx
index ee35b41b038..396a3f0020f 100644
--- a/src/components/Warnings/modals/WarningTrackerModal.jsx
+++ b/src/components/Warnings/modals/WarningTrackerModal.jsx
@@ -59,10 +59,10 @@ function WarningTrackerModal({
   const [dragIndex, setDragIndex] = useState(null);
   const [initialDragIndex, setInitialDragIndex] = useState(null);
   const [warningsEdited, setWarningsEdited] = useState(false);
-  const [infoCollections, setInfoCollections] = useState({});
+  const [infoCollections, setInfoCollections] = useState([]);
   const [infoCollectionToUpdate, setInfoCollectionToUpdate] = useState(null);
   const [infoCollectionToDelete, setInfoCollectionToDelete] = useState(null);
-  const [retrieveInfoCollections, setRetrieveInfoCollections] = useState(false);
+  const [retrieveInfoCollections, setRetrieveInfoCollections] = useState(true); // true on mount to retrieve info collections
   const darkMode = useSelector(state => state.theme.darkMode);
 
   const dispatch = useDispatch();
@@ -109,7 +109,8 @@ function WarningTrackerModal({
     const originalWarning = originalWarningDescriptions.find(
       warning => warning._id === editedWarning._id,
     );
-    if (!infoCollections.find(info => info?.infoName === originalWarning.warningTitle + 'Info'))
+    if (!originalWarning) return;
+    if (!infoCollections.some(info => info?.infoName === originalWarning.warningTitle + 'Info'))
       return;
     setInfoCollectionToUpdate(
       infoCollections.find(info => info?.infoName === originalWarning.warningTitle + 'Info'),
@@ -231,7 +232,9 @@ function WarningTrackerModal({
       if (res.error) {
         setError(res.error);
       }
-      fetchWarningDescriptions();
+      fetchWarningDescriptions().catch(err => {
+        setError(err);
+      });
     });
     setWarningDescriptions(prev => prev.filter(warning => warning._id !== warningId));
   };
@@ -271,7 +274,9 @@ function WarningTrackerModal({
             setError(res.error);
             setWarningEdited(false);
             setEditedWarning(null);
-            fetchWarningDescriptions();
+            fetchWarningDescriptions().catch(err => {
+              setError(err);
+            });
             return;
           }
           setRetrieveInfoCollections(true);
diff --git a/src/reducers/informationReducer.js b/src/reducers/informationReducer.js
index f78417a0471..e1342874b55 100644
--- a/src/reducers/informationReducer.js
+++ b/src/reducers/informationReducer.js
@@ -30,6 +30,7 @@ export const infoCollectionsReducer = (state = initialState, action) => {
       return {
         ...state,
         loading: false,
+        loaded: false,
         fetchError: action.payload.error,
       };
     case actions.ADD_INFO_SUCCESS:

From 63160e86f849c5954d7ccc844eb0c1275de41e6e Mon Sep 17 00:00:00 2001
From: Anthony Weathers <anthonyweathers115@gmail.com>
Date: Wed, 4 Nov 2026 00:05:07 -0800
Subject: [PATCH 5/5] refactor: Simplify warning tracker promise handling

- Remove unnecessary async from the fetchWarningDescriptions function.
- Remove now unneeded .catch() handlers from two call sites to avoid nested promise handling and address SonarCloud feedback.
---
 src/components/Warnings/modals/WarningTrackerModal.jsx | 10 +++-------
 1 file changed, 3 insertions(+), 7 deletions(-)

diff --git a/src/components/Warnings/modals/WarningTrackerModal.jsx b/src/components/Warnings/modals/WarningTrackerModal.jsx
index 396a3f0020f..c9fb4083b36 100644
--- a/src/components/Warnings/modals/WarningTrackerModal.jsx
+++ b/src/components/Warnings/modals/WarningTrackerModal.jsx
@@ -80,7 +80,7 @@ function WarningTrackerModal({
     rolesAllowedToTracking.includes(userRole) ||
     dispatch(hasPermission(permissions.deleteWarningTracker));
 
-  const fetchWarningDescriptions = async () => {
+  const fetchWarningDescriptions = () => {
     dispatch(getWarningDescriptions()).then(res => {
       if (res.error) {
         setError(res.error);
@@ -232,9 +232,7 @@ function WarningTrackerModal({
       if (res.error) {
         setError(res.error);
       }
-      fetchWarningDescriptions().catch(err => {
-        setError(err);
-      });
+      fetchWarningDescriptions();
     });
     setWarningDescriptions(prev => prev.filter(warning => warning._id !== warningId));
   };
@@ -274,9 +272,7 @@ function WarningTrackerModal({
             setError(res.error);
             setWarningEdited(false);
             setEditedWarning(null);
-            fetchWarningDescriptions().catch(err => {
-              setError(err);
-            });
+            fetchWarningDescriptions();
             return;
           }
           setRetrieveInfoCollections(true);