58 行
1.8 KiB
TypeScript
58 行
1.8 KiB
TypeScript
import axios from 'axios'
|
||
|
||
import { Button } from '@/components/ui/button'
|
||
import { Dialog,
|
||
DialogContent,
|
||
DialogTitle } from '@/components/ui/dialog'
|
||
import { toast } from '@/components/ui/use-toast'
|
||
import { API_BASE_URL } from '@/config'
|
||
|
||
import type { User } from '@/types'
|
||
|
||
type Props = { visible: boolean
|
||
onVisibleChange: (visible: boolean) => void
|
||
user: User | null
|
||
setUser: React.Dispatch<React.SetStateAction<User | null>> }
|
||
|
||
|
||
export default ({ visible, onVisibleChange, user, setUser }: Props) => {
|
||
const handleChange = async () => {
|
||
if (!(user))
|
||
return
|
||
|
||
if (!(confirm ('引継ぎコードを再発行しますか?\n再発行するとほかのブラウザからはログアウトされます．')))
|
||
return
|
||
|
||
const res = await axios.post (`${ API_BASE_URL }/users/code/renew`, { }, { headers: {
|
||
'Content-Type': 'multipart/form-data',
|
||
'X-Transfer-Code': localStorage.getItem ('user_code') || '' } })
|
||
const data = res.data as { code: string }
|
||
if (data.code)
|
||
{
|
||
localStorage.setItem ('user_code', data.code)
|
||
setUser (user => ({ ...user, inheritanceCode: data.code } as User))
|
||
toast ({ title: '再発行しました．' })
|
||
}
|
||
}
|
||
|
||
return (
|
||
<Dialog open={visible} onOpenChange={onVisibleChange}>
|
||
<DialogContent>
|
||
<DialogTitle>引継ぎコード</DialogTitle>
|
||
<div>
|
||
<p>あなたの引継ぎコードはこちらです：</p>
|
||
<div className="m-2">{user?.inheritanceCode}</div>
|
||
<p className="mt-1 text-sm text-red-500">
|
||
このコードはほかの人には教えないでください!
|
||
</p>
|
||
<div className="my-4">
|
||
<Button onClick={handleChange}
|
||
className="px-4 py-2 bg-red-600 text-white rounded disabled:bg-gray-400">
|
||
引継ぎコード再発行
|
||
</Button>
|
||
</div>
|
||
</div>
|
||
</DialogContent>
|
||
</Dialog>)
|
||
}
|