Show Unreported status badge for expenses without a report

When expenses in personal chat are not yet reported, the Status column
shows empty cells because stateNum/statusNum are undefined. Change the
fallback in getReportStatusTranslation and getReportStatusColorStyle
to return an "Unreported" badge instead of empty values. Add the
unreported badge style to both light and dark themes.

Co-authored-by: Jayesh Mangwani <jayeshmangwani@users.noreply.github.com>

Author: MelvinBot

src/libs/ReportUtils.ts

@@ -13207,7 +13207,7 @@ function getReportStatusTranslation({stateNum, statusNum, isDeleted, translate}:
         return translate('iou.deleted');
     }
     if (stateNum === undefined || statusNum === undefined) {
-        return '';
+        return translate('common.unreported');
     }
 
     if (stateNum === CONST.REPORT.STATE_NUM.OPEN && statusNum === CONST.REPORT.STATUS_NUM.OPEN) {
@@ -13238,7 +13238,7 @@ function getReportStatusColorStyle(theme: ThemeColors, stateNum?: number, status
         return theme.reportStatusBadge.deleted;
     }
     if (stateNum === undefined || statusNum === undefined) {
-        return undefined;
+        return theme.reportStatusBadge.unreported;
     }
 
     if (stateNum === CONST.REPORT.STATE_NUM.OPEN && statusNum === CONST.REPORT.STATUS_NUM.OPEN) {

src/styles/theme/themes/dark.ts

@@ -197,6 +197,10 @@ const darkTheme = {
             backgroundColor: colors.tangerine700,
             textColor: colors.productDark900,
         },
+        unreported: {
+            backgroundColor: colors.productDark400,
+            textColor: colors.productDark800,
+        },
     },
 
     statusBarStyle: CONST.STATUS_BAR_STYLE.LIGHT_CONTENT,

src/styles/theme/themes/light.ts

@@ -197,6 +197,10 @@ const lightTheme = {
             backgroundColor: colors.tangerine500,
             textColor: colors.productLight100,
         },
+        unreported: {
+            backgroundColor: colors.productLight400,
+            textColor: colors.productLight800,
+        },
     },
 
     statusBarStyle: CONST.STATUS_BAR_STYLE.DARK_CONTENT,

src/styles/theme/types.ts

@@ -119,7 +119,7 @@ type ThemeColors = {
     trialTimer: Color;
 
     reportStatusBadge: Record<
-        'draft' | 'outstanding' | 'paid' | 'approved' | 'closed' | 'deleted',
+        'draft' | 'outstanding' | 'paid' | 'approved' | 'closed' | 'deleted' | 'unreported',
         {
             backgroundColor: Color;
             textColor: Color;

tests/unit/ReportUtilsTest.ts

@@ -10565,10 +10565,10 @@ describe('ReportUtils', () => {
             expect(result).toBe(mockTranslate('iou.settledExpensify'));
         });
 
-        it('should return an empty string when stateNum or statusNum is undefined', () => {
-            expect(getReportStatusTranslation({stateNum: undefined, statusNum: undefined, translate: mockTranslate})).toBe('');
-            expect(getReportStatusTranslation({stateNum: CONST.REPORT.STATE_NUM.OPEN, statusNum: undefined, translate: mockTranslate})).toBe('');
-            expect(getReportStatusTranslation({stateNum: undefined, statusNum: CONST.REPORT.STATUS_NUM.OPEN, translate: mockTranslate})).toBe('');
+        it('should return "Unreported" when stateNum or statusNum is undefined', () => {
+            expect(getReportStatusTranslation({stateNum: undefined, statusNum: undefined, translate: mockTranslate})).toBe(mockTranslate('common.unreported'));
+            expect(getReportStatusTranslation({stateNum: CONST.REPORT.STATE_NUM.OPEN, statusNum: undefined, translate: mockTranslate})).toBe(mockTranslate('common.unreported'));
+            expect(getReportStatusTranslation({stateNum: undefined, statusNum: CONST.REPORT.STATUS_NUM.OPEN, translate: mockTranslate})).toBe(mockTranslate('common.unreported'));
         });
 
         it('should return "Deleted" when isDeleted is true', () => {