LFFE-8 completing structure of chart basement

src/components/dashboard/first/index.jsx

@@ -1,96 +1,7 @@
 import DashboardLayouts from "@/layouts/dashboardLayouts";
-import Chart from "@/core/components/Chart";
-import {Box} from "@mui/material";
-import useLanguage from "@/lib/app/hooks/useLanguage";
 
 const DashboardFirstComponent = () => {
-    const {languageList} = useLanguage();
-    const specialOption = {
-        title: {
-            text: 'چارت بورس',
-            align: 'center',
-            style: {
-                fontSize: '17px',
-                fontWeight: 500
-            }
-        },
-        toolbar: {
-            style: {
-                justifyContent: 'center',
-            }
-        },
-        plotOptions: {
-            treemap: {
-                enableShades: true,
-                shadeIntensity: 0.5,
-                reverseNegativeShade: true,
-            }
-        },
-        colors: [
-            '#421243',
-            '#3B93A5',
-            '#F7B844',
-            '#ADD8C7',
-            '#EC3C65',
-            '#CDD7B6',
-            '#C1F666',
-            '#D43F97',
-            '#1E5D8C',
-            '#7F94B0',
-        ],
-    }
-    const series = [{
-        name: "finance",
-        data: [
-            {
-                x: 'INTC',
-                y: 1.2
-            },
-            {
-                x: 'GS',
-                y: 0.4
-            },
-            {
-                x: 'CVX',
-                y: -1.4
-            },
-            {
-                x: 'GE',
-                y: 2.7
-            },
-            {
-                x: 'CAT',
-                y: -0.3
-            },
-            {
-                x: 'RTX',
-                y: 5.1
-            },
-            {
-                x: 'CSCO',
-                y: -2.3
-            },
-            {
-                x: 'JNJ',
-                y: 2.1
-            },
-            {
-                x: 'PG',
-                y: 0.3
-            },
-            {
-                x: 'TRV',
-                y: 0.12
-            }
-        ]
-    }]
-    return (
-        <DashboardLayouts>
-            <Box sx={{width: "100%", height: "500px", position: "relative"}}>
-                <Chart type="treemap" series={series} specialOption={specialOption}/>
-            </Box>
-        </DashboardLayouts>
-    );
+    return <DashboardLayouts></DashboardLayouts>
 };
 
 export default DashboardFirstComponent;

src/core/components/Chart.jsx

@@ -5,16 +5,15 @@ const ApexChart = dynamic(() => import("react-apexcharts"), {ssr: false});
 
 const Chart = ({type, series, specialOption}) => {
     const {languageApp, languageList} = useLanguage();
-    const fa = languageList.find((item) => item.key == languageApp).chartLocalization
+    const chartLang = languageList.find((item) => item.key == languageApp).chartLocalization
     const options = {
         chart: {
-            locales: [fa],
-            defaultLocale: 'fa',
+            locales: [chartLang],
+            defaultLocale: languageApp,
             fontFamily: languageList[0].fontFamily
         },
         ...(specialOption ? specialOption : {})
     }
-    console.log(options)
     return <ApexChart type={type} options={options} series={series} width="100%" height="100%"/>
 };