wonderlandpark/core
2
1
Fork 0
mirror of https://github.com/koreanbots/core.git synced 2025-12-16 14:30:22 +00:00
Code Issues Packages Projects Releases Wiki Activity

feat: can't report self

Browse Source
This commit is contained in:
wonderlandpark 2021-03-13 22:23:09 +09:00
parent 3e44a86e89
commit 009e8232d4
2 changed files with 82 additions and 57 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
pages/bots/[id]/index.tsx
View File

@ -14,7 +14,7 @@ import { get } from '@utils/Query'
import Day from '@utils/Day' import Day from '@utils/Day'
import { ReportSchema } from '@utils/Yup' import { ReportSchema } from '@utils/Yup'
import Fetch from '@utils/Fetch' import Fetch from '@utils/Fetch'
import { checkBotFlag, checkUserFlag, formatNumber, parseCookie } from '@utils/Tools' import { checkBotFlag, checkUserFlag, formatNumber, parseCookie, redirectTo } from '@utils/Tools'
import { getToken } from '@utils/Csrf' import { getToken } from '@utils/Csrf'
import NotFound from '../../404' import NotFound from '../../404'
@ -41,6 +41,10 @@ const Bots: NextPage<BotsProps> = ({ data, date, user, theme, csrfToken, setThem
const router = useRouter() const router = useRouter()
const [ reportModal, setReportModal ] = useState(false) const [ reportModal, setReportModal ] = useState(false)
const [ reportRes, setReportRes ] = useState<ResponseProps<null>>(null) const [ reportRes, setReportRes ] = useState<ResponseProps<null>>(null)
function toLogin() {
localStorage.redirectTo = window.location.href
redirectTo(router, 'login')
}
if (!data?.id) return <NotFound /> 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}`) 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` } : {}}> 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` } : {}}>
@ -182,7 +186,10 @@ const Bots: NextPage<BotsProps> = ({ data, date, user, theme, csrfToken, setThem
/> />
))} ))}
<div className='list grid'> <div className='list grid'>
<a className='text-red-600 hover:underline cursor-pointer' onClick={() => setReportModal(true)} aria-hidden='true'> <a className='text-red-600 hover:underline cursor-pointer' onClick={() => {
if(!user) toLogin()
else setReportModal(true)
}} aria-hidden='true'>
<i className='far fa-flag' /> <i className='far fa-flag' />
신고하기 신고하기
</a> </a>

128
pages/users/[id].tsx
View File

@ -1,5 +1,6 @@
import { NextPage, NextPageContext } from 'next' import { NextPage, NextPageContext } from 'next'
import { useState } from 'react' import { useState } from 'react'
import { useRouter } from 'next/router'
import dynamic from 'next/dynamic' import dynamic from 'next/dynamic'
import { SnowflakeUtil } from 'discord.js' import { SnowflakeUtil } from 'discord.js'
import { ParsedUrlQuery } from 'querystring' import { ParsedUrlQuery } from 'querystring'
@ -7,8 +8,8 @@ import { josa } from 'josa'
import { Field, Form, Formik } from 'formik' import { Field, Form, Formik } from 'formik'
import { Bot, User, ResponseProps, Theme } from '@types' import { Bot, User, ResponseProps, Theme } from '@types'
import * as Query from '@utils/Query' import { get } from '@utils/Query'
import { checkUserFlag } from '@utils/Tools' import { checkUserFlag, parseCookie, redirectTo } from '@utils/Tools'
import { getToken } from '@utils/Csrf' import { getToken } from '@utils/Csrf'
import Fetch from '@utils/Fetch' import Fetch from '@utils/Fetch'
import { ReportSchema } from '@utils/Yup' import { ReportSchema } from '@utils/Yup'
@ -30,9 +31,14 @@ const Modal = dynamic(() => import('@components/Modal'))
const Button = dynamic(() => import('@components/Button')) const Button = dynamic(() => import('@components/Button'))
const TextArea = dynamic(() => import('@components/Form/TextArea')) const TextArea = dynamic(() => import('@components/Form/TextArea'))
const Users: NextPage<UserProps> = ({ data, csrfToken, theme }) => { const Users: NextPage<UserProps> = ({ user, data, csrfToken, theme }) => {
const router = useRouter()
const [ reportModal, setReportModal ] = useState(false) const [ reportModal, setReportModal ] = useState(false)
const [ reportRes, setReportRes ] = useState<ResponseProps<null>>(null) const [ reportRes, setReportRes ] = useState<ResponseProps<null>>(null)
function toLogin() {
localStorage.redirectTo = window.location.href
redirectTo(router, 'login')
}
if (!data?.id) return <NotFound /> if (!data?.id) return <NotFound />
return ( return (
<Container paddingTop className='py-10'> <Container paddingTop className='py-10'>
@ -89,65 +95,73 @@ const Users: NextPage<UserProps> = ({ data, csrfToken, theme }) => {
/> />
)} )}
<div className='list-none mt-2'> <div className='list-none mt-2'>
<a className='text-red-600 hover:underline cursor-pointer' onClick={() => setReportModal(true)} aria-hidden='true'> <a className='text-red-600 hover:underline cursor-pointer' onClick={() => {
if(!user) toLogin()
else setReportModal(true)
}} aria-hidden='true'>
<i className='far fa-flag' /> <i className='far fa-flag' />
신고하기 신고하기
</a> </a>
</div> </div>
<Modal header={`${data.username}#${data.tag} 신고하기`} closeIcon isOpen={reportModal} onClose={() => { <Modal header={user.id === data.id ? '자기 자신은 신고할 수 없습니다.' : `${data.username}#${data.tag} 신고하기`} closeIcon isOpen={reportModal} onClose={() => {
setReportModal(false) setReportModal(false)
setReportRes(null) setReportRes(null)
}} full dark={theme === 'dark'}> }} full dark={theme === 'dark'}>
{ {
reportRes?.code === 200 ? <Message type='success'> user.id === data.id ? <div className='text-center py-20'>
<h2 className='text-lg font-semibold'>성공적으로 신고하였습니다!</h2> <h2 className='text-xl font-semibold'>
<p>더 자세한 설명이 필요할 수 있습니다! <a className='text-blue-600 hover:text-blue-500' href='/discord'>공식 디스코드</a>에 참여해주세요</p> " 현명한 조언을 해주는 것은 자기 이외에는 없다. "
</Message> : <Formik onSubmit={async (body) => { </h2>
const res = await Fetch<null>(`/users/${data.id}/report`, { method: 'POST', body: JSON.stringify(body) }) </div> :
setReportRes(res) reportRes?.code === 200 ? <Message type='success'>
}} validationSchema={ReportSchema} initialValues={{ <h2 className='text-lg font-semibold'>성공적으로 신고하였습니다!</h2>
category: null, <p>더 자세한 설명이 필요할 수 있습니다! <a className='text-blue-600 hover:text-blue-500' href='/discord'>공식 디스코드</a>에 참여해주세요</p>
description: '', </Message> : <Formik onSubmit={async (body) => {
_csrf: csrfToken const res = await Fetch<null>(`/users/${data.id}/report`, { method: 'POST', body: JSON.stringify(body) })
}}> setReportRes(res)
{ }} validationSchema={ReportSchema} initialValues={{
({ errors, touched, values, setFieldValue }) => ( category: null,
<Form> description: '',
<div className='mb-5'> _csrf: csrfToken
{ }}>
reportRes && <div className='my-5'> {
<Message type='error'> ({ errors, touched, values, setFieldValue }) => (
<h2 className='text-lg font-semibold'>{reportRes.message}</h2> <Form>
<ul className='list-disc'> <div className='mb-5'>
{reportRes.errors?.map((el, n) => <li key={n}>{el}</li>)} {
</ul> reportRes && <div className='my-5'>
</Message> <Message type='error'>
</div> <h2 className='text-lg font-semibold'>{reportRes.message}</h2>
} <ul className='list-disc'>
<h3 className='font-bold'>신고 구분</h3> {reportRes.errors?.map((el, n) => <li key={n}>{el}</li>)}
<p className='text-gray-400 text-sm mb-1'>해당되는 항복을 선택해주세요.</p> </ul>
{ </Message>
reportCats.map(el =>
<div key={el}>
<label>
<Field type='radio' name='category' value={el} className='mr-1.5 py-2' />
{el}
</label>
</div> </div>
) }
} <h3 className='font-bold'>신고 구분</h3>
<div className='mt-1 text-red-500 text-xs font-light'>{errors.category && touched.category ? errors.category : null}</div> <p className='text-gray-400 text-sm mb-1'>해당되는 항복을 선택해주세요.</p>
<h3 className='font-bold mt-2'>설명</h3> {
<p className='text-gray-400 text-sm mb-1'>신고하시는 내용을 자세하게 설명해주세요.</p> reportCats.map(el =>
<TextArea name='description' placeholder='최대한 자세하게 설명해주세요!' theme={theme === 'dark' ? 'dark' : 'light'} value={values.description} setValue={(value) => setFieldValue('description', value)} /> <div key={el}>
<div className='mt-1 text-red-500 text-xs font-light'>{errors.description && touched.description ? errors.description : null}</div> <label>
</div> <Field type='radio' name='category' value={el} className='mr-1.5 py-2' />
<Button className='bg-gray-500 hover:opacity-90 text-white' onClick={()=> setReportModal(false)}>취소</Button> {el}
<Button type='submit' className='bg-red-500 hover:opacity-90 text-white'>제출</Button> </label>
</Form> </div>
) )
} }
</Formik> <div className='mt-1 text-red-500 text-xs font-light'>{errors.category && touched.category ? errors.category : null}</div>
<h3 className='font-bold mt-2'>설명</h3>
<p className='text-gray-400 text-sm mb-1'>신고하시는 내용을 자세하게 설명해주세요.</p>
<TextArea name='description' placeholder='최대한 자세하게 설명해주세요!' theme={theme === 'dark' ? 'dark' : 'light'} value={values.description} setValue={(value) => setFieldValue('description', value)} />
<div className='mt-1 text-red-500 text-xs font-light'>{errors.description && touched.description ? errors.description : null}</div>
</div>
<Button className='bg-gray-500 hover:opacity-90 text-white' onClick={()=> setReportModal(false)}>취소</Button>
<Button type='submit' className='bg-red-500 hover:opacity-90 text-white'>제출</Button>
</Form>
)
}
</Formik>
} }
</Modal> </Modal>
</div> </div>
@ -166,11 +180,15 @@ const Users: NextPage<UserProps> = ({ data, csrfToken, theme }) => {
} }
export const getServerSideProps = async (ctx: Context) => { export const getServerSideProps = async (ctx: Context) => {
const data = await Query.get.user.load(ctx.query.id) const parsed = parseCookie(ctx.req)
return { props: { data, date: SnowflakeUtil.deconstruct(data?.id ?? '0')?.date?.toJSON(), csrfToken: getToken(ctx.req, ctx.res) } }
const user = await get.Authorization(parsed?.token) || ''
const data = await get.user.load(ctx.query.id)
return { props: { user: await get.user.load(user), data, date: SnowflakeUtil.deconstruct(data?.id ?? '0')?.date?.toJSON(), csrfToken: getToken(ctx.req, ctx.res) } }
} }
interface UserProps { interface UserProps {
user: User
data: User data: User
csrfToken: string csrfToken: string
theme: Theme theme: Theme