feat(webapp): add loader animation

edenia · Jan 19, 2022 · e79c602 · e79c602
1 parent 3f56bc4
commit e79c602
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 18 deletions.
diff --git a/webapp/src/components/Loader/styles.js b/webapp/src/components/Loader/styles.js
@@ -3,6 +3,7 @@ export default () => ({
     justifyContent: 'center',
     alignItems: 'center',
     display: 'flex',
-    minHeight: '100%'
+    minHeight: '100%',
+    minWidth: '100%'
   }
 })
diff --git a/webapp/src/routes/Admin/index.js b/webapp/src/routes/Admin/index.js
@@ -296,6 +296,7 @@ const Admin = () => {
   const [newUsersPagination, setNewUsersPagination] = useState(
     initNewUsersPagination
   )
+  const [fetchingData, setFetchingData] = useState(false)
   const [filterRowsBy, setFilterRowsBy] = useState()
   const [userRows, setUserRows] = useState([])
   const [userPagination, setUserPagination] = useState({})
@@ -340,6 +341,7 @@ const Admin = () => {
       cursor: users.cursor
     })
     setUserRows(pagination.cursor ? [...userRows, ...newRows] : newRows)
+    setFetchingData(false)
   }
 
   const deleteNewUsers = async (showSnack = true) => {
@@ -414,7 +416,8 @@ const Admin = () => {
     }
   }
 
-  const reloadUsers = () => {
+  const reloadUsers = async () => {
+    setFetchingData(true)
     setUserPagination({
       hasMore: false,
       cursor: ''
@@ -488,9 +491,11 @@ const Admin = () => {
       cursor: referrals.cursor
     })
     setReferralRows(pagination.cursor ? [...referralRows, ...newRows] : newRows)
+    setFetchingData(false)
   }
 
   const reloadReferrals = () => {
+    setFetchingData(true)
     setReferralPagination({
       hasMore: false,
       cursor: ''
@@ -943,10 +948,8 @@ const Admin = () => {
         </Box>
       </Modal>
 
-      <Modal open={openInfoModal || true} setOpen={setOpenInfoModal}>
-        <Box className={classes.rejectModal}>
-          <Loader />
-        </Box>
+      <Modal open={fetchingData} setOpen={setOpenInfoModal}>
+        <Loader />
       </Modal>
     </Box>
   )

diff --git a/webapp/yarn.lock b/webapp/yarn.lock
@@ -8005,20 +8005,20 @@ fsevents@^1.2.7:
 
 "fsevents@patch:fsevents@^1.2.7#~builtin<compat/fsevents>":
   version: 1.2.13
-  resolution: "fsevents@patch:fsevents@npm%3A1.2.13#~builtin<compat/fsevents>::version=1.2.13&hash=1cc4b2"
+  resolution: "fsevents@patch:fsevents@npm%3A1.2.13#~builtin<compat/fsevents>::version=1.2.13&hash=18f3a7"
   dependencies:
     bindings: ^1.5.0
     nan: ^2.12.1
-  checksum: b264407498db2cfdcc2a05287334a4160c985a88e4a989e2f2f8dcc6afc8b04a4fcd82c797266442452e11c1fb07d7747d138b078fe4bb1f8f4fd2a6f2484d7e
+  checksum: 2587e64097c1251ae549440b6347954ef3c5ce390061f9e0f0810e83d5d604bb7222c382e7e3c39fc2ba4da53f115b118ea5359ca3bb0bcb96576596bc685d5a
   languageName: node
   linkType: hard
 
 "fsevents@patch:fsevents@^2.1.2#~builtin<compat/fsevents>, fsevents@patch:fsevents@^2.1.3#~builtin<compat/fsevents>, fsevents@patch:fsevents@~2.3.2#~builtin<compat/fsevents>":
   version: 2.3.2
-  resolution: "fsevents@patch:fsevents@npm%3A2.3.2#~builtin<compat/fsevents>::version=2.3.2&hash=1cc4b2"
+  resolution: "fsevents@patch:fsevents@npm%3A2.3.2#~builtin<compat/fsevents>::version=2.3.2&hash=18f3a7"
   dependencies:
     node-gyp: latest
-  checksum: 78db9daf1f6526a49cefee3917cc988f62dc7f25b5dd80ad6de4ffc4af7f0cab7491ac737626ff53e482a111bc53aac9e411fe3602458eca36f6a003ecf69c16
+  checksum: edbd0fd80be379c14409605f77e52fdc78a119e17f875e8b90a220c3e5b29e54a1477c21d91fd30b957ea4866406dc3ff87b61432d2840ff8866b309e5866140
   languageName: node
   linkType: hard
 
@@ -14650,31 +14650,31 @@ resolve@^2.0.0-next.3:
 
 "resolve@patch:resolve@1.18.1#~builtin<compat/resolve>":
   version: 1.18.1
-  resolution: "resolve@patch:resolve@npm%3A1.18.1#~builtin<compat/resolve>::version=1.18.1&hash=00b1ff"
+  resolution: "resolve@patch:resolve@npm%3A1.18.1#~builtin<compat/resolve>::version=1.18.1&hash=d4691f"
   dependencies:
     is-core-module: ^2.0.0
     path-parse: ^1.0.6
-  checksum: 3a5051499a570cf94d74353d494cacadbfa489107def201f87e26cabd80d000bd8abccbe247783b86b06d86ce2c646eee5c55900c71cbf1ad2043a67a92b0242
+  checksum: 32933bdf7bcc93bb7e01646f60a471b2cee0262b465449170ce02f4efea71868e4a9624aded28ce3935bc333028c2cc10885ac2b578125381a9de6481e8c1ce2
   languageName: node
   linkType: hard
 
 "resolve@patch:resolve@^1.10.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.10.1#~builtin<compat/resolve>, resolve@patch:resolve@^1.12.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.14.2#~builtin<compat/resolve>, resolve@patch:resolve@^1.17.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.18.1#~builtin<compat/resolve>, resolve@patch:resolve@^1.20.0#~builtin<compat/resolve>, resolve@patch:resolve@^1.3.2#~builtin<compat/resolve>, resolve@patch:resolve@^1.8.1#~builtin<compat/resolve>":
   version: 1.20.0
-  resolution: "resolve@patch:resolve@npm%3A1.20.0#~builtin<compat/resolve>::version=1.20.0&hash=00b1ff"
+  resolution: "resolve@patch:resolve@npm%3A1.20.0#~builtin<compat/resolve>::version=1.20.0&hash=d4691f"
   dependencies:
     is-core-module: ^2.2.0
     path-parse: ^1.0.6
-  checksum: bed00be983cd20a8af0e7840664f655c4b269786dbd9595c5f156cd9d8a0050e65cdbbbdafc30ee9b6245b230c78a2c8ab6447a52545b582f476c29adb188cc5
+  checksum: 028141533a81a4515c8ac07e38a0ccde5e2722a0fa6bb83ac53ec463a764f1b7c021dcb98fc9a511a4f6e403f354d034bf250fcf9b7b8399bceb2a889ddf78ff
   languageName: node
   linkType: hard
 
 "resolve@patch:resolve@^2.0.0-next.3#~builtin<compat/resolve>":
   version: 2.0.0-next.3
-  resolution: "resolve@patch:resolve@npm%3A2.0.0-next.3#~builtin<compat/resolve>::version=2.0.0-next.3&hash=00b1ff"
+  resolution: "resolve@patch:resolve@npm%3A2.0.0-next.3#~builtin<compat/resolve>::version=2.0.0-next.3&hash=d4691f"
   dependencies:
     is-core-module: ^2.2.0
     path-parse: ^1.0.6
-  checksum: eb88c5e53843bc022215744307a5f5664446c0fdb8f43c33456dce98d5ee6b3162d0cd0a177bb6f1c3d5c8bf01391ac7ab2de0e936e35318725fb40ba7efdaf6
+  checksum: 2b145f11f797d477c355e53dc70a1b991d95e7954ea6ab258bc1905d4c1658d477a7bcf912eda56c9643080206fe1f44a53fe96559e8da17140347447ce9c025
   languageName: node
   linkType: hard
 
@@ -16541,11 +16541,11 @@ typescript@*:
 
 "typescript@patch:typescript@*#~builtin<compat/typescript>":
   version: 4.4.4
-  resolution: "typescript@patch:typescript@npm%3A4.4.4#~builtin<compat/typescript>::version=4.4.4&hash=d8b4e7"
+  resolution: "typescript@patch:typescript@npm%3A4.4.4#~builtin<compat/typescript>::version=4.4.4&hash=6454cb"
   bin:
     tsc: bin/tsc
     tsserver: bin/tsserver
-  checksum: 4a639b6886be13616582ab82abdb4ffbbf5b0458069d13c10cd5d44fc1cafa33eab005e8ac8691ad8fae249fee85844bb7d523263c4568fe9a2ca31cd3c91c3d
+  checksum: aaf433508f31ca748d391e488ccb10485407f5920084fff35926076e6089009474929c1c43d0d5a0dafca65fec51550e032e0f0b28ce63c68432adc70b1bc9b3
   languageName: node
   linkType: hard