2021-04-07 16:21:12 +02:00
|
|
|
import React, { Suspense } from 'react';
|
|
|
|
|
2020-11-09 15:17:38 +01:00
|
|
|
/**
|
2022-01-17 15:24:07 +01:00
|
|
|
* This component is a wrapper that display a loader while the children components have their rendering suspended.
|
2020-11-09 15:17:38 +01:00
|
|
|
*/
|
2021-07-01 12:34:10 +02:00
|
|
|
export const Loader: React.FC = ({ children }) => {
|
2020-11-09 15:17:38 +01:00
|
|
|
const loading = (
|
|
|
|
<div className="fa-3x">
|
|
|
|
<i className="fas fa-circle-notch fa-spin" />
|
|
|
|
</div>
|
2021-06-10 12:52:14 +02:00
|
|
|
);
|
2020-11-09 15:17:38 +01:00
|
|
|
return (
|
|
|
|
<Suspense fallback={loading}>
|
2021-07-01 12:34:10 +02:00
|
|
|
{children}
|
2020-11-09 15:17:38 +01:00
|
|
|
</Suspense>
|
|
|
|
);
|
2021-07-01 12:34:10 +02:00
|
|
|
};
|