add profile claiming
All checks were successful
deploy / deploy (push) Successful in 57s

This commit is contained in:
Lee 2023-10-20 13:59:45 +01:00
parent da380fb603
commit f548902f13
2 changed files with 37 additions and 6 deletions

@ -10,7 +10,7 @@ import { ScoresaberPlayer } from "@/schemas/scoresaber/player";
import { ScoresaberPlayerScore } from "@/schemas/scoresaber/playerScore"; import { ScoresaberPlayerScore } from "@/schemas/scoresaber/playerScore";
import { formatNumber } from "@/utils/number"; import { formatNumber } from "@/utils/number";
import { fetchScores, getPlayerInfo } from "@/utils/scoresaber/api"; import { fetchScores, getPlayerInfo } from "@/utils/scoresaber/api";
import { GlobeAsiaAustraliaIcon } from "@heroicons/react/20/solid"; import { GlobeAsiaAustraliaIcon, HomeIcon } from "@heroicons/react/20/solid";
import moment from "moment"; import moment from "moment";
import Image from "next/image"; import Image from "next/image";
import { useCallback, useEffect, useState } from "react"; import { useCallback, useEffect, useState } from "react";
@ -53,7 +53,7 @@ export default function Player({ params }: { params: { id: string } }) {
(scoresResponse) => { (scoresResponse) => {
if (!scoresResponse) { if (!scoresResponse) {
setError(true); setError(true);
setErrorMessage("Failed to fetch scores"); setErrorMessage("No Scores");
setScores({ ...scores, loading: false }); setScores({ ...scores, loading: false });
return; return;
} }
@ -70,6 +70,15 @@ export default function Player({ params }: { params: { id: string } }) {
[params.id, scores], [params.id, scores],
); );
function claimProfile() {
// set cookie to claim profile
document.cookie = `profile=${params.id};path=/`;
}
function isClaimedProfile() {
return document.cookie.includes(`profile=${params.id}`);
}
useEffect(() => { useEffect(() => {
if (!params.id) { if (!params.id) {
setError(true); setError(true);
@ -129,7 +138,20 @@ export default function Player({ params }: { params: { id: string } }) {
{/* Player Info */} {/* Player Info */}
<div className="mt-2 flex w-full flex-row justify-center rounded-md bg-gray-800 xs:flex-col"> <div className="mt-2 flex w-full flex-row justify-center rounded-md bg-gray-800 xs:flex-col">
<div className="flex flex-col items-center gap-3 p-3 xs:flex-row xs:items-start"> <div className="flex flex-col items-center gap-3 p-3 xs:flex-row xs:items-start">
<Avatar url={playerData.profilePicture} label="Avatar" /> <div>
<div className="flex flex-col items-center gap-2">
<Avatar url={playerData.profilePicture} label="Avatar" />
{!isClaimedProfile() && (
<button onClick={claimProfile}>
<HomeIcon
title="Set as your profile"
width={24}
height={24}
/>
</button>
)}
</div>
</div>
<div className="flex flex-col items-center gap-2 xs:items-start"> <div className="flex flex-col items-center gap-2 xs:items-start">
<p className="text-2xl">{playerData.name}</p> <p className="text-2xl">{playerData.name}</p>
@ -193,7 +215,7 @@ export default function Player({ params }: { params: { id: string } }) {
) : ( ) : (
<div className="grid grid-cols-1 divide-y divide-gray-500"> <div className="grid grid-cols-1 divide-y divide-gray-500">
{!scores.loading && scores.scores.length == 0 ? ( {!scores.loading && scores.scores.length == 0 ? (
<p className="text-red-400">No Scores</p> <p className="text-red-400">{errorMessage}</p>
) : ( ) : (
scores.scores.map((scoreData, id) => { scores.scores.map((scoreData, id) => {
const { score, leaderboard } = scoreData; const { score, leaderboard } = scoreData;

@ -2,9 +2,18 @@ import type { NextRequest } from "next/server";
import { NextResponse } from "next/server"; import { NextResponse } from "next/server";
export function middleware(request: NextRequest) { export function middleware(request: NextRequest) {
// todo: make this redirect to the users profile if they have a profile selected console.log(request.cookies);
const profileCookie = request.cookies.get("profile");
if (request.nextUrl.pathname == "/") { if (request.nextUrl.pathname == "/") {
return NextResponse.redirect(new URL("/search", request.url)); // Has a claimed profile cookie
if (profileCookie) {
const id = profileCookie.value;
return NextResponse.redirect(new URL(`/profile/${id}`, request.url));
} else {
// User has not claimed a profile
return NextResponse.redirect(new URL("/search", request.url));
}
} }
} }