wnqueiroz

$ npm i --package-lock-only

wnqueiroz

body {
  background-color: blue;
}

wnqueiroz

import React, { Component } from 'react'
 
import { getUsers } from '../services/api'
 
class Users extends Component {
 
    state = {
        loading: false
    }
 

wnqueiroz

import React, { Component } from 'react'
 
import { getDepartments } from '../services/api'
 
class Departments extends Component {
 
    state = {
        loading: false
    }
 

wnqueiroz

import React, { Component, Fragment } from 'react'

import Departments from './components/Departments'
import Users from './components/Users'
import Loading from './components/Loading'

import './index.css'

const LoadingContext = React.createContext({
    loading: false,

wnqueiroz

import React, { Component, Fragment } from 'react'

import Departments from './components/Departments'
import Users from './components/Users'

import './index.css'

const LoadingContext = React.createContext({
    loading: false,
    message: null,

wnqueiroz

import React, { Component, Fragment } from 'react'
 
import Loading from './Loading'
 
import { getDepartments } from '../services/api'
 
class Departments extends Component {
 
    state = {
        loading: false

wnqueiroz

import React, { Component, Fragment } from 'react'
 
import Loading from './Loading'
 
import { getUsers } from '../services/api'
 
class Users extends Component {
 
    state = {
        loading: false

wnqueiroz

import React from 'react' 
 
import Spinner from 'react-spinkit' 
 
const Loading = ({ loading, message }) => { 
    return loading ? ( 
        <div className='overlay-content'> 
            <div className='wrapper'> 
                <Spinner 
                    name='pacman' 

wnqueiroz

.overlay-content {
    display: flex;
    width: 100%;
    left: 0;
    top: 0;
    align-items: center;
    height: 100%;
    justify-content: center;
    position: fixed;
    z-index: 999999;