import "../style/home/home.css"
// import AccountSvg from "../assets/account.svg?react"
import {Header} from "./template/Header"
import {BASE} from "../Constants"
import Popup from "../components/Popup";
import {useState} from "react";
interface Tactic {
id: number
name: string
creation_date: string
}
interface Team {
id: number
name: string
picture: string
main_color: string
second_color: string
}
interface Folder{
id:number
name:string
}
export default function Home({
lastTactics,
allTactics,
folders,
teams,
username,
currentFolder
}: {
lastTactics: Tactic[]
allTactics: Tactic[]
folders: Folder[]
teams: Team[]
username: string
currentFolder: number
}) {
return (
)
}
function Body({
lastTactics,
tactics,
folders,
teams,
currentFolder
}: {
lastTactics: Tactic[]
tactics: Tactic[]
folders: Folder[]
teams: Team[]
currentFolder: number
}) {
const widthPersonalSpace = 78
const widthSideMenu = 100 - widthPersonalSpace
return (
)
}
function SideMenu({
width,
lastTactics,
teams,
}: {
width: number
lastTactics: Tactic[]
teams: Team[]
}) {
return (
)
}
function PersonalSpace({
width,
tactics,
folders,
currentFolder
}: {
width: number
tactics: Tactic[]
folders: Folder[]
currentFolder: number
}) {
const [showPopup, setShowPopup] = useState(false)
return (
)
}
function NewFolder({
showPopup,
setShowPopup,
currentFolder
}: { showPopup, setShowPopup: (newVal: boolean) => void, currentFolder: number }) {
return (
setShowPopup(true)}
>Nouveau dossier
setShowPopup(false)}>
Nouveau dossier
)
}
function TitlePersonalSpace() {
return (
Espace Personnel
)
}
function TableData({ tactics,folders }: { tactics: Tactic[],folders: Folder[]}) {
const nbTacticRow = Math.floor(tactics.length / 3) + 1
const nbFolderRow = Math.floor(folders.length / 3) + 1
let listTactic = Array(nbTacticRow)
let listFolder = Array(nbFolderRow)
for (let i = 0; i < nbTacticRow; i++) {
listTactic[i] = Array(0)
}
for (let i = 0; i < nbFolderRow ; i++) {
listFolder[i] = Array(0)
}
let i = 0
let j = 0
tactics.forEach((tactic) => {
listTactic[i].push(tactic)
j++
if (j === 3) {
i++
j = 0
}
})
folders.forEach((folder) => {
listFolder[i].push(folder)
j++
if (j === 3) {
i++
j = 0
}
})
i = 0
while (i < nbTacticRow) {
listTactic[i] = listTactic[i].map((tactic: Tactic) => (
{
location.pathname = BASE + "/tactic/" + tactic.id + "/edit"
}}>
{truncateString(tactic.name, 25)}
|
))
i++
}
i = 0
while (i < nbFolderRow) {
listFolder[i] = listFolder[i].map((folder: Folder) => (
{
location.pathname = BASE + "/tactic/" + folder.id + "/edit"
}}>
{truncateString(folder.name, 25)}
|
))
i++
}
if (nbTacticRow == 1) {
if (listTactic[0].length < 3) {
for (let i = 0; i <= 3 - listTactic[0].length; i++) {
listTactic[0].push( | )
}
}
}
if (nbFolderRow == 1) {
if (listFolder[0].length < 3) {
for (let i = 0; i <= 3 - listFolder[0].length; i++) {
listFolder[0].push( | )
}
}
}
return listTactic.map((tactic, rowIndex) => (
{tactic}
)).concat(listFolder.map((folder, rowIndex) => (
{folder}
)))
}
function BodyPersonalSpace({ tactics,folders }: { tactics: Tactic[],folders: Folder[]}) {
let data
if (tactics.length == 0) {
data = Aucune tactique créée !
} else {
data =
}
return (
)
}
function Team({ teams }: { teams: Team[] }) {
return (
Mes équipes
)
}
function Tactic({ lastTactics }: { lastTactics: Tactic[] }) {
return (
Mes dernières stratégies
)
}
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 = truncateString(team.name, 20)
return (
{
location.pathname = BASE + "/team/" + team.id
}}>
{name}
)
}
function ButtonLastTactic({ tactic }: { tactic: Tactic }) {
const name = truncateString(tactic.name, 20)
return (
{
location.pathname = BASE + "/tactic/" + tactic.id + "/edit"
}}>
{name}
)
}
function truncateString(name: string, limit: number): string {
if (name.length > limit) {
name = name.substring(0, limit) + "..."
}
return name
}