update collapse button, add to bottom of ai insight

components/AiInsightCard.tsx

@@ -265,6 +265,7 @@ export const AiInsightCard: React.FC<AiInsightCardProps> = ({
   const [reportType, setReportType] = useState<InsightReportType>('daily');
   const [dayPeriod, setDayPeriod] = useState<string | null>(null);
   const [isCollapsed, setIsCollapsed] = useState(false);
+  const cardRef = useRef<HTMLDivElement>(null);
   const insightInFlightRef = useRef(false);
 
   const effectiveKandangId = kandangId ?? selectedKandangId;
@@ -782,7 +783,10 @@ export const AiInsightCard: React.FC<AiInsightCardProps> = ({
   };
 
   return (
-    <div className="bg-white border border-gray-100 rounded-xl shadow-sm overflow-hidden transition-all">
+    <div
+      ref={cardRef}
+      className="bg-white border border-gray-100 rounded-xl shadow-sm overflow-hidden transition-all"
+    >
       <div className="p-5 sm:p-6">
         <div
           className={`flex flex-col md:flex-row md:items-center justify-between gap-4 ${isCollapsed ? '' : 'mb-4'}`}
@@ -1135,11 +1139,25 @@ export const AiInsightCard: React.FC<AiInsightCardProps> = ({
               )}
             </div>
 
-            {lastUpdated && (
-              <div className="mt-4 pt-4 border-t border-gray-100">
-                <p className="text-xs text-gray-500">Terakhir diperbarui: {formatLastUpdated()}</p>
-              </div>
-            )}
+            <div className="mt-6 pt-4 border-t border-gray-100 flex flex-col items-center justify-center gap-1.5">
+              <button
+                type="button"
+                onClick={() => {
+                  setIsCollapsed(true);
+                  cardRef.current?.scrollIntoView({ behavior: 'smooth', block: 'start' });
+                }}
+                className="group flex items-center justify-center w-10 h-7 rounded-full bg-gray-50 hover:bg-red-50 text-gray-400 hover:text-red-600 border border-gray-200 hover:border-red-200 shadow-xs transition-all duration-200"
+                title="Tutup AI Insight"
+                aria-label="Tutup AI Insight"
+              >
+                <i className="fa-solid fa-chevron-up text-xs transition-transform group-hover:-translate-y-0.5" />
+              </button>
+              {lastUpdated && (
+                <p className="text-[11px] text-gray-400">
+                  Terakhir diperbarui: {formatLastUpdated()}
+                </p>
+              )}
+            </div>
           </>
         )}
       </div>