Merge branch 'dev' into staging

next.config.js

@@ -4,14 +4,14 @@ const nextConfig = {
 	reactStrictMode: false,
 	publicRuntimeConfig: {
 		// Will be available on both server and client
-		BACK_API_PROTOCOL: process.env.NEXT_PUBLIC_BACK_API_PROTOCOL,
+		NEXT_PUBLIC_BACK_API_PROTOCOL: process.env.NEXT_PUBLIC_BACK_API_PROTOCOL,
-		BACK_API_HOST: process.env.NEXT_PUBLIC_BACK_API_HOST,
+		NEXT_PUBLIC_BACK_API_HOST: process.env.NEXT_PUBLIC_BACK_API_HOST,
-		BACK_API_ROOT_URL: process.env.NEXT_PUBLIC_BACK_API_ROOT_URL,
+		NEXT_PUBLIC_BACK_API_ROOT_URL: process.env.NEXT_PUBLIC_BACK_API_ROOT_URL,
-		BACK_API_VERSION: process.env.NEXT_PUBLIC_BACK_API_VERSION,
+		NEXT_PUBLIC_BACK_API_VERSION: process.env.NEXT_PUBLIC_BACK_API_VERSION,
-		FRONT_APP_HOST: process.env.NEXT_PUBLIC_FRONT_APP_HOST,
+		NEXT_PUBLIC_FRONT_APP_HOST: process.env.NEXT_PUBLIC_FRONT_APP_HOST,
-		FRONT_APP_PORT: process.env.NEXT_PUBLIC_FRONT_APP_PORT,
+		NEXT_PUBLIC_FRONT_APP_PORT: process.env.NEXT_PUBLIC_FRONT_APP_PORT,
-		IDNOT_AUTHORIZE_ENDPOINT: process.env.NEXT_PUBLIC_IDNOT_AUTHORIZE_ENDPOINT,
+		NEXT_PUBLIC_IDNOT_AUTHORIZE_ENDPOINT: process.env.NEXT_PUBLIC_IDNOT_AUTHORIZE_ENDPOINT,
-		IDNOT_CLIENT_ID: process.env.NEXT_PUBLIC_IDNOT_CLIENT_ID,
+		NEXT_PUBLIC_IDNOT_CLIENT_ID: process.env.NEXT_PUBLIC_IDNOT_CLIENT_ID,
 	},
 };
 

package.json

@@ -3,7 +3,7 @@
 	"version": "0.1.0",
 	"private": true,
 	"scripts": {
-		"dev": "next build && next dev",
+		"dev": "next dev",
 		"build": "next build",
 		"start": "next start",
 		"lint": "next lint",

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,8 @@ import React from "react";
 
 import Typography, { ITypo, ITypoColor } from "../Typography";
 import classes from "./classes.module.scss";
+import Loader from "../Loader";
+import Image from "next/image";
 
 type IProps = {
 	href: string;
@@ -12,9 +14,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
@@ -24,7 +30,7 @@ export default class FilePreview extends React.Component<IProps, IState> {
 						{type?.toLowerCase() === "pdf" && (
 							<embed src={this.props.href} width="100%" height="100%" type="application/pdf" className={classes["pdf"]} />
 						)}
-						{type?.toLowerCase() !== "pdf" && <img src={this.props.href} alt="File preview" className={classes["image"]} />}
+						{type?.toLowerCase() !== "pdf" && <Image src={this.props.href} alt="File preview" className={classes["image"]} />}
 					</div>
 			</div>
 		);

src/front/Components/LayoutTemplates/DefaultDoubleSidePage/index.tsx

@@ -40,7 +40,7 @@ export default class DefaultDoubleSidePage extends React.Component<IProps, IStat
 					)}
 					{this.props.type === "background" && (
 						<div className={classNames(classes["sides"], classes["background-image-container"])}>
-							<Image alt={"right side image"} src={this.props.image} className={classes["background-image"]} />
+							<Image alt={"right side image"} src={this.props.image} className={classes["background-image"]} priority />
 						</div>
 					)}
 				</div>

src/front/Components/Layouts/Folder/CreateFolder/index.tsx

@@ -18,7 +18,7 @@ import Users from "@Front/Api/LeCoffreApi/SuperAdmin/Users/Users";
 import User from "le-coffre-resources/dist/Notary";
 import Folders, { IPostFoldersParams } from "@Front/Api/LeCoffreApi/SuperAdmin/Folders/Folders";
 import { NextRouter, useRouter } from "next/router";
-import BackgroundImage from "./background-image.jpeg";
+import backgroundImage from "@Front/assets/images/404-background-image.jpeg";
 
 type IFormValues = {
 	folder_number: string;
@@ -73,7 +73,7 @@ class CreateFolderClass extends BasePage<IPropsClass, IState> {
 
 	public override render(): JSX.Element {
 		return (
-			<DefaultDoubleSidePage title={"Dossier"} image={BackgroundImage} type="background" showHeader={true}>
+			<DefaultDoubleSidePage title={"Dossier"} image={backgroundImage} type="background" showHeader={true}>
 				<div className={classes["root"]}>
 					<BackArrow />
 					<Typography typo={ITypo.H1} color={ITypoColor.BLACK} className={classes["title"]}>

src/front/Components/Layouts/PageNotFound/index.tsx

@@ -6,7 +6,8 @@ import BasePage from "../Base";
 import classes from "./classes.module.scss";
 import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
 
-import backgroundImage from "../Folder/CreateFolder/background-image.jpeg";
+import backgroundImage from "@Front/assets/images/404-background-image.jpeg";
+
 export default class PageNotFound extends BasePage {
 	public override render(): JSX.Element {
 		return (