feat: Resident Profile PR 1 base page

Author: CK-7vn

frontend-v2/src/components/shared/StatusBadge.tsx

@@ -40,6 +40,12 @@ const enrollmentStatusStyles: Record<string, string> = {
     Transferred: 'bg-amber-50 text-amber-700 border-amber-200'
 };
 
+const residentStatusStyles: Record<string, string> = {
+    Active: 'bg-green-100 text-green-800 border-green-300',
+    Inactive: 'bg-gray-100 text-gray-700 border-gray-300',
+    Archived: 'bg-orange-100 text-orange-700 border-orange-300'
+};
+
 type StatusType =
     | SelectedClassStatus
     | ProgClassStatus
@@ -49,7 +55,7 @@ type StatusType =
 
 interface StatusBadgeProps {
     status: StatusType;
-    variant?: 'class' | 'progClass' | 'program' | 'enrollment' | 'auto';
+    variant?: 'class' | 'progClass' | 'program' | 'enrollment' | 'resident' | 'auto';
     className?: string;
 }
 
@@ -69,6 +75,9 @@ function getStyleForStatus(
     if (variant === 'enrollment' && status in enrollmentStatusStyles) {
         return enrollmentStatusStyles[status];
     }
+    if (variant === 'resident' && status in residentStatusStyles) {
+        return residentStatusStyles[status];
+    }
     if (variant === 'auto') {
         if (status in classStatusStyles)
             return classStatusStyles[status as SelectedClassStatus];
@@ -78,6 +87,8 @@ function getStyleForStatus(
             return programStatusStyles[status as ProgramEffectiveStatus];
         if (status in enrollmentStatusStyles)
             return enrollmentStatusStyles[status];
+        if (status in residentStatusStyles)
+            return residentStatusStyles[status];
     }
     return 'bg-muted text-foreground border-border';
 }

frontend-v2/src/lib/formatters.ts

@@ -11,6 +11,22 @@ export function formatDate(dateStr?: string): string {
     });
 }
 
+export function formatRelativeTime(dateStr?: string): string {
+    if (!dateStr) return '-';
+    const now = new Date();
+    const date = new Date(dateStr);
+    const diffMs = now.getTime() - date.getTime();
+    if (diffMs < 0) return formatDate(dateStr);
+    const diffMins = Math.floor(diffMs / 60000);
+    if (diffMins < 60) return `${diffMins}m ago`;
+    const diffHours = Math.floor(diffMins / 60);
+    if (diffHours < 24) return `${diffHours}h ago`;
+    const diffDays = Math.floor(diffHours / 24);
+    if (diffDays === 1) return '1 day ago';
+    if (diffDays < 7) return `${diffDays} days ago`;
+    return formatDate(dateStr);
+}
+
 export function formatDateTime(dateStr: string): string {
     const dt = new Date(dateStr);
     const date = dt.toLocaleDateString('en-US', {