Add weather information section and update dependencies

- Introduced a new CropZoningWeatherSection component to display weather data in the crop zoning dashboard.
- Updated package.json and package-lock.json to include chart.js and react-chartjs-2 for enhanced data visualization.
- Added Persian translations for weather-related UI elements to support localization.

src/views/dashboards/farm/cropZoning/CropZoningWrapper.tsx

@@ -10,6 +10,7 @@ import CropZoningMap from './CropZoningMap'
 import ZoneLegend from './ZoneLegend'
 import LayerControl from './LayerControl'
 import ZoneDetailPanel from './ZoneDetailPanel'
+import CropZoningWeatherSection from './CropZoningWeatherSection'
 import type { LayerType } from './cropZoningTypes'
 import type { ZoneFeatureProperties } from './cropZoningTypes'
 import type { MapDrawGeoJSON } from './CropZoningMap'
@@ -45,18 +46,19 @@ export default function CropZoningWrapper() {
   }, [])
 
   return (
-    <Box className='relative is-full min-bs-[calc(100vh-120px)] rounded-xl overflow-hidden'>
-      <Box className='absolute inset-0 z-0'>
-        <MapComponent
-          center={[35.6892, 51.389]}
-          zoom={13}
-          height='100%'
-          activeLayer={activeLayer}
-          onAreaChange={handleAreaChange}
-          onZoneClick={handleZoneClick}
-          optimizationKey={optimizationKey}
-          className='min-bs-[400px]'
-        />
+    <Box className='flex flex-col gap-6 is-full'>
+      <Box className='relative min-bs-[400px] rounded-xl overflow-hidden' sx={{ height: 'min(60vh, 500px)' }}>
+        <Box className='absolute inset-0 z-0'>
+          <MapComponent
+            center={[35.6892, 51.389]}
+            zoom={13}
+            height='100%'
+            activeLayer={activeLayer}
+            onAreaChange={handleAreaChange}
+            onZoneClick={handleZoneClick}
+            optimizationKey={optimizationKey}
+            className='min-bs-[400px]'
+          />
       </Box>
 
       <LayerControl activeLayer={activeLayer} onLayerChange={setActiveLayer} />
@@ -84,6 +86,9 @@ export default function CropZoningWrapper() {
         onClose={() => setPanelOpen(false)}
         zone={selectedZone}
       />
+      </Box>
+
+      <CropZoningWeatherSection />
     </Box>
   )
 }