From 6171b1c97e00a954d87aaf6848d7889b47d22a7b Mon Sep 17 00:00:00 2001
From: eenvin <envin@proton.me>
Date: Fri, 5 Jan 2024 18:03:30 +0100
Subject: [PATCH] feat(proposals): add navigation button on iframe modal

---
 public/assets/svg/left-arrow.svg    | 40 +++++++++++++++++++++++++++++
 src/components/base/Modal/index.jsx | 14 +++++++++-
 2 files changed, 53 insertions(+), 1 deletion(-)
 create mode 100644 public/assets/svg/left-arrow.svg

diff --git a/public/assets/svg/left-arrow.svg b/public/assets/svg/left-arrow.svg
new file mode 100644
index 0000000..1df807b
--- /dev/null
+++ b/public/assets/svg/left-arrow.svg
@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="iso-8859-1"?>
+<!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
+<svg fill="#475965" height="20px" width="20px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" 
+	 viewBox="0 0 490 490" xml:space="preserve">
+<g>
+	<g>
+		<polygon points="332.668,490 82.631,244.996 332.668,0 407.369,76.493 235.402,244.996 407.369,413.507 		"/>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+	<g>
+	</g>
+</g>
+</svg>
\ No newline at end of file
diff --git a/src/components/base/Modal/index.jsx b/src/components/base/Modal/index.jsx
index 06861e1..d103ad1 100644
--- a/src/components/base/Modal/index.jsx
+++ b/src/components/base/Modal/index.jsx
@@ -3,6 +3,8 @@ import { Modal } from 'react-bootstrap'
 import styled from 'styled-components'
 
 import Text from '../Text'
+import Button from '../Button'
+import Icon from '../Icon'
 
 const StyledModalTitle = styled(Text)`
   font-size: 20px;
@@ -33,10 +35,20 @@ const StyledHeader = styled(Modal.Header)`
   }
 `
 
-const MyModal = ({ show, title, children, size = 'lg', bodyStyle, onClose }) => {
+const StyledButton = styled(Button)`
+  width: 50px;
+  margin-right: 10px;
+`
+
+const MyModal = ({ show, title, children, size = 'lg', bodyStyle, onClose, onClick, hasButton = false }) => {
   return (
     <Modal show={show} aria-labelledby="modal" size={size} centered onHide={onClose}>
       <StyledHeader closeButton={Boolean(onClose)}>
+        {hasButton ? (
+          <StyledButton onClick={onClick}>
+            <Icon icon="left-arrow" />
+          </StyledButton>
+        ) : null}
         <StyledModalTitle>{title}</StyledModalTitle>
       </StyledHeader>
       <StyledBody style={bodyStyle}>{children}</StyledBody>