import { Box, Button, Typography, useTheme } from '@mui/material' import { useEffect } from 'react' import { useSelector } from 'react-redux' import { Link, useLocation, useNavigate } from 'react-router-dom' import { appPublicRoutes } from '../../routes' import { State } from '../../store/rootReducer' import { saveVisitedLink } from '../../utils' import styles from './style.module.scss' const bodyBackgroundColor = document.body.style.backgroundColor export const LandingPage = () => { const authState = useSelector((state: State) => state.auth) const navigate = useNavigate() const location = useLocation() const theme = useTheme() useEffect(() => { saveVisitedLink(location.pathname, location.search) }, [location]) const onSignInClick = async () => { navigate(appPublicRoutes.login) } return ( <div className={styles.landingPage}> <Box> <Typography sx={{ fontWeight: 'bold', marginBottom: 5, color: bodyBackgroundColor ? theme.palette.getContrastText(bodyBackgroundColor) : '' }} variant="h4" > Secure Document Signing </Typography> <Typography sx={{ color: bodyBackgroundColor ? theme.palette.getContrastText(bodyBackgroundColor) : '' }} variant="body1" > SIGit is an open-source and self-hostable solution for secure document signing and verification. Code is MIT licenced and available at{' '} <a className="bold-link" target="_blank" href="https://git.sigit.io/sig/it" > https://git.sigit.io/sig/it </a> . <br /> <br /> SIGit lets you Create, Sign and Verify from any device with a browser. <br /> <br /> Unlike other solutions, SIGit is totally private - files are encrypted locally, and can only be exported by named recipients. <br /> <br /> Anyone can <Link to={appPublicRoutes.verify}>VERIFY</Link> the exported document. </Typography> </Box> {!authState?.loggedIn && ( <div className={styles.loginBottomBar}> <Button className={styles.loginBtn} variant="contained" onClick={onSignInClick} > GET STARTED </Button> </div> )} </div> ) }