feat(foxy-transaction): add header action for archiving/unarchiving

Foxy · Jan 31, 2025 · 0af458b · 0af458b
1 parent 5b671b6
commit 0af458b
Show file tree

Hide file tree

Showing 5 changed files with 109 additions and 0 deletions.
diff --git a/...tion/internal/InternalTransactionActionsControl/InternalTransactionActionsControl.test.ts b/...tion/internal/InternalTransactionActionsControl/InternalTransactionActionsControl.test.ts
@@ -11,6 +11,7 @@ import { stub } from 'sinon';
 
 import unset from 'lodash-es/unset';
 import set from 'lodash-es/set';
+import { BooleanSelector } from '@foxy.io/sdk/core';
 
 describe('Transaction', () => {
   describe('InternalTransactionActionsControl', () => {
@@ -271,5 +272,86 @@ describe('Transaction', () => {
       expect(link).to.have.attribute('href', 'https://example.com/receipt');
       expect(link).to.have.attribute('target', '_blank');
     });
+
+    it('renders Archive button if transaction is not hidden', async () => {
+      const router = createRouter();
+      const wrapper = await fixture<Transaction>(html`
+        <foxy-nucleon
+          href="https://demo.api/hapi/transactions/0"
+          @fetch=${(evt: FetchEvent) => router.handleEvent(evt)}
+        >
+          <foxy-internal-transaction-actions-control infer="actions">
+          </foxy-internal-transaction-actions-control>
+        </foxy-nucleon>
+      `);
+
+      await waitUntil(() => wrapper.in({ idle: 'snapshot' }));
+      const control = wrapper.firstElementChild as InternalTransactionActionsControl;
+
+      wrapper.data = { ...wrapper.data!, hide_transaction: false };
+      await wrapper.requestUpdate();
+      await control.requestUpdate();
+
+      const label = control.renderRoot.querySelector('foxy-i18n[infer="archive"]');
+      expect(label).to.exist;
+      expect(label).to.have.attribute('key', 'caption_archive');
+
+      const editMethod = stub(wrapper, 'edit');
+      const submitMethod = stub(wrapper, 'submit');
+      const button = label?.closest('vaadin-button');
+      button?.dispatchEvent(new CustomEvent('click'));
+      expect(editMethod).to.have.been.calledOnceWith({ hide_transaction: true });
+      expect(submitMethod).to.have.been.calledOnce;
+    });
+
+    it('renders Unarchive button if transaction is hidden', async () => {
+      const router = createRouter();
+      const wrapper = await fixture<Transaction>(html`
+        <foxy-nucleon
+          href="https://demo.api/hapi/transactions/0"
+          @fetch=${(evt: FetchEvent) => router.handleEvent(evt)}
+        >
+          <foxy-internal-transaction-actions-control infer="actions">
+          </foxy-internal-transaction-actions-control>
+        </foxy-nucleon>
+      `);
+
+      await waitUntil(() => wrapper.in({ idle: 'snapshot' }));
+      const control = wrapper.firstElementChild as InternalTransactionActionsControl;
+
+      wrapper.data = { ...wrapper.data!, hide_transaction: true };
+      await wrapper.requestUpdate();
+      await control.requestUpdate();
+
+      const label = control.renderRoot.querySelector('foxy-i18n[infer="archive"]');
+      expect(label).to.exist;
+      expect(label).to.have.attribute('key', 'caption_unarchive');
+
+      const editMethod = stub(wrapper, 'edit');
+      const submitMethod = stub(wrapper, 'submit');
+      const button = label?.closest('vaadin-button');
+      button?.dispatchEvent(new CustomEvent('click'));
+      expect(editMethod).to.have.been.calledOnceWith({ hide_transaction: false });
+      expect(submitMethod).to.have.been.calledOnce;
+    });
+
+    it('conditionally disables Archive button', async () => {
+      const control = (await fixture(html`
+        <foxy-internal-transaction-actions-control></foxy-internal-transaction-actions-control>
+      `)) as InternalTransactionActionsControl;
+
+      const label = control.renderRoot.querySelector('foxy-i18n[infer="archive"]');
+      const button = label?.closest('vaadin-button');
+      expect(button).to.not.have.attribute('disabled');
+
+      control.disabled = true;
+      await control.requestUpdate();
+      expect(button).to.have.attribute('disabled');
+
+      control.disabled = false;
+      control.disabledControls = new BooleanSelector('archive');
+      await control.requestUpdate();
+      expect(button).to.have.attribute('disabled');
+    });
   });
 });
diff --git a/...ansaction/internal/InternalTransactionActionsControl/InternalTransactionActionsControl.ts b/...ansaction/internal/InternalTransactionActionsControl/InternalTransactionActionsControl.ts
@@ -5,6 +5,8 @@ import { Transaction } from '../../Transaction';
 
 export class InternalTransactionActionsControl extends InternalControl {
   renderControl(): TemplateResult {
+    const host = this.nucleon as Transaction | null;
+
     return html`
       <div class="flex flex-wrap gap-x-m gap-y-xs">
         ${this.nucleon?.data?._links['fx:capture'] ? this.__renderCaptureAction() : ''}
@@ -13,6 +15,21 @@ export class InternalTransactionActionsControl extends InternalControl {
         ${this.nucleon?.data?._links['fx:send_emails'] ? this.__renderSendEmailsAction() : ''}
         ${this.nucleon?.data?._links['fx:subscription'] ? this.__renderSubscriptionAction() : ''}
         ${this.nucleon?.data?._links['fx:receipt'] ? this.__renderReceiptAction() : ''}
+
+        <vaadin-button
+          theme="tertiary-inline"
+          ?disabled=${this.disabledSelector.matches('archive', true)}
+          @click=${() => {
+            host?.edit({ hide_transaction: !host?.form.hide_transaction });
+            host?.submit();
+          }}
+        >
+          <foxy-i18n
+            infer="archive"
+            key="caption_${host?.form.hide_transaction ? 'unarchive' : 'archive'}"
+          >
+          </foxy-i18n>
+        </vaadin-button>
       </div>
     `;
   }

diff --git a/src/elements/public/Transaction/internal/InternalTransactionActionsControl/index.ts b/src/elements/public/Transaction/internal/InternalTransactionActionsControl/index.ts
@@ -1,4 +1,6 @@
+import '@vaadin/vaadin-button';
 import '../../../../internal/InternalControl/index';
+import '../../../I18n/index';
 import '../InternalTransactionPostActionControl/index';
 
 import { InternalTransactionActionsControl as Control } from './InternalTransactionActionsControl';

diff --git a/src/static/translations/admin-subscription-form/en.json b/src/static/translations/admin-subscription-form/en.json
@@ -2004,6 +2004,10 @@
           },
           "receipt": {
             "caption": "View receipt"
+          },
+          "archive": {
+            "caption_archive": "Archive",
+            "caption_unarchive": "Unarchive"
           }
         },
         "spinner": {

diff --git a/src/static/translations/transaction/en.json b/src/static/translations/transaction/en.json
@@ -1717,6 +1717,10 @@
     },
     "receipt": {
       "caption": "View receipt"
+    },
+    "archive": {
+      "caption_archive": "Archive",
+      "caption_unarchive": "Unarchive"
     }
   },
   "spinner": {