refactor(FE): Replace Badge with StatusBadge and cleanup utils

src/components/pages/production/uniformity/UniformityTable.tsx

@@ -42,8 +42,6 @@ import {
   ProjectFlock,
 } from '@/types/api/production/project-flock';
 import {
-  getStatusColor,
-  getStatusIndicatorColor,
   getStatusText,
   getStatusBadgeColor,
 } from '@/components/pages/production/uniformity/uniformity-utils';
@@ -132,16 +130,10 @@ const UniformityConfirmationPreview = ({
         if (id === 'status') {
           return (
             <div className='w-full'>
-              <Badge
+              <StatusBadge
-                statusIndicator={true}
+                color={getStatusBadgeColor(value)}
-                variant='soft'
+                text={getStatusText(value)}
-                className={{
+              />
-                  badge: `rounded-xl w-full justify-start border border-gray-200 text-black ${getStatusColor(value)}`,
-                  status: getStatusIndicatorColor(value),
-                }}
-              >
-                {getStatusText(value)}
-              </Badge>
             </div>
           );
         }

src/components/pages/production/uniformity/detail/UniformityDetail.tsx

@@ -7,7 +7,7 @@ import { ColumnDef } from '@tanstack/react-table';
 import Button from '@/components/Button';
 import DrawerHeader from '@/components/helper/drawer/DrawerHeader';
 import Table from '@/components/Table';
-import Badge from '@/components/Badge';
+import StatusBadge from '@/components/helper/StatusBadge';
 import Tooltip from '@/components/Tooltip';
 import RequirePermission from '@/components/helper/RequirePermission';
 import { UniformityDetail as UniformityDetailType } from '@/types/api/production/uniformity';
@@ -18,8 +18,7 @@ import { UniformityApi } from '@/services/api/uniformity';
 import useSWR from 'swr';
 import { isResponseSuccess } from '@/lib/api-helper';
 import {
-  getStatusColor,
+  getStatusBadgeColor,
-  getStatusIndicatorColor,
   getStatusText,
 } from '@/components/pages/production/uniformity/uniformity-utils';
 import { DetailOptionType } from '@/types/api/production/uniformity';
@@ -184,16 +183,10 @@ const UniformityDetail: React.FC<UniformityDetailProps> = ({
             if (status) {
               return (
                 <div className='w-full'>
-                  <Badge
+                  <StatusBadge
-                    statusIndicator={true}
+                    color={getStatusBadgeColor(status)}
-                    variant='soft'
+                    text={getStatusText(status)}
-                    className={{
+                  />
-                      badge: `rounded-xl w-full justify-start border border-gray-200 text-black ${getStatusColor(status)}`,
-                      status: getStatusIndicatorColor(status),
-                    }}
-                  >
-                    {getStatusText(status)}
-                  </Badge>
                 </div>
               );
             }

src/components/pages/production/uniformity/uniformity-utils.ts

@@ -1,26 +1,8 @@
-export const weightStatusColorMap: Record<string, string> = {
-  ideal: 'bg-[#00D39033]',
-  outside: 'bg-error/10',
-};
-
-export const weightStatusIndicatorColorMap: Record<string, string> = {
-  ideal: 'bg-[#008000]',
-  outside: 'bg-error',
-};
-
 export const weightStatusTextMap: Record<string, string> = {
   ideal: 'Ideal',
   outside: 'Outside',
 };
 
-export const getWeightStatusColor = (status: string): string => {
-  return weightStatusColorMap[status] || 'bg-info';
-};
-
-export const getWeightStatusIndicatorColor = (status: string): string => {
-  return weightStatusIndicatorColorMap[status] || 'bg-info';
-};
-
 export const getWeightStatusText = (status: string): string => {
   return weightStatusTextMap[status] || status;
 };
@@ -39,24 +21,6 @@ export const getWeightStatusBadgeColor = (
   return weightStatusBadgeColorMap[status] || 'neutral';
 };
 
-export const statusColorMap: Record<string, string> = {
-  APPROVED: 'bg-[#00D39033]',
-  Disetujui: 'bg-[#00D39033]',
-  REJECTED: 'bg-error/10',
-  Ditolak: 'bg-error/10',
-  CREATED: 'bg-[#f3f3f4]',
-  Pengajuan: 'bg-[#f3f3f4]',
-};
-
-export const statusIndicatorColorMap: Record<string, string> = {
-  APPROVED: 'bg-[#008000]',
-  Disetujui: 'bg-[#008000]',
-  REJECTED: 'bg-error',
-  Ditolak: 'bg-error',
-  CREATED: 'bg-[#D9D9D9]',
-  Pengajuan: 'bg-[#D9D9D9]',
-};
-
 export const statusTextMap: Record<string, string> = {
   APPROVED: 'Disetujui',
   Disetujui: 'Disetujui',
@@ -66,14 +30,6 @@ export const statusTextMap: Record<string, string> = {
   Pengajuan: 'Pengajuan',
 };
 
-export const getStatusColor = (status: string): string => {
-  return statusColorMap[status] || 'bg-info';
-};
-
-export const getStatusIndicatorColor = (status: string): string => {
-  return statusIndicatorColorMap[status] || 'bg-info';
-};
-
 export const getStatusText = (status: string): string => {
   return statusTextMap[status] || status;
 };