From 3ff4c37a7a2c40340c17f9e6c1754444bce0f839 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Tue, 31 Oct 2023 16:00:45 +0100
Subject: refactor(components): rewrite Modal component

* add an optional close button
* add an icon prop
---
 src/components/organisms/modals/search-modal.tsx           | 5 +++--
 src/components/organisms/modals/settings-modal.module.scss | 2 +-
 src/components/organisms/modals/settings-modal.tsx         | 5 +++--
 3 files changed, 7 insertions(+), 5 deletions(-)

(limited to 'src/components/organisms/modals')

diff --git a/src/components/organisms/modals/search-modal.tsx b/src/components/organisms/modals/search-modal.tsx
index 7d772df..be9d489 100644
--- a/src/components/organisms/modals/search-modal.tsx
+++ b/src/components/organisms/modals/search-modal.tsx
@@ -1,6 +1,7 @@
-import { forwardRef, ForwardRefRenderFunction } from 'react';
+import { forwardRef, type ForwardRefRenderFunction } from 'react';
 import { useIntl } from 'react-intl';
-import { Heading, Modal, type ModalProps } from '../../atoms';
+import { Heading } from '../../atoms';
+import { Modal, type ModalProps } from '../../molecules';
 import { SearchForm, type SearchFormProps } from '../forms';
 import styles from './search-modal.module.scss';
 
diff --git a/src/components/organisms/modals/settings-modal.module.scss b/src/components/organisms/modals/settings-modal.module.scss
index 47af656..68bce98 100644
--- a/src/components/organisms/modals/settings-modal.module.scss
+++ b/src/components/organisms/modals/settings-modal.module.scss
@@ -5,7 +5,7 @@
   width: 100%;
 
   @media screen and (max-height: #{var.get-breakpoint("2xs")}) and (max-width: #{var.get-breakpoint("sm")}) {
-    --first-col-width: #{fun.convert-px(160)};
+    --first-col-width: #{fun.convert-px(140)};
     --col-gap: var(--spacing-xl);
 
     display: grid;
diff --git a/src/components/organisms/modals/settings-modal.tsx b/src/components/organisms/modals/settings-modal.tsx
index 94d69e2..36c5977 100644
--- a/src/components/organisms/modals/settings-modal.tsx
+++ b/src/components/organisms/modals/settings-modal.tsx
@@ -1,6 +1,7 @@
 import { useCallback, type FC, type FormEvent } from 'react';
 import { useIntl } from 'react-intl';
-import { Heading, Icon, Modal, type ModalProps } from '../../atoms';
+import { Heading, Icon } from '../../atoms';
+import { Modal, type ModalProps } from '../../molecules';
 import { SettingsForm } from '../forms';
 import styles from './settings-modal.module.scss';
 
@@ -31,9 +32,9 @@ export const SettingsModal: FC<SettingsModalProps> = ({ className = '' }) => {
   return (
     <Modal
       className={`${styles.wrapper} ${className}`}
+      icon={<Icon className={styles.icon} shape="cog" />}
       heading={
         <Heading isFake level={3}>
-          <Icon className={styles.icon} shape="cog" />
           {title}
         </Heading>
       }
-- 
cgit v1.2.3