Add loading animation to career item

toggle-corp · Jun 24, 2020 · 649ff58 · 649ff58
1 parent 009e1b8
commit 649ff58
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 8 deletions.
diff --git a/client/src/views/Career/index.js b/client/src/views/Career/index.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { Link } from 'react-router-dom';
 
 import ListView from '#rscv/List/ListView';
+import LoadingAnimation from '#rscv/LoadingAnimation';
 
 import {
  RequestCoordinator,
@@ -46,6 +47,7 @@ function Career(props) {
  const {
  requests: {
  careerGet: {
+ pending,
  response = [],
  },
  },
@@ -87,14 +89,18 @@ function Career(props) {
  </p>
  </div>
  <div className={styles.content}>
- <ListView
- className={styles.career}
- emptyComponent={EmptyComponent}
- keyExtractor={careerKeySelector}
- data={response}
- renderer={CareerItem}
- rendererParams={careerItemsRendererParams}
- />
+ {!pending ? (
+ <LoadingAnimation />
+ ) : (
+ <ListView
+ className={styles.career}
+ emptyComponent={EmptyComponent}
+ keyExtractor={careerKeySelector}
+ data={response}
+ renderer={CareerItem}
+ rendererParams={careerItemsRendererParams}
+ />
+ )}
  </div>
  <div className={styles.footer}>
  <div className={styles.innerChild}>

diff --git a/client/src/views/Career/styles.scss b/client/src/views/Career/styles.scss
@@ -68,6 +68,7 @@
 
  .content {
  display: flex;
+ position: relative;
  flex-direction: column;
  flex-grow: 1;
  width: 100vw;