diff --git a/src/pages/blog/index.tsx b/src/pages/blog/index.tsx index 87b1b17..caba20a 100644 --- a/src/pages/blog/index.tsx +++ b/src/pages/blog/index.tsx @@ -5,7 +5,8 @@ import { useNavigation, useSubmit, Outlet, - useParams + useParams, + useNavigate } from 'react-router-dom' import { LoadingSpinner } from 'components/LoadingSpinner' import { ProfileSection } from 'components/ProfileSection' @@ -17,10 +18,12 @@ import { Interactions } from 'components/Internal/Interactions' import { BlogCard } from 'components/BlogCard' import { copyTextToClipboard } from 'utils' import { toast } from 'react-toastify' -import { useAppSelector, useBodyScrollDisable } from 'hooks' +import { useAppSelector, useBodyScrollDisable, useLocalStorage } from 'hooks' import { ReportPopup } from 'components/ReportPopup' import { Viewer } from 'components/Markdown/Viewer' import { PostWarnings } from 'components/PostWarning' +import { appRoutes } from 'routes' +import { NsfwAlertPopup } from 'components/NsfwAlertPopup' const BLOG_REPORT_REASONS = [ { label: 'Actually CP', key: 'actuallyCP' }, @@ -79,6 +82,17 @@ export const BlogPage = () => { } } + const navigate = useNavigate() + const [confirmNsfw] = useLocalStorage('confirm-nsfw', false) + const [showNsfwPopup, setShowNsfwPopup] = useState( + (blog?.nsfw ?? false) && !confirmNsfw + ) + const handleConfirm = (confirm: boolean) => { + if (!confirm) { + navigate(appRoutes.home) + } + } + return (
@@ -316,6 +330,12 @@ export const BlogPage = () => { )} {!!blog?.author && } + {showNsfwPopup && ( + setShowNsfwPopup(false)} + /> + )}
diff --git a/src/pages/mod/index.tsx b/src/pages/mod/index.tsx index 5a58cb3..a3a1e48 100644 --- a/src/pages/mod/index.tsx +++ b/src/pages/mod/index.tsx @@ -5,6 +5,7 @@ import { Outlet, Link as ReactRouterLink, useLoaderData, + useNavigate, useNavigation, useParams, useSubmit @@ -12,8 +13,13 @@ import { import { toast } from 'react-toastify' import { BlogCard } from '../../components/BlogCard' import { ProfileSection } from '../../components/ProfileSection' -import { useAppSelector, useBodyScrollDisable, useDidMount } from '../../hooks' -import { getGamePageRoute, getModsEditPageRoute } from '../../routes' +import { + useAppSelector, + useBodyScrollDisable, + useDidMount, + useLocalStorage +} from '../../hooks' +import { appRoutes, getGamePageRoute, getModsEditPageRoute } from '../../routes' import '../../styles/comments.css' import '../../styles/downloads.css' import '../../styles/innerPage.css' @@ -51,6 +57,7 @@ import { OriginalAuthor } from 'components/OriginalAuthor' import { Viewer } from 'components/Markdown/Viewer' import { PostWarnings } from 'components/PostWarning' import { DownloadDetailsPopup } from 'components/DownloadDetailsPopup' +import { NsfwAlertPopup } from 'components/NsfwAlertPopup' const MOD_REPORT_REASONS = [ { label: 'Actually CP', key: 'actuallyCP' }, @@ -80,6 +87,17 @@ export const ModPage = () => { const [commentCount, setCommentCount] = useState(0) + const navigate = useNavigate() + const [confirmNsfw] = useLocalStorage('confirm-nsfw', false) + const [showNsfwPopup, setShowNsfwPopup] = useState( + (mod?.nsfw ?? false) && !confirmNsfw + ) + const handleConfirm = (confirm: boolean) => { + if (!confirm) { + navigate(appRoutes.home) + } + } + return ( <> @@ -145,6 +163,12 @@ export const ModPage = () => { )} + {showNsfwPopup && ( + setShowNsfwPopup(false)} + /> + )}