From 8b0feb902284ff36350663b2b2113ac13b70f5f6 Mon Sep 17 00:00:00 2001
From: Ahmed Bouhuolia <a.bouhuolia@gmail.com>
Date: Sun, 16 Jul 2023 21:19:06 +0200
Subject: [PATCH] fix(webapp): handle the too many requests error

---
 .../src/containers/GlobalErrors/GlobalErrors.tsx    | 13 +++++++++++++
 packages/webapp/src/hooks/useRequest.tsx            |  3 +++
 packages/webapp/src/lang/en/index.json              |  3 ++-
 .../src/style/components/BigcapitalLoading.scss     |  6 ++++--
 packages/webapp/src/style/variables.scss            |  4 ++++
 5 files changed, 26 insertions(+), 3 deletions(-)

diff --git a/packages/webapp/src/containers/GlobalErrors/GlobalErrors.tsx b/packages/webapp/src/containers/GlobalErrors/GlobalErrors.tsx
index 211402c0f..e972733d8 100644
--- a/packages/webapp/src/containers/GlobalErrors/GlobalErrors.tsx
+++ b/packages/webapp/src/containers/GlobalErrors/GlobalErrors.tsx
@@ -9,6 +9,7 @@ import { compose } from '@/utils';
 
 let toastKeySessionExpired;
 let toastKeySomethingWrong;
+let toastTooManyRequests;
 
 function GlobalErrors({
   // #withGlobalErrors
@@ -41,6 +42,18 @@ function GlobalErrors({
       toastKeySomethingWrong,
     );
   }
+  if (globalErrors.too_many_requests) {
+    toastTooManyRequests = AppToaster.show(
+      {
+        message: intl.get('global_error.too_many_requests'),
+        intent: Intent.DANGER,
+        onDismiss: () => {
+          globalErrorsSet({ too_many_requests: false });
+        },
+      },
+      toastTooManyRequests,
+    );
+  }
   if (globalErrors.access_denied) {
     toastKeySomethingWrong = AppToaster.show(
       {
diff --git a/packages/webapp/src/hooks/useRequest.tsx b/packages/webapp/src/hooks/useRequest.tsx
index c092f1faf..12635ad0a 100644
--- a/packages/webapp/src/hooks/useRequest.tsx
+++ b/packages/webapp/src/hooks/useRequest.tsx
@@ -60,6 +60,9 @@ export default function useApiRequest() {
         if (status === 403) {
           setGlobalErrors({ access_denied: true });
         }
+        if (status === 429) {
+          setGlobalErrors({ too_many_requests: true });
+        }
         if (status === 400) {
           const lockedError = data.errors.find(
             (error) => error.type === 'TRANSACTIONS_DATE_LOCKED',
diff --git a/packages/webapp/src/lang/en/index.json b/packages/webapp/src/lang/en/index.json
index 2010d32b1..6fb394354 100644
--- a/packages/webapp/src/lang/en/index.json
+++ b/packages/webapp/src/lang/en/index.json
@@ -2292,5 +2292,6 @@
   "sidebar.projects": "Projects",
   "sidebar.new_project": "New Project",
   "sidebar.new_time_entry": "New Time Entry",
-  "sidebar.project_profitability_summary": "Project Profitability Summary"
+  "sidebar.project_profitability_summary": "Project Profitability Summary",
+  "global_error.too_many_requests": "Too many requests"
 }
\ No newline at end of file
diff --git a/packages/webapp/src/style/components/BigcapitalLoading.scss b/packages/webapp/src/style/components/BigcapitalLoading.scss
index 2375d2a1f..c387b5b13 100644
--- a/packages/webapp/src/style/components/BigcapitalLoading.scss
+++ b/packages/webapp/src/style/components/BigcapitalLoading.scss
@@ -1,10 +1,12 @@
+@import '@/style/variables.scss';
+
 .bigcapital-loading {
   height: 100%;
   width: 100%;
   position: fixed;
   display: flex;
   background: #fff;
-  z-index: 999999;
+  z-index: $zindex-dashboard-splash-screen;
 
   .center {
     width: auto;
@@ -18,4 +20,4 @@
     opacity: 0.85;
     display: none;
   }
-}
+}
\ No newline at end of file
diff --git a/packages/webapp/src/style/variables.scss b/packages/webapp/src/style/variables.scss
index bea903aa4..21fe0ded6 100644
--- a/packages/webapp/src/style/variables.scss
+++ b/packages/webapp/src/style/variables.scss
@@ -45,3 +45,7 @@ $form-check-input-checked-color: #fff;
 $form-check-input-checked-bg-color: $blue1;
 $form-check-input-checked-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16 16' enable-background='new 0 0 16 16' xml:space='preserve'><g id='small_tick_1_'><g><path fill='#{$form-check-input-checked-color}' fill-rule='evenodd' clip-rule='evenodd' d='M12,5c-0.28,0-0.53,0.11-0.71,0.29L7,9.59L4.71,7.29C4.53,7.11,4.28,7,4,7C3.45,7,3,7.45,3,8c0,0.28,0.11,0.53,0.29,0.71l3,3C6.47,11.89,6.72,12,7,12s0.53-0.11,0.71-0.29l5-5C12.89,6.53,13,6.28,13,6C13,5.45,12.55,5,12,5z'/></g></g></svg>") !default;
 $form-check-input-indeterminate-bg-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 16 16' enable-background='new 0 0 16 16' xml:space='preserve'><g id='small_tick_1_'><g><path fill='#{$form-check-input-checked-color}' fill-rule='evenodd' clip-rule='evenodd' d='M11,7H5C4.45,7,4,7.45,4,8c0,0.55,0.45,1,1,1h6c0.55,0,1-0.45,1-1C12,7.45,11.55,7,11,7z'/></g></g></svg>") !default;
+
+// z-indexs
+$zindex-dashboard-splash-screen: 39;
+$zindex-toast: 40;
\ No newline at end of file