From b211e0f6796946952ca35012ef22871265795f31 Mon Sep 17 00:00:00 2001
From: Joel Jeremy Marquez <joeljeremy.marquez@gmail.com>
Date: Thu, 11 Apr 2024 11:30:50 -0700
Subject: [PATCH] Rename to ModalCloseButton

---
 packages/desktop-client/src/components/common/Modal.tsx   | 8 ++++----
 .../src/components/modals/AccountAutocompleteModal.tsx    | 7 +++++--
 .../src/components/modals/CategoryAutocompleteModal.tsx   | 7 +++++--
 .../src/components/modals/PayeeAutocompleteModal.tsx      | 7 +++++--
 4 files changed, 19 insertions(+), 10 deletions(-)

diff --git a/packages/desktop-client/src/components/common/Modal.tsx b/packages/desktop-client/src/components/common/Modal.tsx
index 09ef8784067..d1b2b753048 100644
--- a/packages/desktop-client/src/components/common/Modal.tsx
+++ b/packages/desktop-client/src/components/common/Modal.tsx
@@ -35,7 +35,7 @@ export type ModalProps = {
   padding?: CSSProperties['padding'];
   showHeader?: boolean;
   leftHeaderContent?: ReactNode;
-  CloseButton?: ComponentType<ComponentPropsWithRef<typeof CloseButton>>;
+  CloseButton?: ComponentType<ComponentPropsWithRef<typeof ModalCloseButton>>;
   showTitle?: boolean;
   editableTitle?: boolean;
   showOverlay?: boolean;
@@ -60,7 +60,7 @@ export const Modal = ({
   padding = 20,
   showHeader = true,
   leftHeaderContent,
-  CloseButton: CloseButtonComponent = CloseButton,
+  CloseButton: CloseButtonComponent = ModalCloseButton,
   showTitle = true,
   editableTitle = false,
   showOverlay = true,
@@ -422,12 +422,12 @@ export const ModalButtons = ({
   );
 };
 
-type CloseButtonProps = {
+type ModalCloseButtonProps = {
   onClick: ComponentProps<typeof Button>['onClick'];
   style?: CSSProperties;
 };
 
-export function CloseButton({ onClick, style }: CloseButtonProps) {
+export function ModalCloseButton({ onClick, style }: ModalCloseButtonProps) {
   return (
     <Button
       type="bare"
diff --git a/packages/desktop-client/src/components/modals/AccountAutocompleteModal.tsx b/packages/desktop-client/src/components/modals/AccountAutocompleteModal.tsx
index aa306fcd61a..1a275782ebe 100644
--- a/packages/desktop-client/src/components/modals/AccountAutocompleteModal.tsx
+++ b/packages/desktop-client/src/components/modals/AccountAutocompleteModal.tsx
@@ -3,7 +3,7 @@ import React, { type ComponentPropsWithoutRef } from 'react';
 import { useResponsive } from '../../ResponsiveProvider';
 import { theme } from '../../style';
 import { AccountAutocomplete } from '../autocomplete/AccountAutocomplete';
-import { CloseButton, Modal } from '../common/Modal';
+import { ModalCloseButton, Modal } from '../common/Modal';
 import { View } from '../common/View';
 import { SectionLabel } from '../forms';
 import { type CommonModalProps } from '../Modals';
@@ -49,7 +49,10 @@ export function AccountAutocompleteModal({
         backgroundColor: theme.menuAutoCompleteBackground,
       }}
       CloseButton={props => (
-        <CloseButton {...props} style={{ color: theme.menuAutoCompleteText }} />
+        <ModalCloseButton
+          {...props}
+          style={{ color: theme.menuAutoCompleteText }}
+        />
       )}
     >
       {() => (
diff --git a/packages/desktop-client/src/components/modals/CategoryAutocompleteModal.tsx b/packages/desktop-client/src/components/modals/CategoryAutocompleteModal.tsx
index 4da7baa1d7a..dad5c3ea23d 100644
--- a/packages/desktop-client/src/components/modals/CategoryAutocompleteModal.tsx
+++ b/packages/desktop-client/src/components/modals/CategoryAutocompleteModal.tsx
@@ -3,7 +3,7 @@ import React, { type ComponentPropsWithoutRef } from 'react';
 import { useResponsive } from '../../ResponsiveProvider';
 import { theme } from '../../style';
 import { CategoryAutocomplete } from '../autocomplete/CategoryAutocomplete';
-import { CloseButton, Modal } from '../common/Modal';
+import { ModalCloseButton, Modal } from '../common/Modal';
 import { View } from '../common/View';
 import { SectionLabel } from '../forms';
 import { type CommonModalProps } from '../Modals';
@@ -50,7 +50,10 @@ export function CategoryAutocompleteModal({
         backgroundColor: theme.menuAutoCompleteBackground,
       }}
       CloseButton={props => (
-        <CloseButton {...props} style={{ color: theme.menuAutoCompleteText }} />
+        <ModalCloseButton
+          {...props}
+          style={{ color: theme.menuAutoCompleteText }}
+        />
       )}
     >
       {() => (
diff --git a/packages/desktop-client/src/components/modals/PayeeAutocompleteModal.tsx b/packages/desktop-client/src/components/modals/PayeeAutocompleteModal.tsx
index 15c4dfeb3e9..4db7cd17516 100644
--- a/packages/desktop-client/src/components/modals/PayeeAutocompleteModal.tsx
+++ b/packages/desktop-client/src/components/modals/PayeeAutocompleteModal.tsx
@@ -5,7 +5,7 @@ import { usePayees } from '../../hooks/usePayees';
 import { useResponsive } from '../../ResponsiveProvider';
 import { theme } from '../../style';
 import { PayeeAutocomplete } from '../autocomplete/PayeeAutocomplete';
-import { CloseButton, Modal } from '../common/Modal';
+import { ModalCloseButton, Modal } from '../common/Modal';
 import { type CommonModalProps } from '../Modals';
 
 type PayeeAutocompleteModalProps = {
@@ -52,7 +52,10 @@ export function PayeeAutocompleteModal({
         backgroundColor: theme.menuAutoCompleteBackground,
       }}
       CloseButton={props => (
-        <CloseButton {...props} style={{ color: theme.menuAutoCompleteText }} />
+        <ModalCloseButton
+          {...props}
+          style={{ color: theme.menuAutoCompleteText }}
+        />
       )}
     >
       {() => (