47 lines
1.5 KiB
TypeScript
47 lines
1.5 KiB
TypeScript
import { useEffect, useRef } from 'react';
|
|
import { useIntl, defineMessages } from 'react-intl';
|
|
|
|
import snackbar from 'soapbox/actions/snackbar';
|
|
|
|
import { useAppDispatch } from './useAppDispatch';
|
|
import { useAppSelector } from './useAppSelector';
|
|
import { useSoapboxConfig } from './useSoapboxConfig';
|
|
|
|
const hasGdpr = !!localStorage.getItem('soapbox:gdpr');
|
|
|
|
const messages = defineMessages({
|
|
accept: { id: 'gdpr.accept', defaultMessage: 'Accept' },
|
|
body: { id: 'gdpr.message', defaultMessage: '{siteTitle} uses session cookies, which are essential to the website\'s functioning.' },
|
|
});
|
|
|
|
/** Displays a GDPR popup unless it has already been accepted. */
|
|
const useGdpr = () => {
|
|
const intl = useIntl();
|
|
const dispatch = useAppDispatch();
|
|
|
|
/** Track whether the snackbar has already been displayed once. */
|
|
const triggered = useRef<boolean>(hasGdpr);
|
|
|
|
const soapbox = useSoapboxConfig();
|
|
const isLoggedIn = useAppSelector(state => !!state.me);
|
|
const siteTitle = useAppSelector(state => state.instance.title);
|
|
|
|
const handleAccept = () => {
|
|
localStorage.setItem('soapbox:gdpr', 'true');
|
|
triggered.current = true;
|
|
};
|
|
|
|
useEffect(() => {
|
|
if (soapbox.gdpr && !isLoggedIn && !triggered.current) {
|
|
const message = intl.formatMessage(messages.body, { siteTitle });
|
|
|
|
dispatch(snackbar.show('info', message, {
|
|
action: handleAccept,
|
|
actionLabel: intl.formatMessage(messages.accept),
|
|
dismissAfter: false,
|
|
}));
|
|
}
|
|
}, [soapbox.gdpr, isLoggedIn]);
|
|
};
|
|
|
|
export { useGdpr };
|