import "../style/home/home.css"
// import AccountSvg from "../assets/account.svg?react"
import { CSSProperties, useRef } from "react"
import { Header } from "./template/Header"
interface Tactic {
id: number
name: string
creation_date: string
}
interface Team {
id: number
name: string
picture: string
main_color: string
second_color: string
}
export default function Home({
lastTactics,
allTactics,
teams,
username,
}: {
lastTactics: Tactic[]
allTactics: Tactic[]
teams: Team[]
username: string
}) {
return (
)
}
export function Body({
lastTactics,
allTactics,
teams,
}: {
lastTactics: Tactic[]
allTactics: Tactic[]
teams: Team[]
}) {
const widthPersonalSpace = 78
const widthSideMenu = 100 - widthPersonalSpace
return (
)
}
export function SideMenu({
width,
lastTactics,
teams,
}: {
width: number
lastTactics: Tactic[]
teams: Team[]
}) {
return (
)
}
export function PersonalSpace({
width,
allTactics,
}: {
width: number
allTactics: Tactic[]
}) {
return (
)
}
function TitlePersonalSpace() {
return (
Espace Personnel
)
}
function TableData({ allTactics }: { allTactics: Tactic[] }) {
const nbRow = Math.floor(allTactics.length / 3) + 1
let listTactic = Array(nbRow)
for (let i = 0; i < nbRow; i++) {
listTactic[i] = Array(0)
}
let i = 0
let j = 0
allTactics.forEach((tactic) => {
listTactic[i].push(tactic)
j++
if (j === 3) {
i++
j = 0
}
})
i = 0
while (i < nbRow) {
listTactic[i] = listTactic[i].map((tactic: Tactic) => (
{
location.pathname = "/tactic/" + tactic.id + "/edit"
}}>
{troncName(tactic.name, 25)}
))
i++
}
if (nbRow == 1) {
if (listTactic[0].length < 3) {
for (let i = 0; i <= 3 - listTactic[0].length; i++) {
listTactic[0].push( )
}
}
}
const data = listTactic.map((tactic, rowIndex) => (
{tactic}
))
return data
}
function BodyPersonalSpace({ allTactics }: { allTactics: Tactic[] }) {
let data
if (allTactics.length == 0) {
data = Aucune tactique créé !
} else {
data =
}
return (
)
}
export function Team({ teams }: { teams: Team[] }) {
const listTeam = teams.map((team, rowIndex) => (
{team.name}
(location.pathname = "/team/" + team.id)}>
open
))
return (
Mes équipes
(location.pathname = "/team/new")}>
+
)
}
export function Tactic({ lastTactics }: { lastTactics: Tactic[] }) {
return (
Mes dernières stratégies
(location.pathname = "/tactic/new")}>
+
)
}
function SetButtonTactic({ tactics }: { tactics: Tactic[] }) {
const lastTactics = tactics.map((tactic) => (
))
return {lastTactics}
}
function SetButtonTeam({ teams }: { teams: Team[] }) {
const listTeam = teams.map((teams) => )
return {listTeam}
}
function ButtonTeam({ team }: { team: Team }) {
const name = troncName(team.name, 20)
return (
{
location.pathname = "/team/" + team.id
}}>
{name}
)
}
function ButtonLastTactic({ tactic }: { tactic: Tactic }) {
const name = troncName(tactic.name, 20)
return (
{
location.pathname = "/tactic/" + tactic.id + "/edit"
}}>
{name}
)
}
function troncName(name: string, limit: number): string {
if (name.length > limit) {
name = name.substring(0, limit) + "..."
} else {
name = name
}
return name
}