From 87ddaacd976ebfc68536aec243e721bdc33da5c1 Mon Sep 17 00:00:00 2001 From: maxime Date: Thu, 15 Feb 2024 13:58:22 +0100 Subject: [PATCH] add iqball header on all pages --- src/App.tsx | 5 ++++- src/index.css | 27 +++++++++++++------------ src/pages/Editor.tsx | 30 ++++----------------------- src/pages/HomePage.tsx | 10 ++------- src/pages/template/Header.tsx | 28 +++++++++++++++++++++----- src/style/home/home.css | 2 ++ src/style/template/header.css | 38 +++++++++++++++++------------------ 7 files changed, 67 insertions(+), 73 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index b7441b5..13633cc 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,6 +1,7 @@ import { BrowserRouter, Route, Routes } from "react-router-dom" import loadable from "@loadable/component" +import { Header } from "./pages/template/Header.tsx" const HomePage = loadable(() => import("./pages/HomePage.tsx")) @@ -15,9 +16,12 @@ const Editor = loadable(() => import("./pages/Editor.tsx")) export default function App() { + return (
+
+ } /> } /> @@ -29,7 +33,6 @@ export default function App() { } /> } /> - } /> diff --git a/src/index.css b/src/index.css index 880d452..7ee0cd3 100644 --- a/src/index.css +++ b/src/index.css @@ -1,25 +1,26 @@ :root { - font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; - line-height: 1.5; - font-weight: 400; + font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; + line-height: 1.5; + font-weight: 400; - color-scheme: light dark; + color-scheme: light dark; - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; + font-synthesis: none; + text-rendering: optimizeLegibility; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; } body { - margin: 0; - display: flex; - place-items: center; + margin: 0; + display: flex; + place-items: center; + overflow-x: hidden; } h1 { - font-size: 3.2em; - line-height: 1.1; + font-size: 3.2em; + line-height: 1.1; } diff --git a/src/pages/Editor.tsx b/src/pages/Editor.tsx index 15c9bfb..288194c 100644 --- a/src/pages/Editor.tsx +++ b/src/pages/Editor.tsx @@ -22,10 +22,7 @@ import { PlayerPiece } from "../components/editor/PlayerPiece" import { Tactic, TacticComponent, TacticContent } from "../model/tactic/Tactic" import { fetchAPI } from "../Fetcher" -import SavingState, { - SaveState, - SaveStates, -} from "../components/editor/SavingState" +import SavingState, { SaveState, SaveStates } from "../components/editor/SavingState" import { BALL_TYPE } from "../model/tactic/CourtObjects" import { CourtAction } from "../components/editor/CourtAction" @@ -42,32 +39,16 @@ import { removeBall, updateComponent, } from "../editor/TacticContentDomains" -import { - BallState, - Player, - PlayerInfo, - PlayerLike, - PlayerTeam, -} from "../model/tactic/Player" +import { BallState, Player, PlayerInfo, PlayerLike, PlayerTeam } from "../model/tactic/Player" import { RackedCourtObject, RackedPlayer } from "../editor/RackedItems" import CourtPlayer from "../components/editor/CourtPlayer" -import { - createAction, - getActionKind, - isActionValid, - removeAction, -} from "../editor/ActionsDomains" +import { createAction, getActionKind, isActionValid, removeAction } from "../editor/ActionsDomains" import ArrowAction from "../components/actions/ArrowAction" import { middlePos, Pos, ratioWithinBase } from "../geo/Pos" import { Action, ActionKind } from "../model/tactic/Action" import BallAction from "../components/actions/BallAction" -import { - changePlayerBallState, - getOrigin, - removePlayer, -} from "../editor/PlayerDomains" +import { changePlayerBallState, getOrigin, removePlayer } from "../editor/PlayerDomains" import { CourtBall } from "../components/editor/CourtBall" -import { BASE } from "../Constants" const ERROR_STYLE: CSSProperties = { borderColor: "red", @@ -439,9 +420,6 @@ function EditorView({ return (
-
diff --git a/src/pages/HomePage.tsx b/src/pages/HomePage.tsx index c3bb8c6..ce26803 100644 --- a/src/pages/HomePage.tsx +++ b/src/pages/HomePage.tsx @@ -1,7 +1,6 @@ import "../style/home/home.css" // import AccountSvg from "../assets/account.svg?react" -import { Header } from "./template/Header" import { BASE } from "../Constants" import { getSession } from "../api/session.ts" import { fetchAPIGet, redirect } from "../Fetcher.ts" @@ -26,7 +25,7 @@ interface Team { export default function HomePage() { type UserDataResponse = {user?: User, tactics: Tactic[], teams: Team[]} - const [{ user, tactics, teams }, setInfo] = useState({tactics: [], teams: []}) + const [{tactics, teams }, setInfo] = useState({tactics: [], teams: []}) useLayoutEffect(() => { @@ -46,26 +45,21 @@ export default function HomePage() { }, []) - console.log(user) - const lastTactics = tactics!.sort((a, b) => a.creationDate.getMilliseconds() - b.creationDate.getMilliseconds()).slice(0, 5) - return + return } function Home({ lastTactics, allTactics, teams, - username, }: { lastTactics: Tactic[] allTactics: Tactic[] teams: Team[] - username: string }) { return (
-
{ + async function getUsername() { + const response = await fetchAPIGet("user", getSession()) + //TODO check if the response is ok and handle errors + const {name} = await response.json() + setUsername(name) + } + + getUsername() + }, []) + return (