WIP: update: adaptations to use the new backend #1

Draft
arthur.wambst wants to merge 21 commits from dev into master
8 changed files with 83 additions and 44 deletions
Showing only changes of commit 42dea97763 - Show all commits

View File

@ -41,7 +41,7 @@ const Navigation: React.FC<NavigationProps> = ({
}; };
useEffect(() => { useEffect(() => {
axios.get("/api/users/me").then((res) => { axios.get("/api/user/me").then((res) => {
if (res.data.username.trim() === "") { if (res.data.username.trim() === "") {
navigate("/login"); navigate("/login");
} }

View File

@ -1,12 +1,13 @@
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import axios from "axios"; import axios from "axios";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import { Tp } from "../type/TpType"; import { Sujet } from "../type/SujetType";
import { Ji } from "../type/JiType";
import { DashboardType } from "../type/Dashboard"; import { DashboardType } from "../type/Dashboard";
function Dashboard() { function Dashboard() {
const [dashboard, setDashboard] = useState<DashboardType | null>(null); const [dashboard, setDashboard] = useState<DashboardType | null>(null);
const username = localStorage.getItem("username"); const username = localStorage.getItem("name");
useEffect(() => { useEffect(() => {
axios.get("/api/dashboard").then((res) => { axios.get("/api/dashboard").then((res) => {
setDashboard(res.data); setDashboard(res.data);
@ -27,60 +28,61 @@ function Dashboard() {
</section> </section>
{dashboard && ( {dashboard && (
<> <>
{ dashboard.jiRespo.length !== 0 && (
<section className="py-16"> <section className="py-16">
<div className="container mx-auto"> <div className="container mx-auto">
<h3 className="text-2xl font-bold text-center mb-6"> <h3 className="text-2xl font-bold text-center mb-6">
Practicals Immersions - Respo
</h3> </h3>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-6 gap-6">
{dashboard.tps.map((tp: Tp) => ( {dashboard.jiRespo.map((jiRespo: Ji) => (
<div <div
key={tp.id} key={jiRespo.id}
className="card card-compact bg-base-200 shadow-lg p-4" className="card card-compact bg-base-200 shadow-lg p-4"
> >
<div className="card-body"> <div className="card-body">
<h2 className="card-title">{tp.name}</h2> <h2 className="card-title">{jiRespo.name}</h2>
<p>{tp.description}</p> <p>{jiRespo.description}</p>
<div className="card-actions justify-end"> <div className="card-actions justify-end">
<Link to={`/tps/${tp.id}`} className="btn btn-primary"> <Link to={`/immersion/${jiRespo.id}`} className="btn btn-primary btn-sm">
Learn More GO
</Link> </Link>
</div> </div>
</div> </div>
</div> </div>
))} ))}
</div> </div>
{dashboard.tps.length === 0 && (
<h1 className="text-xl">You have no tps</h1>
)}
</div> </div>
</section> </section>
)}
{ dashboard.sujetRespo.length !== 0 && (
<section className="py-8"> <section className="py-8">
<div className="container mx-auto"> <div className="container mx-auto">
<h3 className="text-2xl font-bold text-center mb-6">Instances</h3> <h3 className="text-2xl font-bold text-center mb-6">Sujets - Respo</h3>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{dashboard.instances.map((instance) => ( {dashboard.sujetRespo.map((sujet: Sujet) => (
<div <div
key={instance.id} key={sujetRespo.id}
className="card card-compact bg-base-200 shadow-lg p-4" className="card card-compact bg-base-200 shadow-lg p-4"
> >
<div className="card-body"> <div className="card-body">
<h2 className="card-title">{instance.name}</h2> <h2 className="card-title">{sujetRespo.name}</h2>
{instance.tp && ( {sujetRespo && (
<p className="text-lg">Linked to: {instance.tp.name}</p> <p className="text-lg">Linked to: {sujetRespo.name}</p>
)} )}
<div className="card-actions justify-end"> <div className="card-actions justify-end">
{false && ( {false && (
<Link <Link
to={`/instances/${instance.id}`} to={`/subject/${sujetRespo.id}`}
className="btn btn-primary" className="btn btn-primary"
> >
Learn More Learn More
</Link> </Link>
)} )}
{instance.tp && ( {sujetRespo && (
<Link <Link
to={`/tps/${instance.tp.id}`} to={`/subject/${sujetRespo.id}`}
className="btn btn-primary" className="btn btn-primary"
> >
See TP See TP
@ -90,13 +92,41 @@ function Dashboard() {
</div> </div>
</div> </div>
))} ))}
{dashboard.instances.length === 0 && (
<h1 className="text-xl">You have no instances</h1>
)}
</div> </div>
</div> </div>
</section> </section>
<section className="py-8"> )}
<section className="py-16">
<div className="container mx-auto">
<h3 className="text-2xl font-bold text-center mb-6">
Immersions - Activites
</h3>
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
{dashboard.jiParticipant.map((jiParticipant: Ji) => (
<div
key={jiParticipant.id}
className="card card-compact bg-base-200 shadow-lg p-4"
>
<div className="card-body">
<h2 className="card-title">{jiParticipant.name}</h2>
<p>{jiParticipant.description}</p>
<div className="card-actions justify-end">
<Link to={`/immersion/${jiParticipant.id}`} className="btn btn-primary">
Learn More
</Link>
</div>
</div>
</div>
))}
</div>
{dashboard.jiParticipant.length === 0 && (
<div className="container mx-auto text-center">
<h1 className="text-xl">You are not registered on any activities.</h1>
</div>
)}
</div>
</section>
<section className="py-8">
<div className="container mx-auto text-center"> <div className="container mx-auto text-center">
<h4 className="text-2xl font-semibold">Messages</h4> <h4 className="text-2xl font-semibold">Messages</h4>
<p className="mt-4 text-gray-700">You have no messages</p> <p className="mt-4 text-gray-700">You have no messages</p>

View File

@ -24,7 +24,7 @@ const LoginPage: React.FC = () => {
if (response.status === 200) { if (response.status === 200) {
axios.get("/api/users/me").then((res) => { axios.get("/api/users/me").then((res) => {
localStorage.setItem("username", res.data.username); localStorage.setItem("username", res.data.username);
if (res.data.roles.includes("root")) { if (res.data.roles.includes("ROOT")) {
localStorage.setItem("root", "true"); localStorage.setItem("root", "true");
} else { } else {
localStorage.removeItem("root"); localStorage.removeItem("root");

View File

@ -1,7 +1,8 @@
import { Instance } from "./InstanceType"; import { Ji } from "./JiType";
import { Tp } from "./TpType"; import { Sujet } from "./SujetType";
export interface DashboardType { export interface DashboardType {
tps: Tp[]; jiRespo: Ji[];
instances: Instance[]; jiParticipant: Ji[];
sujetRespo: Sujet[];
} }

View File

@ -1,4 +1,4 @@
import { Tp } from "./TpType"; import { Ji } from "./JiType";
import { User } from "./UserType"; import { User } from "./UserType";
export interface Instance { export interface Instance {

12
src/type/JiType.ts Normal file
View File

@ -0,0 +1,12 @@
import { Sujet } from "./SujetType";
import { User } from "./UserType";
export interface Ji {
name: string;
description: string;
respos: User[];
date: string;
site: Site;
participants: User[];
//instances: Instances[];
}

7
src/type/SujetType.ts Normal file
View File

@ -0,0 +1,7 @@
export interface Sujet {
id: number;
name: string;
description: string;
pdfLink: string;
respos: string;
}

View File

@ -1,11 +0,0 @@
export interface Tp {
id: number;
name: string;
description: string;
pdfLink: string;
respo: string;
date: string;
ssh: string;
port: string;
pwd: string;
}