From 7659576e49003e6237e9d7e335838379d3d313be Mon Sep 17 00:00:00 2001
From: Carlos Abenza <59970629+CarlosABVA@users.noreply.github.com>
Date: Sat, 4 Jan 2025 08:35:57 +0100
Subject: [PATCH] Fix delete button logic (#1100)

---
 .../components/pages/account/Header.test.tsx  | 66 ++++++++++++++++++-
 src/components/pages/account/Header.tsx       |  6 +-
 2 files changed, 67 insertions(+), 5 deletions(-)

diff --git a/src/__tests__/components/pages/account/Header.test.tsx b/src/__tests__/components/pages/account/Header.test.tsx
index c6d325fd..1e668c4e 100644
--- a/src/__tests__/components/pages/account/Header.test.tsx
+++ b/src/__tests__/components/pages/account/Header.test.tsx
@@ -43,7 +43,7 @@ describe('Header', () => {
   beforeEach(() => {
     jest.spyOn(Split, 'create').mockReturnValue({ guid: 'createdSplit' } as Split);
     jest.spyOn(apiHook, 'useAccount').mockReturnValue({ data: undefined } as UseQueryResult<Account>);
-    jest.spyOn(apiHook, 'useSplitsPagination').mockReturnValue({ data: undefined } as UseQueryResult<Split[]>);
+    jest.spyOn(apiHook, 'useSplitsPagination').mockReturnValue({ data: [] as Split[] } as UseQueryResult<Split[]>);
   });
 
   afterEach(() => {
@@ -59,6 +59,7 @@ describe('Header', () => {
       commodity: {
         mnemonic: 'EUR',
       },
+      childrenIds: [] as String[],
     } as Account;
 
     jest.spyOn(apiHook, 'useAccount').mockReturnValueOnce({
@@ -101,7 +102,7 @@ describe('Header', () => {
       expect.objectContaining({
         className: 'btn btn-danger',
         'data-tooltip-id': 'delete-help',
-        disabled: true,
+        disabled: false,
         id: 'delete-account',
         modalTitle: 'Confirm you want to remove this account',
       }),
@@ -134,6 +135,7 @@ describe('Header', () => {
       commodity: {
         mnemonic: 'EUR',
       },
+      childrenIds: [] as String[]
     } as Account;
 
     jest.spyOn(apiHook, 'useAccount').mockReturnValueOnce({
@@ -143,4 +145,64 @@ describe('Header', () => {
     const { container } = render(<Header account={account} />);
     expect(container).toMatchSnapshot();
   });
+
+  it('delete is disabled if contains children', async () => {
+    const account = {
+      guid: 'guid',
+      path: 'Assets:account',
+      name: 'account',
+      type: 'TYPE',
+      parentId: 'parent',
+      commodity: {
+        mnemonic: 'EUR',
+      },
+      childrenIds: [
+        "child_guid"
+      ]
+    } as Account;
+
+    render(<Header account={account} />);
+
+    expect(FormButton).toHaveBeenCalledWith(
+      expect.objectContaining({
+        className: 'btn btn-danger',
+        'data-tooltip-id': 'delete-help',
+        disabled: true,
+        id: 'delete-account',
+        modalTitle: 'Confirm you want to remove this account',
+      }),
+      undefined,
+    );
+  });
+
+  it('delete is disabled if contains splits', async () => {
+    const account = {
+      guid: 'guid',
+      path: 'Assets:account',
+      name: 'account',
+      type: 'TYPE',
+      parentId: 'parent',
+      commodity: {
+        mnemonic: 'EUR',
+      },
+      childrenIds: [] as String[]
+    } as Account;
+
+    jest.spyOn(apiHook, 'useSplitsPagination').mockReturnValueOnce({
+      data: { length: 1 } as Split[],
+    } as UseQueryResult<Split[]>);
+
+    render(<Header account={account} />);
+
+    expect(FormButton).toHaveBeenCalledWith(
+      expect.objectContaining({
+        className: 'btn btn-danger',
+        'data-tooltip-id': 'delete-help',
+        disabled: true,
+        id: 'delete-account',
+        modalTitle: 'Confirm you want to remove this account',
+      }),
+      undefined,
+    );
+  });
 });
diff --git a/src/components/pages/account/Header.tsx b/src/components/pages/account/Header.tsx
index c076e95e..255dff2c 100644
--- a/src/components/pages/account/Header.tsx
+++ b/src/components/pages/account/Header.tsx
@@ -25,7 +25,7 @@ export default function Header({
   const router = useRouter();
 
   const latestDate = splits?.[0]?.transaction?.date;
-  const deletable = splits?.length === 0;
+  const deletable = splits?.length === 0 && account.childrenIds?.length === 0;
 
   let title: string | React.JSX.Element = account.path;
   if (account.path.lastIndexOf(':') > 0) {
@@ -100,10 +100,10 @@ export default function Header({
                 id="delete-help"
               >
                 <p>
-                  Accounts that contain transactions can&apos;t be deleted.
+                  Accounts that contain transactions or children can&apos;t be deleted.
                 </p>
                 <p>
-                  Move the transactions to another account first.
+                  Move the transactions or children to another account first.
                 </p>
               </Tooltip>
             )