🎨 loader on image get from ipfs

src/front/Components/DesignSystem/FilePreview/classes.module.scss

@@ -1,9 +1,12 @@
 .root {
 	height: inherit;
 	min-height: inherit;
+	position: relative;
+
 	.file-container {
 		height: inherit;
 		min-height: inherit;
+
 		.image {
 			width: 100%;
 			height: inherit;
@@ -17,4 +20,15 @@
 			height: inherit;
 		}
 	}
+
+	.loader {
+		width: 48px;
+		height: 48px;
+		z-index: -1;
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		transform: translate(-50%, -50%);
+	}
+
 }

src/front/Components/DesignSystem/FilePreview/index.tsx

@@ -2,6 +2,7 @@ import React from "react";
 
 import Typography, { ITypo, ITypoColor } from "../Typography";
 import classes from "./classes.module.scss";
+import Loader from "../Loader";
 
 type IProps = {
 	href: string;
@@ -12,9 +13,13 @@ type IState = {};
 export default class FilePreview extends React.Component<IProps, IState> {
 	override render() {
 		let type = this.props.href.split(".").pop();
-		if(this.props.fileName) type = this.props.fileName.split(".").pop();
+		if (this.props.fileName) type = this.props.fileName.split(".").pop();
 		return (
 			<div className={classes["root"]}>
+				<div className={classes["loader"]}>
+					<Loader />
+				</div>
+
 				{!type && (
 					<Typography typo={ITypo.H1} color={ITypoColor.BLACK}>
 						Erreur lors du chargement du fichier