Put adult consent logic all in one place

This commit is contained in:
SleeplessOne1917 2024-04-13 20:35:11 -04:00
parent fb38fafd16
commit c4306787f8
3 changed files with 56 additions and 46 deletions

@ -1 +1 @@
Subproject commit a94ef775f3f923067b48c1719cda206dbcf1a9e5
Subproject commit 4a2a30f4a3778df85e28ceaf541b6c978b321e2a

View file

@ -1,5 +1,5 @@
import { isAnonymousPath, isAuthPath, setIsoData } from "@utils/app";
import { Component, RefObject, createRef, linkEvent } from "inferno";
import { Component, createRef, linkEvent } from "inferno";
import { Provider } from "inferno-i18next-dess";
import { Route, Switch } from "inferno-router";
import { IsoDataOptionalSite } from "../../interfaces";
@ -14,46 +14,14 @@ import "./styles.scss";
import { Theme } from "./theme";
import AnonymousGuard from "../common/anonymous-guard";
import { destroyTippy, setupTippy } from "../../tippy";
import { adultConsentLocalStorageKey } from "../../config";
import AdultConsentModal from "../common/adult-consent-modal";
interface AppState {
showAdultConsentModal: boolean;
}
function handleAdultConsent(i: App) {
localStorage.setItem(adultConsentLocalStorageKey, "true");
i.setState({ showAdultConsentModal: false });
}
function handleAdultConsentGoBack(i: App) {
i.context.router.history.back();
}
export class App extends Component<any, AppState> {
export class App extends Component<any, any> {
private isoData: IsoDataOptionalSite = setIsoData(this.context);
private readonly mainContentRef: RefObject<HTMLElement>;
private readonly mainContentRef = createRef<HTMLElement>();
private readonly rootRef = createRef<HTMLDivElement>();
state: AppState = {
showAdultConsentModal: false,
};
constructor(props: any, context: any) {
super(props, context);
this.mainContentRef = createRef();
}
componentDidMount(): void {
const siteRes = this.isoData.site_res;
if (
siteRes?.site_view.site.content_warning &&
!(siteRes?.my_user || localStorage.getItem(adultConsentLocalStorageKey))
) {
this.setState({ showAdultConsentModal: true });
}
setupTippy(this.rootRef);
}
@ -88,9 +56,6 @@ export class App extends Component<any, AppState> {
{siteRes?.site_view.site.content_warning && (
<AdultConsentModal
contentWarning={siteRes.site_view.site.content_warning}
show={this.state.showAdultConsentModal}
onBack={linkEvent(this, handleAdultConsentGoBack)}
onContinue={linkEvent(this, handleAdultConsent)}
/>
)}
<div className="mt-4 p-0 fl-1">

View file

@ -1,5 +1,8 @@
import { Component, LinkedEvent, RefObject, createRef } from "inferno";
import { Component, LinkedEvent, createRef, linkEvent } from "inferno";
import { modalMixin } from "../mixins/modal-mixin";
import { adultConsentLocalStorageKey } from "../../config";
import { setIsoData } from "@utils/app";
import { IsoDataOptionalSite } from "../../interfaces";
interface AdultConsentModalProps {
contentWarning: string;
@ -9,12 +12,9 @@ interface AdultConsentModalProps {
}
@modalMixin
export default class AdultConsentModal extends Component<
AdultConsentModalProps,
any
> {
readonly modalDivRef: RefObject<HTMLDivElement> = createRef();
readonly continueButtonRef: RefObject<HTMLButtonElement> = createRef();
class AdultConsentModalInner extends Component<AdultConsentModalProps, any> {
readonly modalDivRef = createRef<HTMLDivElement>();
readonly continueButtonRef = createRef<HTMLButtonElement>();
render() {
const { contentWarning, onContinue, onBack } = this.props;
@ -57,3 +57,48 @@ export default class AdultConsentModal extends Component<
this.continueButtonRef.current?.focus();
}
}
interface AdultConsentModalState {
show: boolean;
}
function handleAdultConsent(i: AdultConsentModal) {
localStorage.setItem(adultConsentLocalStorageKey, "true");
i.setState({ show: false });
}
function handleAdultConsentGoBack(i: AdultConsentModal) {
i.context.router.history.back();
}
export default class AdultConsentModal extends Component<
{ contentWarning: string },
AdultConsentModalState
> {
private isoData: IsoDataOptionalSite = setIsoData(this.context);
state: AdultConsentModalState = {
show: false,
};
componentDidMount(): void {
const siteRes = this.isoData.site_res;
if (
siteRes?.site_view.site.content_warning &&
!(siteRes?.my_user || localStorage.getItem(adultConsentLocalStorageKey))
) {
this.setState({ show: true });
}
}
render() {
return (
<AdultConsentModalInner
contentWarning={this.props.contentWarning}
show={this.state.show}
onBack={linkEvent(this, handleAdultConsentGoBack)}
onContinue={linkEvent(this, handleAdultConsent)}
/>
);
}
}