@internetarchive/ia-book-actions 0.0.7-2 → 0.0.7-3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@internetarchive/ia-book-actions",
-  "version": "0.0.7-02",
+  "version": "0.0.7-03",
   "description": "Bookreader actions for borrowable book",
   "author": "Internet Archive",
   "license": "AGPL-3.0-only",

package/src/components/collapsible-action-group.js

@@ -63,7 +63,11 @@ export class CollapsibleActionGroup extends ActionsHandler {
     }
   }
 
-  /* emit custom event to fetch loan token */
+  /**
+   * Handles events when user is borrowing book and wants to have access to read
+   *
+   * @fires CollapsibleActionGroup#enableBookAccess
+   */
   emitEnableBookAccess() {
     // send consecutiveLoanCounts for browsed books only.
     if (this.borrowType === 'browsing') {
@@ -222,11 +226,13 @@ export class CollapsibleActionGroup extends ActionsHandler {
   }
 
   /**
-   * Click handler to emit custom event on action click
-   * @param { string } eventName
-   * @param { object } gaEvent
+   * Handles click events when user click on action buttons
+   * @param { string } eventName - actions like 'browseBook', 'borrowBook' etc...
+   * @param { object } gaEvent - contains analytics event action and category
    *   @param { string } gaEvent.category
    *   @param { string } gaEvent.action
+   *
+   * @fires CollapsibleActionGroup#{eventName} - (will be browseBook, borrowBook etc...)
    */
   clickHandler(eventName, gaEvent) {
     this.dropdownState = 'close';

package/src/core/services/actions-handler/actions-handler.js

@@ -14,7 +14,7 @@ export default class ActionsHandler extends LitElement {
   constructor(identifier) {
     super();
     this.identifier = identifier;
-    this.ajaxTimeout = 6000;
+    this.ajaxTimeout = 7000;
     this.loanTokenPollingDelay =
       window.location.pathname === '/demo/' ? 2000 : 120000; // 120000 ms = 2 min
     this.loanTokenInterval = undefined;
@@ -119,102 +119,102 @@ export default class ActionsHandler extends LitElement {
   }
 
   handleBrowseIt() {
-    const context = 'browse_book';
+    const action = 'browse_book';
     this.dispatchToggleActionGroup();
 
     ActionsHandlerService({
-      action: context,
+      action,
       identifier: this.identifier,
       success: () => {
         this.handleReadItNow();
       },
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
       },
     });
   }
 
   handleReturnIt() {
-    const context = 'return_loan';
+    const action = 'return_loan';
     this.dispatchToggleActionGroup();
 
     ActionsHandlerService({
-      action: context,
+      action,
       identifier: this.identifier,
       success: () => {
         this.deleteLoanCookies();
         URLHelper.goToUrl(`/details/${this.identifier}`, true);
       },
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
       },
     });
   }
 
   handleBorrowIt() {
-    const context = 'borrow_book';
+    const action = 'borrow_book';
     this.dispatchToggleActionGroup();
 
     ActionsHandlerService({
-      action: context,
+      action,
       identifier: this.identifier,
       success: () => {
         this.handleReadItNow();
       },
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
       },
     });
   }
 
   handleReserveIt() {
-    const context = 'join_waitlist';
+    const action = 'join_waitlist';
     this.dispatchToggleActionGroup();
 
     ActionsHandlerService({
-      action: context,
+      action,
       identifier: this.identifier,
       success: () => {
         URLHelper.goToUrl(URLHelper.getRedirectUrl(), true);
       },
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
       },
     });
   }
 
   handleRemoveFromWaitingList() {
-    const context = 'leave_waitlist';
+    const action = 'leave_waitlist';
     this.dispatchToggleActionGroup();
 
     ActionsHandlerService({
-      action: context,
+      action,
       identifier: this.identifier,
       success: () => {
         URLHelper.goToUrl(URLHelper.getRedirectUrl(), true);
       },
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
       },
     });
   }
 
   handleLoanTokenPoller() {
-    const context = 'create_token';
+    const action = 'create_token';
     ActionsHandlerService({
       identifier: this.identifier,
-      action: context,
+      action,
       error: data => {
-        this.dispatchActionError(context, data);
+        this.dispatchActionError(action, data);
         clearInterval(this.loanTokenInterval); // stop token fetch api
       },
     });
   }
 
-  dispatchActionError(context, data = {}) {
+  dispatchActionError(action, data = {}) {
     this.dispatchEvent(
       new CustomEvent('lendingActionError', {
-        detail: { context, data },
+        detail: { action, data },
       })
     );
   }

package/src/ia-book-actions.js

@@ -201,28 +201,27 @@ export default class IABookActions extends LitElement {
    *
    * @event IABookActions#lendingActionError
    * @param {Object} event - The employee who is responsible for the project
-   * @param {string} event.detail.context - action when error occurred like 'browseBook', 'borrowBook'
-   * @param {string} event.detail.data.error - error message
+   *  @param {string} event.detail.action - action when error occurred like 'browseBook', 'borrowBook'
+   *  @param {string} event.detail.data.error - error message
    */
   handleLendingActionError(event) {
-    console.log(event?.detail?.data);
     // toggle activity loader
     this.handleToggleActionGroup();
 
-    const context = event?.detail?.context;
+    const action = event?.detail?.action;
     const errorMsg = event?.detail?.data?.error;
 
-    if (errorMsg) this.showErrorModal(errorMsg);
+    if (errorMsg) this.showErrorModal(errorMsg, action);
 
     // update action bar state if book is not available to browse or borrow.
     if (errorMsg && errorMsg.match(/not available to borrow/gm)) {
       let currStatus = this.lendingStatus;
-      if (context === 'browse_book') {
+      if (action === 'browse_book') {
         currStatus = {
           ...this.lendingStatus,
           available_to_browse: false,
         };
-      } else if (context === 'borrow_book') {
+      } else if (action === 'borrow_book') {
         currStatus = {
           ...this.lendingStatus,
           available_to_borrow: false,
@@ -233,7 +232,7 @@ export default class IABookActions extends LitElement {
   }
 
   /* show error message if something went wrong */
-  async showErrorModal(errorMsg) {
+  async showErrorModal(errorMsg, action) {
     this.disableActionGroup = false;
 
     this.modal = document.querySelector('#action-bar-modal');
@@ -243,12 +242,27 @@ export default class IABookActions extends LitElement {
     }
     await document.body.appendChild(this.modal);
 
+    const modalConfig = new ModalConfig({
+      title: 'Lending error',
+      message: errorMsg,
+      headerColor: '#d9534f',
+    });
+
+    if (action === 'create_token') {
+      modalConfig.closeOnBackdropClick = false;
+      modalConfig.showCloseButton = false;
+      modalConfig.message = html` Uh oh, something went wrong trying to access
+        this book.<br />
+        Please <a href="/">refresh</a> to try again or send us an email to
+        <a
+          href="mailto:info@archive.org?subject=Help: cannot access my borrowed book: ${this
+            .identifier}"
+          >info@archive.org</a
+        >`;
+    }
+
     this.modal.showModal({
-      config: new ModalConfig({
-        title: 'Lending error',
-        message: errorMsg,
-        headerColor: '#d9534f',
-      }),
+      config: modalConfig,
     });
   }
 

package/test/components/collapsible-action-group.test.js

@@ -87,7 +87,7 @@ describe('<collapsible-action-group>', () => {
 });
 
 describe('fetch loan token and localStorage for browsed/borrowsed book', () => {
-  afterEach(() => {
+  beforeEach(() => {
     const localStorageMock = {
       getItem: Sinon.spy(),
       setItem: Sinon.spy(),
@@ -97,14 +97,14 @@ describe('fetch loan token and localStorage for browsed/borrowsed book', () => {
     });
   });
 
-  it('test localStorage function when borrowType is browsed', async () => {
-    await fixture(container({ borrowType: 'browsed' }));
+  it('test localStorage function when borrowType is browsing', async () => {
+    await fixture(container({ borrowType: 'browsing' }));
     expect(localStorage.getItem).to.be.calledOnce;
     expect(localStorage.getItem).to.be.calledWith('consecutive-loan-count');
   });
 
-  it('test localStorage function when borrowType is borrowed', async () => {
-    await fixture(container({ borrowType: 'borrowed' }));
+  it('test localStorage function when borrowType is borrowing', async () => {
+    await fixture(container({ borrowType: 'borrowing' }));
     expect(localStorage.getItem).to.not.be.calledOnce;
     expect(localStorage.getItem).to.not.be.calledWith('consecutive-loan-count');
   });

package/test/ia-book-actions.test.js

@@ -122,7 +122,7 @@ describe('Borrow status actions', () => {
     el.addEventListener('lendingActionError', () => {
       el.handleLendingActionError({
         detail: {
-          context: 'browse_book',
+          action: 'browse_book',
           data: { error: 'not available to borrow' },
         },
       });
@@ -151,7 +151,7 @@ describe('Borrow status actions', () => {
     el.addEventListener('lendingActionError', () => {
       el.handleLendingActionError({
         detail: {
-          context: 'borrow_book',
+          action: 'borrow_book',
           data: { error: 'not available to borrow' },
         },
       });