src/components/Expenses/ExpenseList.jsx

@@ -171,10 +171,10 @@ const ExpenseList = () => {
                         </span>
                       </div>
                     </td>
-                    <td className="d-none d-md-table-cell text-end"><i className='bx bx-rupee b-xs'></i>{expense.amount}</td>
+                    <td className="d-none d-md-table-cell text-end"><i className='bx bx-rupee b-xs'></i>{expense?.amount}</td>
                     <td>
                       <span
-                      className={`badge bg-label-${getColorNameFromHex(expense.status.color) || 'secondary'}`}
+                      className={`badge bg-label-${getColorNameFromHex(expense?.status?.color) || 'secondary'}`}
                       >
                        
                         {expense.status?.displayName   || "Unknown"}

src/components/Expenses/ViewExpense.jsx

@@ -88,7 +88,7 @@ const ViewExpense = ({ ExpenseId }) => {
         <div className="col-12 col-sm-6 col-md-4 mb-3">
           <div className="d-flex align-items-center">
             <label className="form-label me-2 mb-0 fw-semibold">Status :</label>
-            <span  className={`badge bg-label-${getColorNameFromHex(ExpenseId.status.color) || 'secondary'}`}>
+            <span  className={`badge bg-label-${getColorNameFromHex(ExpenseId?.status?.color) || 'secondary'}`}>
               {ExpenseId.status.displayName}
             </span>
           </div>

src/pages/master/MasterTable.jsx

@@ -17,7 +17,9 @@ const MasterTable = ({ data, columns, loading, handleModalData }) => {
     "checkLists",
     "isSystem",
     "isActive",
-    "noOfPersonsRequired"
+    "noOfPersonsRequired",
+    "color",
+    "displayName"
   ];
 
   const safeData = Array.isArray(data) ? data : [];