From 4f9b8fe6cc01a6069d200ca85f255d235b4d9489 Mon Sep 17 00:00:00 2001
From: Nicola Benaglia <nico.benaz@gmail.com>
Date: Sat, 12 Apr 2025 16:39:53 +0200
Subject: [PATCH] Transform svg into tsx

---
 src/Wallets.tsx              |  2 +-
 src/assets/svgs/Download.tsx | 32 ++++++++++++++++++++++++++++++++
 src/assets/svgs/Logout.tsx   | 28 ++++++++++++++++++++++++++++
 3 files changed, 61 insertions(+), 1 deletion(-)
 create mode 100644 src/assets/svgs/Download.tsx
 create mode 100644 src/assets/svgs/Logout.tsx

diff --git a/src/Wallets.tsx b/src/Wallets.tsx
index 5752639..8faf005 100644
--- a/src/Wallets.tsx
+++ b/src/Wallets.tsx
@@ -17,7 +17,7 @@ import {
   IconButton,
   Input,
 } from '@mui/material';
-import { CustomButton } from './App-styles';
+import { CustomButton } from './styles/App-styles';
 import { useDropzone } from 'react-dropzone';
 import EditIcon from '@mui/icons-material/Edit';
 import { Label } from './components/Group/AddGroup';
diff --git a/src/assets/svgs/Download.tsx b/src/assets/svgs/Download.tsx
new file mode 100644
index 0000000..577f1b4
--- /dev/null
+++ b/src/assets/svgs/Download.tsx
@@ -0,0 +1,32 @@
+import { useTheme } from '@mui/material';
+import { SVGProps } from './interfaces';
+
+export const Download: React.FC<SVGProps> = ({
+  color,
+  opacity,
+  ...children
+}) => {
+  const theme = useTheme();
+
+  const setColor = color ? color : theme.palette.text.primary;
+  const setOpacity = opacity ? opacity : 0.5;
+
+  return (
+    <svg
+      {...children}
+      width="20"
+      height="20"
+      viewBox="0 0 20 20"
+      fill={setColor}
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M12.8047 0.393196V7.21185H16.3036L10.0003 13.5139L3.69697 7.21185H7.19584V0H12.8045L12.8047 0.393196ZM2.7047 16.8587V13.9861H0V18.6179C0 19.3774 0.622589 20 1.38213 20H18.6179C19.3774 20 20 19.3774 20 18.6179V13.9861H17.2962V17.2963L2.70461 17.2954L2.7047 16.8587Z"
+        fill={setColor}
+        fill-opacity={setOpacity}
+      />
+    </svg>
+  );
+};
diff --git a/src/assets/svgs/Logout.tsx b/src/assets/svgs/Logout.tsx
new file mode 100644
index 0000000..3cdf9bb
--- /dev/null
+++ b/src/assets/svgs/Logout.tsx
@@ -0,0 +1,28 @@
+import { useTheme } from '@mui/material';
+import { SVGProps } from './interfaces';
+
+export const Logout: React.FC<SVGProps> = ({ color, opacity, ...children }) => {
+  const theme = useTheme();
+
+  const setColor = color ? color : theme.palette.text.primary;
+  const setOpacity = opacity ? opacity : 0.3;
+
+  return (
+    <svg
+      {...children}
+      width="18"
+      height="20"
+      viewBox="0 0 18 20"
+      fill={setColor}
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M7.56485 0H16.3611C17.2662 0 18 0.727797 18 1.62558V18.3744C18 19.2722 17.2662 20 16.3611 20H7.56485C6.65969 20 5.92593 19.2722 5.92593 18.3744V12.6013H10.6168C11.4569 12.6013 12.1404 11.9039 12.1404 11.0467V8.87329C12.1404 8.01613 11.4569 7.31875 10.6168 7.31875H5.92593V1.62558C5.92593 0.727797 6.65969 0 7.56485 0ZM11.1667 11.0467C11.1667 11.3719 10.9205 11.6354 10.6168 11.6354H4.8144C4.74521 11.6354 4.68911 11.6955 4.68911 11.7696V12.8632C4.68911 13.3492 4.17007 13.6259 3.8078 13.3329L0.218431 10.4298C-0.0728102 10.1942 -0.0728102 9.72579 0.218431 9.49024L3.8078 6.58709C4.17005 6.29409 4.68911 6.57077 4.68911 7.05684V8.1504C4.68911 8.2245 4.74521 8.28454 4.8144 8.28454H10.6168C10.9205 8.28454 11.1667 8.54813 11.1667 8.87329V11.0467Z"
+        fill={setColor}
+        fill-opacity={setOpacity}
+      />
+    </svg>
+  );
+};