45 lines
1.3 KiB
JavaScript
45 lines
1.3 KiB
JavaScript
import { Link } from "react-router-dom";
|
|
import AppLogoMarkup from "../components/ui/AppLogoMarkup";
|
|
import AnimatedPage from "../components/AnimatedPage";
|
|
import { useUser } from "../hooks/useUser";
|
|
import LanguageSelect from "../components/ui/LanguageSelect";
|
|
|
|
import truckAnimation from "../assets/animations/chargement-vehicules";
|
|
|
|
import Lottie from "react-lottie";
|
|
import Loading from "../components/animations/Loading";
|
|
|
|
export default function Welcome() {
|
|
const { screensTranslations } = useUser();
|
|
|
|
if (!screensTranslations || !screensTranslations.welcome) return <Loading />;
|
|
const currentScreenTranslations = screensTranslations.welcome;
|
|
|
|
const defaultOptions = {
|
|
loop: true,
|
|
autoplay: true,
|
|
animationData: truckAnimation,
|
|
rendererSettings: {
|
|
preserveAspectRatio: "xMidYMid slice",
|
|
},
|
|
};
|
|
|
|
return (
|
|
<AnimatedPage className='page-container page-container--welcome'>
|
|
<AppLogoMarkup />
|
|
<div className='truck-animation'>
|
|
<Lottie options={defaultOptions} />
|
|
</div>
|
|
<div className='interaction-buttons'>
|
|
<LanguageSelect />
|
|
<Link
|
|
to='/warning'
|
|
title={currentScreenTranslations.enter}
|
|
className='cta cta--construction cta--lhoist cta--button-icon cta--start'>
|
|
<span>{currentScreenTranslations.enter}</span>
|
|
</Link>
|
|
</div>
|
|
</AnimatedPage>
|
|
);
|
|
}
|