Fix package state initialization and update effect deps

Initialize the 'packages' state as an empty array instead of null and update the useEffect dependency array to include 'area' for correct data fetching when 'area' changes.

EsimLao/esim-vite/src/pages/product-detail/ProductDetailView.tsx

@@ -33,7 +33,7 @@ const ProductDetailView: React.FC = () => {
   });
   const [simType, setSimType] = useState<"eSIM" | "Physical">("eSIM");
   const [quantity, setQuantity] = useState<number>(1);
-  const [packages, setPackages] = useState<Package[]>(null);
+  const [packages, setPackages] = useState<Package[]>([]);
 
   if (!area) {
     return (
@@ -71,7 +71,7 @@ const ProductDetailView: React.FC = () => {
 
   useEffect(() => {
     getProductMutation.mutate();
-  }, []);
+  }, [area]);
 
   const getProductMutation = useMutation({
     mutationFn: async () => {