Differential D7870 Diff 27228 landing/landing.react.js

Changeset View

Standalone View

landing/landing.react.js

// @flow		// @flow

import classNames from 'classnames';		import classNames from 'classnames';
import * as React from 'react';		import * as React from 'react';
import { useRouteMatch } from 'react-router-dom';		import { useRouteMatch } from 'react-router-dom';

import {		import {
ModalProvider,		ModalProvider,
useModalContext,		useModalContext,
} from 'lib/components/modal-provider.react.js';		} from 'lib/components/modal-provider.react.js';

import AppLanding from './app-landing.react.js';		import AppLanding from './app-landing.react.js';
import Footer from './footer.react.js';		import Footer from './footer.react.js';
import Header from './header.react.js';		import Header, { HEADER_BREAKPOINT } from './header.react.js';
import Investors from './investors.react.js';		import Investors from './investors.react.js';
import Keyservers from './keyservers.react.js';		import Keyservers from './keyservers.react.js';
import css from './landing.css';		import css from './landing.css';
import MobileNav from './mobile-nav.react.js';		import MobileNav from './mobile-nav.react.js';
import Privacy from './privacy.react.js';		import Privacy from './privacy.react.js';
import QR from './qr.react.js';		import QR from './qr.react.js';
import SIWE from './siwe.react.js';		import SIWE from './siwe.react.js';
import Support from './support.react.js';		import Support from './support.react.js';
Show All 23 Lines	() =>
modalContext.modals.map(([modal, key]) => (		modalContext.modals.map(([modal, key]) => (
<React.Fragment key={key}>{modal}</React.Fragment>		<React.Fragment key={key}>{modal}</React.Fragment>
)),		)),
[modalContext.modals],		[modalContext.modals],
);		);

const [showMobileNav, setShowMobileNav] = React.useState<boolean>(false);		const [showMobileNav, setShowMobileNav] = React.useState<boolean>(false);

		const handleResize = React.useCallback(() => {
		if (window.innerWidth > HEADER_BREAKPOINT) {
		setShowMobileNav(false);
		}
		}, [setShowMobileNav]);

		React.useEffect(() => {
		if (!showMobileNav) {
		return undefined;
		}

		window.addEventListener('resize', handleResize);
		return () => {
		window.removeEventListener('resize', handleResize);
		};
		}, [handleResize, showMobileNav]);

const innerContainerClassName = classNames({		const innerContainerClassName = classNames({
[css.innerContainer]: true,		[css.innerContainer]: true,
[css.innerContainerMobileNav]: showMobileNav,		[css.innerContainerMobileNav]: showMobileNav,
});		});

useScrollToTopOnNavigate();		useScrollToTopOnNavigate();
const onPrivacy = useRouteMatch({ path: '/privacy' });		const onPrivacy = useRouteMatch({ path: '/privacy' });
const onTerms = useRouteMatch({ path: '/terms' });		const onTerms = useRouteMatch({ path: '/terms' });
▲ Show 20 Lines • Show All 60 Lines • Show Last 20 Lines