From 2e823e7ade2bd2ae7988ca5a2d733138509b0a30 Mon Sep 17 00:00:00 2001
From: Mohammad Jalali <muhammad.art79@gmail.com>
Date: Sat, 18 Nov 2023 11:07:24 +0330
Subject: [PATCH] LFFE-10 responsive debug

---
 .../dashboard/reports/LoanDistribution/PieChart.jsx          | 5 +++--
 .../dashboard/reports/LoanDistribution/PolarChart.jsx        | 5 +++--
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/src/components/dashboard/reports/LoanDistribution/PieChart.jsx b/src/components/dashboard/reports/LoanDistribution/PieChart.jsx
index b2908c0..9da086e 100644
--- a/src/components/dashboard/reports/LoanDistribution/PieChart.jsx
+++ b/src/components/dashboard/reports/LoanDistribution/PieChart.jsx
@@ -1,10 +1,11 @@
 import Chart from "@/core/components/Chart";
 import {useTheme} from "@mui/material/styles";
+import {useMediaQuery} from "@mui/material";
 
 
 const Pie = ({data}) => {
     const theme = useTheme();
-    const windowsWidth = window.innerWidth;
+    const upperSm = useMediaQuery((theme.breakpoints.up("sm")))
     const specialOption = {
         title: {
             text: undefined,
@@ -21,7 +22,7 @@ const Pie = ({data}) => {
             },
         },
         legend: {
-            show: windowsWidth > theme.breakpoints.values.sm
+            show: upperSm
         }
     };
     const series = data.map((item) => +item.percentage)
diff --git a/src/components/dashboard/reports/LoanDistribution/PolarChart.jsx b/src/components/dashboard/reports/LoanDistribution/PolarChart.jsx
index 01e4286..2b62915 100644
--- a/src/components/dashboard/reports/LoanDistribution/PolarChart.jsx
+++ b/src/components/dashboard/reports/LoanDistribution/PolarChart.jsx
@@ -1,9 +1,10 @@
 import Chart from "@/core/components/Chart";
 import {useTheme} from "@mui/material/styles";
+import {useMediaQuery} from "@mui/material";
 
 const PolarChart = ({data}) => {
     const theme = useTheme();
-    const windowsWidth = window.innerWidth;
+    const upperSm = useMediaQuery((theme.breakpoints.up("sm")))
     const specialOption = {
         title: {
             text: undefined,
@@ -28,7 +29,7 @@ const PolarChart = ({data}) => {
             },
         },
         legend: {
-            show: windowsWidth > theme.breakpoints.values.sm
+            show: upperSm
         }
     };
     const series = data.map((item) => +item.percentage)