diff --git a/app/actions.ts b/app/actions.ts index f9772fb..3441a6e 100644 --- a/app/actions.ts +++ b/app/actions.ts @@ -17,24 +17,29 @@ export async function getUserData() { cookies().get('OTR-Access-Token')?.value }`, }, - next: { + /* next: { revalidate: 120, tags: ['user-me'], - }, + }, */ }); if (res.status !== 200) { + const errorMessage = await res.text(); + return { error: { status: res.status, text: res.statusText, + message: errorMessage, }, }; } - res = await res.json(); + if (res.status === 200) { + res = await res.json(); - return res; + return res; + } /* .then((response) => { return response.json(); @@ -48,6 +53,32 @@ export async function getUserData() { }); */ } +export async function checkUserLogin() { + let res = await fetch(`${process.env.REACT_APP_API_URL}/me/validate`, { + method: 'GET', + credentials: 'include', + headers: { + 'Content-Type': 'application/json', + 'Access-Control-Allow-Origin': `${process.env.REACT_APP_ORIGIN_URL}`, + Cookie: `${cookies().get('OTR-Access-Token')?.name}=${ + cookies().get('OTR-Access-Token')?.value + }`, + }, + }); + + if (!res?.ok) { + const errorCode = res?.status; + + return { + error: { + errorCode, + }, + }; + } + + return await getUserData(); +} + export async function revalidateUserData() { return revalidateTag('user-me'); } @@ -411,6 +442,52 @@ export async function fetchDashboard() { return data; } +export async function fetchUserPageTitle(player: string | number) { + let res = await fetch( + `${process.env.REACT_APP_API_URL}/players/${player}/info`, + { + headers: { + 'Content-Type': 'application/json', + }, + } + ); + + if (res?.ok) { + res = await res.json(); + return res; + } + + return null; +} + +export async function fetchUserPage(player: string | number) { + const isUserLogged = await checkUserLogin(); + + let res = await fetch( + `${process.env.REACT_APP_API_URL}/stats/${player}${ + isUserLogged ? `?comparerId=${isUserLogged?.userId}` : '' + }`, + { + headers: { + 'Content-Type': 'application/json', + }, + } + ); + + if (!res?.ok) { + return redirect('/'); + } + + res = await res.json(); + + /* TEMPORARY BEHAVIOR */ + if (res?.generalStats === null) { + return redirect('/'); + } + + return res; +} + export async function paginationParamsToURL(params: {}) { let url = ''; diff --git a/app/dashboard/page.module.css b/app/dashboard/page.module.css index 11be1d5..64b7bd0 100644 --- a/app/dashboard/page.module.css +++ b/app/dashboard/page.module.css @@ -106,3 +106,9 @@ .cardStat .value { font-weight: 600; } + +.noGraphText { + font-style: italic; + font-weight: 400; + font-size: 0.9rem; +} diff --git a/app/dashboard/page.tsx b/app/dashboard/page.tsx index e6fb371..4dee5fa 100644 --- a/app/dashboard/page.tsx +++ b/app/dashboard/page.tsx @@ -1,3 +1,4 @@ +import { fetchDashboard } from '@/app/actions'; import AreaChart from '@/components/Charts/AreaChart/AreaChart'; import BarChart from '@/components/Charts/BarChart/BarChart'; import DoughnutChart from '@/components/Charts/DoughnutChart/DoughnutChart'; @@ -11,7 +12,6 @@ import UserMainCard from '@/components/Dashboard/UserMainCard/UserMainCard'; import FormattedNumber from '@/components/FormattedNumber/FormattedNumber'; import Notice from '@/components/Notice/Notice'; import clsx from 'clsx'; -import { fetchDashboard } from '../actions'; import styles from './page.module.css'; import type { Metadata } from 'next'; @@ -67,7 +67,7 @@ export default async function page({
- {Math.floor(data.generalStats.rating)} + {Math.round(data.generalStats.rating)} - - + + - - + + - -
- -
- - + - - - - - - - + {data?.tournamentStats.worstPerformances.length > 0 ? ( + + ) : ( + + Play 6 or more tournaments to populate this graph! + + )} diff --git a/app/globals.css b/app/globals.css index bcd32ef..a5ee986 100644 --- a/app/globals.css +++ b/app/globals.css @@ -99,6 +99,22 @@ --mods-FM-bg-row: 101, 38%, 63%, 0.15; --mods-TB-bg: 191, 26%, 57%; --mods-TB-bg-row: 191, 26%, 57%, 0.15; + + --accent-color: 216, 100%, 65%; + --accent-secondary-color: var(--blue-300); + + /* CHARTS */ + --tooltip-color: 0, 0%, 100%; + --tooltip-gain: var(--green-400); + --tooltip-loss: var(--red-400); + + /* BADGES */ + --badge-provisional-background: var(--yellow-400); + --badge-provisional-foreground: var(--yellow-900); + + /* USER RATING TIER */ + --tier-bar-background: var(--gray-300); + --tier-bar-accent: var(--accent-color); } * { diff --git a/app/layout.tsx b/app/layout.tsx index 6d6ba7f..e38bd47 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -1,5 +1,6 @@ import Footer from '@/components/Footer/Footer'; import NavBar from '@/components/NavBar/NavBar'; +import UserProvider from '@/util/UserLoggedContext'; import type { Metadata } from 'next'; import { Viewport } from 'next'; import { Inter } from 'next/font/google'; @@ -31,9 +32,11 @@ export default function RootLayout({ return ( - - {children} -