All files / client/src/components PrivacyNotice.tsx

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
 
 
 
 
 
 
 
 
 
520x
 
 
 
520x
152x
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1x
 
 
 
import { ReactElement, Suspense } from "react";
import { useTranslation } from "react-i18next";
import styled from "styled-components";
import { Accordion } from "client/components/Accordion";
import { Loading } from "client/components/Loading";
import { lazyWithRetry } from "client/utils/lazyWithRetry";
 
// The accordion only mounts its content once opened, so the notice text is
// fetched when a registering user asks to read it rather than on every load
const PrivacyNoticeText = lazyWithRetry(
  async () => await import("client/markdown/PrivacyNotice.mdx"),
);
 
export const PrivacyNotice = (): ReactElement => {
  const { t } = useTranslation();
 
  return (
    <Accordion
      closeAccordionText={t("hidePrivacyNotice")}
      openAccordionText={t("showPrivacyNotice")}
    >
      <PrivacyNoticeContent>
        <Suspense fallback={<Loading />}>
          <PrivacyNoticeText />
        </Suspense>
      </PrivacyNoticeContent>
    </Accordion>
  );
};
 
const PrivacyNoticeContent = styled.div`
  padding: 0 10px;
`;