Remove react swipeable view

Related to #113
sebastienbarbier · Jun 26, 2023 · cb1602e · cb1602e
1 parent ae1ee29
commit cb1602e
Show file tree

Hide file tree

Showing 6 changed files with 45 additions and 64 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -65,6 +65,7 @@
   "dependencies": {
     "@date-io/moment": "^2.16.1",
     "@emotion/react": "^11.11.1",
+    "@emotion/styled": "^11.11.0",
     "@mui/icons-material": "^5.11.16",
     "@mui/lab": "^5.0.0-alpha.111",
     "@mui/material": "^5.13.5",
@@ -92,7 +93,6 @@
     "react-redux": "^8.1.1",
     "react-router-dom": "^6.13.0",
     "react-select": "^5.7.3",
-    "react-swipeable-views-v18": "^1.1.25",
     "redux": "^4.2.1",
     "redux-persist": "6.0.0",
     "redux-thunk": "^2.4.2",

diff --git a/src/app/components/Dashboard.js b/src/app/components/Dashboard.js
@@ -9,7 +9,6 @@ import { useTheme } from '@mui/material/styles';
 
 import Card from "@mui/material/Card";
 import Stack from "@mui/material/Stack";
-import SwipeableViews from "react-swipeable-views";
 
 import Container from "@mui/material/Container";
 import Button from "@mui/material/Button";

diff --git a/src/app/components/Transactions.js b/src/app/components/Transactions.js
@@ -9,7 +9,7 @@ import { useSelector, useDispatch } from "react-redux";
 import { useParams, useNavigate } from "react-router-dom";
 import moment from "moment";
 
-import SwipeableViews from "react-swipeable-views";
+import Box from "@mui/material/Box";
 
 import Card from "@mui/material/Card";
 import Button from "@mui/material/Button";
@@ -284,10 +284,8 @@ export default function Transactions(props) {
           </div>
         </div>
         <div className="indicators hideModalSize">
-          <SwipeableViews
-            enableMouseEvents
+          <Box
             style={{ padding: "0 40vw 0 24px" }}
-            slideStyle={{ padding: "0 0px" }}
           >
             <div className="view">
               <span>Balance&nbsp;</span>
@@ -331,7 +329,7 @@ export default function Transactions(props) {
                 )}
               </span>
             </div>
-          </SwipeableViews>
+          </Box>
         </div>
         <div className="layout_header_tabs wrapperMobile">
           <Tabs

diff --git a/src/app/components/dashboard/BalanceView.js b/src/app/components/dashboard/BalanceView.js
@@ -3,8 +3,7 @@ import { useSelector } from "react-redux";
 import moment from "moment";
 import { useTheme } from "../../theme";
 
-import SwipeableViews from "react-swipeable-views";
-
+import Box from "@mui/material/Box";
 import Card from "@mui/material/Card";
 
 import Button from "@mui/material/Button";
@@ -26,10 +25,7 @@ export default function BalanceView({
   });
 
   return (
-    <SwipeableViews
-      enableMouseEvents
-      disabled={disableSwipeableViews}
-      index={disableSwipeableViews ? 0 : null}
+    <Box
       className="metrics"
       style={{ padding: "0 calc(100% - 300px) 0 10px" }}
       slideStyle={{ padding: "8px 5px" }}
@@ -136,6 +132,6 @@ export default function BalanceView({
           </p>
         </div>
       </Card>
-    </SwipeableViews>
+    </Box>
   );
 }
diff --git a/src/app/components/dashboard/TrendsView.js b/src/app/components/dashboard/TrendsView.js
@@ -3,8 +3,6 @@ import { useSelector } from "react-redux";
 import moment from "moment";
 import { useTheme } from "../../theme";
 
-import SwipeableViews from "react-swipeable-views";
-
 import Card from "@mui/material/Card";
 
 import Box from "@mui/material/Box";
@@ -297,7 +295,7 @@ export default function Trends({
   };
 
   return (
-    <SwipeableViews
+    <Box
       disabled={disabled}
       index={disabled ? 0 : null}
       enableMouseEvents
@@ -427,6 +425,6 @@ export default function Trends({
           See details
         </Button>
       </Card>
-    </SwipeableViews>
+    </Box>
   );
 }