feat: Add Zustand for state management and enhance modal handling

- Integrated Zustand for improved state management across components.
- Updated modal components to handle visibility based on active tabs, ensuring better user experience.
- Refactored various components to utilize the new tab store for managing active tab states.
- Enhanced number formatting utility to streamline number and currency display across the application.

Made-with: Cursor

frontend/lib/registry/components/aggregation-widget/AggregationWidgetComponent.tsx

@@ -3,6 +3,7 @@
 import React, { useState, useEffect, useMemo } from "react";
 import { ComponentRendererProps } from "@/types/component";
 import { AggregationWidgetConfig, AggregationItem, AggregationResult, AggregationType } from "./types";
+import { formatNumber } from "@/lib/formatting";
 import { Calculator, TrendingUp, Hash, ArrowUp, ArrowDown } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { useScreenMultiLang } from "@/contexts/ScreenMultiLangContext";
@@ -136,11 +137,11 @@ export function AggregationWidgetComponent({
       let formattedValue = value.toFixed(item.decimalPlaces ?? 0);
 
       if (item.format === "currency") {
-        formattedValue = new Intl.NumberFormat("ko-KR").format(value);
+        formattedValue = formatNumber(value);
       } else if (item.format === "percent") {
         formattedValue = `${(value * 100).toFixed(item.decimalPlaces ?? 1)}%`;
       } else if (item.format === "number") {
-        formattedValue = new Intl.NumberFormat("ko-KR").format(value);
+        formattedValue = formatNumber(value);
       }
 
       if (item.prefix) {