fix: localStorage called before render

This commit is contained in:
wonderlandpark 2021-04-07 10:14:08 +09:00
parent 83dbab3137
commit 4eaad06394
2 changed files with 10 additions and 4 deletions

View File

@ -2,7 +2,7 @@ import { NextPage, NextPageContext } from 'next'
import { useRouter } from 'next/router'
import dynamic from 'next/dynamic'
import Link from 'next/link'
import { useState } from 'react'
import { useEffect, useState } from 'react'
import { Field, Form, Formik } from 'formik'
import { SnowflakeUtil } from 'discord.js'
@ -39,13 +39,16 @@ const NSFW = dynamic(() => import('@components/NSFW'))
const Bots: NextPage<BotsProps> = ({ data, date, user, theme, csrfToken }) => {
const bg = checkBotFlag(data?.flags, 'trusted') && data?.banner
const router = useRouter()
const [ nsfw, setNSFW ] = useState(localStorage.nsfw)
const [ nsfw, setNSFW ] = useState<boolean>()
const [ reportModal, setReportModal ] = useState(false)
const [ reportRes, setReportRes ] = useState<ResponseProps<null>>(null)
function toLogin() {
localStorage.redirectTo = window.location.href
redirectTo(router, 'login')
}
useEffect(() => {
setNSFW(localStorage.nsfw)
}, [])
if (!data?.id) return <NotFound />
if((checkBotFlag(data.flags, 'trusted') || checkBotFlag(data.flags, 'partnered')) && data.vanity && data.vanity !== router.query.id) router.push(`/bots/${data.vanity}`)
return <div style={bg ? { background: `linear-gradient(to right, rgba(34, 36, 38, 0.68), rgba(34, 36, 38, 0.68)), url("${data.bg}") center top / cover no-repeat fixed` } : {}}>

View File

@ -6,7 +6,7 @@ import { get } from '@utils/Query'
import { BotList } from '@types'
import { botCategoryListArgumentSchema } from '@utils/Yup'
import NotFound from 'pages/404'
import { useState } from 'react'
import { useEffect, useState } from 'react'
import { useRouter } from 'next/router'
const Hero = dynamic(() => import('@components/Hero'))
@ -21,8 +21,11 @@ const Markdown = dynamic(() => import('@components/Markdown'))
const NSFW = dynamic(() => import('@components/NSFW'))
const Category: NextPage<CategoryProps> = ({ data, query }) => {
const [ nsfw, setNSFW ] = useState(localStorage.nsfw)
const [ nsfw, setNSFW ] = useState<boolean>()
const router = useRouter()
useEffect(() => {
setNSFW(localStorage.nsfw)
}, [])
if(!data || data.data.length === 0 || data.totalPage < Number(query.page)) return <NotFound />
return <>
<Hero header={`${query.category} 카테고리 봇들`} description={`다양한 "${query.category}" 카테고리의 봇들을 만나보세요.`} />