diff options
Diffstat (limited to 'pages/user.tsx')
| -rw-r--r-- | pages/user.tsx | 78 |
1 files changed, 67 insertions, 11 deletions
diff --git a/pages/user.tsx b/pages/user.tsx index c7a78e6..2003696 100644 --- a/pages/user.tsx +++ b/pages/user.tsx @@ -24,7 +24,8 @@ import { mdiCheckboxBlankCircle, mdiClipboardTextOutline, mdiGamepadSquareOutline, - mdiEarth } from '@mdi/js'; + mdiEarth, + mdiAccountMinusOutline } from '@mdi/js'; function InfoModule(props: { label: string; @@ -77,6 +78,9 @@ export default function AccountPage() { var [editingStatus, setEditingStatus] = useState(false); + var [isFriends, setIsFriends] = useState(false); + var [hasBlocked, setHasBlocked] = useState(false); + var { toast } = useContext(ToastContext); useEffect(() => {(async() => { @@ -175,16 +179,68 @@ export default function AccountPage() { } </div> : <div> - <IconLabelButton icon={<Icon size={1} path={mdiAccountCancelOutline}/>} text="Blokkeren" onclick={() => { - toast(`${user.username} geblokkeerd`, - "confirmation", - <Icon size={32 / 24} path={mdiAccountCancelOutline}/>) - }}/> - <IconLabelButton icon={<PersonAddOutlinedIcon/>} text="Vriendschapsverzoek" onclick={() => { - toast("Vriendschapsverzoek gestuurd", - "confirmation", - <PersonAddOutlinedIcon style={{ fontSize: 32 }}/>) - }}/> + { hasBlocked ? + <IconLabelButton icon={<Icon size={1} path={mdiAccountCancelOutline}/>} text="Deblokkeren" onclick={() => { + /* axios.request({ */ + /* method: "post", */ + /* url: `/api/social/block`, */ + /* headers: {"content-type": "application/json"}, */ + /* data: { "id": user?.id } */ + /* }) */ + /* .then(() => { */ + /* toast(`${user.username} geblokkeerd`, */ + /* "confirmation", */ + /* <Icon size={32 / 24} path={mdiAccountCancelOutline}/>); */ + /* setHasBlocked(true); */ + /* }); */ + }}/> : + <IconLabelButton icon={<Icon size={1} path={mdiAccountCancelOutline}/>} text="Blokkeren" onclick={() => { + axios.request({ + method: "post", + url: `/api/social/block`, + headers: {"content-type": "application/json"}, + data: { "id": user?.id } + }) + .then(() => { + toast(`${user.username} geblokkeerd`, + "confirmation", + <Icon size={32 / 24} path={mdiAccountCancelOutline}/>); + setHasBlocked(true); + setIsFriends(false); + }); + }}/> + } + { isFriends ? + <IconLabelButton icon={<Icon size={1} path={mdiAccountMinusOutline}/>} text="Vriend verwijderen" onclick={() => { + /* axios.request({ */ + /* method: "post", */ + /* url: `/api/social/request`, */ + /* headers: {"content-type": "application/json"}, */ + /* data: { "id": user?.id } */ + /* }) */ + /* .then(() => { */ + /* toast("Vriendschapsverzoek gestuurd", */ + /* "confirmation", */ + /* <PersonAddOutlinedIcon style={{ fontSize: 32 }}/>); */ + /* setIsFriends(true); */ + /* }); */ + }}/> : + <IconLabelButton icon={<PersonAddOutlinedIcon/>} text="Vriendschapsverzoek" onclick={() => { + axios.request({ + method: "post", + url: `/api/social/request`, + headers: {"content-type": "application/json"}, + data: { "id": user?.id } + }) + .then(() => { + toast("Vriendschapsverzoek gestuurd", + "confirmation", + <PersonAddOutlinedIcon style={{ fontSize: 32 }}/>); + setIsFriends(true); + setHasBlocked(false); + }); + }}/> + } </div> }</div>} </div> |