refactor(FE): Remove Kandang prop and center Uniformity gauge

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

@@ -72,7 +72,6 @@ const UniformityChart = () => {
   // const gaugeChartData: GaugeChartData = {
   //   value: 0,
   //   label: '',
-  //   kandang: 'Kandang Cirangga',
   //   week: 'Week 2',
   //   currentValue: 512,
   //   totalValue: 1024,
@@ -81,7 +80,6 @@ const UniformityChart = () => {
   const gaugeChartData: GaugeChartData = {
     value: 52,
     label: 'Uniformity',
-    kandang: 'Kandang Cirangga',
     week: 'Week 2',
     currentValue: 512,
     totalValue: 1024,
@@ -128,7 +126,6 @@ const UniformityChart = () => {
           <UniformityGaugeChart
             value={gaugeChartData.value}
             label={gaugeChartData.label}
-            kandang={gaugeChartData.kandang}
             week={gaugeChartData.week}
             currentValue={gaugeChartData.currentValue}
             totalValue={gaugeChartData.totalValue}

src/components/pages/production/uniformity/chart/UniformityGaugeChart.tsx

@@ -1,13 +1,11 @@
 import React from 'react';
 import { Cell, Pie, PieChart, ResponsiveContainer } from 'recharts';
 import Card from '@/components/Card';
-import { Icon } from '@iconify/react';
 import { formatNumber } from '@/lib/helper';
 
 interface UniformityGaugeChartProps {
   value: number;
   label: string;
-  kandang?: string;
   week?: string;
   currentValue?: number;
   totalValue?: number;
@@ -16,7 +14,6 @@ interface UniformityGaugeChartProps {
 const UniformityGaugeChart: React.FC<UniformityGaugeChartProps> = ({
   value,
   label,
-  kandang,
   week,
   currentValue,
   totalValue,
@@ -34,7 +31,7 @@ const UniformityGaugeChart: React.FC<UniformityGaugeChartProps> = ({
   const inactiveColor = '#f0f0f0';
 
   return (
-    <div className='flex flex-col w-full'>
+    <div className='flex flex-col w-full items-center'>
       <div className='h-64 w-full relative flex justify-center'>
         <div className='relative w-full h-full flex flex-col items-center justify-end'>
           <ResponsiveContainer width='100%' height='100%'>
@@ -76,18 +73,13 @@ const UniformityGaugeChart: React.FC<UniformityGaugeChartProps> = ({
       <Card
         variant='bordered'
         className={{
-          wrapper: 'w-full',
+          wrapper: 'max-w-max mx-auto',
         }}
       >
-        <section className='flex items-center gap-4'>
+        <section className='flex items-center justify-center gap-4'>
-          <div className='w-12 h-12 bg-base-200 rounded-lg flex items-center justify-center border border-gray-200 shrink-0'>
+          <div className='grid grid-cols-1 min-w-0 text-center'>
-            <Icon icon='heroicons:calendar-date-range' width={24} height={24} />
+            <div className='flex items-center justify-center space-x-2 text-[#18181B80] text-sm mb-1'>
-          </div>
+              <span className='text-[#0069E0] font-semibold truncate text-center flex justify-center'>
-          <div className='grid grid-cols-1 min-w-0'>
-            <div className='flex items-center space-x-2 text-[#18181B80] text-sm mb-1'>
-              <span className='font-medium truncate'>{kandang}</span>
-              <span className='shrink-0'>•</span>
-              <span className='text-[#0069E0] font-semibold truncate'>
                 {week}
               </span>
             </div>

src/components/pages/production/uniformity/skeleton/UniformityGaugeChartSkeleton.tsx

@@ -28,7 +28,7 @@ const UniformityGaugeChartSkeleton: React.FC<
   const inactiveColor = '#f0f0f0';
 
   return (
-    <div className='flex flex-col w-full'>
+    <div className='flex flex-col w-full items-center'>
       <div className='h-64 w-full relative flex justify-center min-h-[256px]'>
         <div className='relative w-full h-full flex flex-col items-center justify-end min-w-0'>
           <ResponsiveContainer width='100%' height={256}>