WIP: update: adaptations to use the new backend #1
@ -7,7 +7,7 @@ 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("name");
|
const username = localStorage.getItem("username");
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
axios.get("/api/dashboard").then((res) => {
|
axios.get("/api/dashboard").then((res) => {
|
||||||
setDashboard(res.data);
|
setDashboard(res.data);
|
||||||
|
|||||||
@ -4,11 +4,13 @@ import { useEffect, useState } from "react";
|
|||||||
import { useParams } from "react-router-dom";
|
import { useParams } from "react-router-dom";
|
||||||
import { toast } from "react-toastify";
|
import { toast } from "react-toastify";
|
||||||
import { Ji } from "../type/JiType";
|
import { Ji } from "../type/JiType";
|
||||||
|
import { Instance } from "../type/InstanceType";
|
||||||
|
|
||||||
function Immersion() {
|
function Immersion() {
|
||||||
const { id } = useParams();
|
const { id } = useParams();
|
||||||
const [ji, setJi] = useState<Ji>();
|
const [ji, setJi] = useState<Ji>();
|
||||||
|
const [instance, setInstance] = useState<Instance>();
|
||||||
|
const username = localStorage.getItem("username");
|
||||||
const copyText = (copy: string) => {
|
const copyText = (copy: string) => {
|
||||||
navigator.clipboard.writeText(copy);
|
navigator.clipboard.writeText(copy);
|
||||||
toast.success("Copied!", {
|
toast.success("Copied!", {
|
||||||
@ -22,6 +24,18 @@ function Immersion() {
|
|||||||
setJi(res.data);
|
setJi(res.data);
|
||||||
});
|
});
|
||||||
}, [id]);
|
}, [id]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
axios.get(`/api/ji/${id}/instances`).then((res) => {
|
||||||
|
setInstance(res.data);
|
||||||
|
});
|
||||||
|
}, [id]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
axios.get("/api/user/me").then((res) => {
|
||||||
|
localStorage.setItem("username", res.data.username);
|
||||||
|
});
|
||||||
|
}, []);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
@ -41,44 +55,36 @@ function Immersion() {
|
|||||||
<span>Description:</span>
|
<span>Description:</span>
|
||||||
<span className="font-medium">{ji.description}</span>
|
<span className="font-medium">{ji.description}</span>
|
||||||
</li>
|
</li>
|
||||||
<li className="flex justify-between">
|
|
||||||
<span>Tools Used:</span>
|
|
||||||
<span className="font-medium">Python, SSH, Vim</span>
|
|
||||||
</li>
|
|
||||||
<li className="flex justify-between">
|
|
||||||
<span>Difficulty:</span>
|
|
||||||
<span className="font-medium">Beginner</span>
|
|
||||||
</li>
|
|
||||||
<li className="flex justify-between">
|
<li className="flex justify-between">
|
||||||
<span>Date:</span>
|
<span>Date:</span>
|
||||||
<span className="font-medium">{ji.date}</span>
|
<span className="font-medium">{ji.date}</span>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div className="bg-base-200 p-6 rounded-lg shadow-md mt-6">
|
{ instance && <div className="bg-base-200 p-6 rounded-lg shadow-md mt-6">
|
||||||
<h2 className="text-2xl font-semibold text-blue-600 mb-2">
|
<h2 className="text-2xl font-semibold text-blue-600 mb-2">
|
||||||
Resources
|
Your credentials :
|
||||||
</h2>
|
</h2>
|
||||||
<ul className="space-y-2">
|
<ul className="space-y-2">
|
||||||
<li className="flex justify-between align-middle items-center">
|
<li className="flex justify-between align-middle items-center">
|
||||||
<span>SSH:</span>
|
<span>SSH:</span>
|
||||||
<div
|
<div
|
||||||
className="flex gap-2 items-center"
|
className="flex gap-2 items-center"
|
||||||
onClick={() => copyText(ji.ssh)}
|
onClick={() => copyText("ssh -P {$instance.port} {$username}@la-banquise.fr")}
|
||||||
>
|
>
|
||||||
<span className="font-medium">{ji.ssh}</span>
|
<span className="font-medium">ssh -P {instance.port} {username}@la-banquise.fr</span>
|
||||||
<div className="h-8 w-8 hover:bg-base-100 align-middle cursor-pointer flex items-center justify-center rounded">
|
<div className="h-8 w-8 hover:bg-base-100 align-middle cursor-pointer flex items-center justify-center rounded">
|
||||||
<ClipboardIcon className="size-6" />
|
<ClipboardIcon className="size-6" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
<li className="flex justify-between align-middle items-center">
|
<li className="flex justify-between align-middle items-center">
|
||||||
<span>Port:</span>
|
<span>Instance name:</span>
|
||||||
<div
|
<div
|
||||||
className="flex gap-2 items-center"
|
className="flex gap-2 items-center"
|
||||||
onClick={() => copyText(ji.port)}
|
onClick={() => copyText(instance.name)}
|
||||||
>
|
>
|
||||||
<span className="font-medium">{ji.port}</span>
|
<span className="font-medium">{instance.name}</span>
|
||||||
<div className="h-8 w-8 hover:bg-base-100 align-middle cursor-pointer flex items-center justify-center rounded">
|
<div className="h-8 w-8 hover:bg-base-100 align-middle cursor-pointer flex items-center justify-center rounded">
|
||||||
<ClipboardIcon className="size-6" />
|
<ClipboardIcon className="size-6" />
|
||||||
</div>
|
</div>
|
||||||
@ -97,7 +103,7 @@ function Immersion() {
|
|||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>}
|
||||||
<a
|
<a
|
||||||
href={ji.pdfLink}
|
href={ji.pdfLink}
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
|||||||
@ -53,18 +53,15 @@ function BulkUsers() {
|
|||||||
axios
|
axios
|
||||||
.post("/api/users", {
|
.post("/api/users", {
|
||||||
users: userData.filter((user: CSVParseType) => user.name !== ""),
|
users: userData.filter((user: CSVParseType) => user.name !== ""),
|
||||||
jiId: 1, // TODO: Unhardcode this
|
jiId: 1,
|
||||||
}).then((res) => {
|
}).then((res) => {
|
||||||
if (res.status === 200) {
|
if (res.status === 200) {
|
||||||
navigate(`/admin/users`);
|
alert(`Users succesfully created !\n${res}`);
|
||||||
}
|
}
|
||||||
else if (res.status === 202) {
|
if (res.status === 202)
|
||||||
alert(`Couldn't create some users`);
|
alert(`Couldn't create some users`);
|
||||||
navigate(`/admin/users`);
|
if (res.status === 500)
|
||||||
}
|
|
||||||
else {
|
|
||||||
alert(`Couldn't create ANY users`);
|
alert(`Couldn't create ANY users`);
|
||||||
}
|
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -120,7 +117,7 @@ function BulkUsers() {
|
|||||||
<button
|
<button
|
||||||
onClick={handleSubmit}
|
onClick={handleSubmit}
|
||||||
className="btn btn-primary mt-4"
|
className="btn btn-primary mt-4"
|
||||||
disabled={userData.length === 0}
|
disabled={userData.length === 0 || practical == "0"}
|
||||||
>
|
>
|
||||||
Create Users
|
Create Users
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@ -62,12 +62,12 @@ function CreateJi() {
|
|||||||
|
|
||||||
<div>
|
<div>
|
||||||
<label className="block text-gray-700 font-semibold mb-2">
|
<label className="block text-gray-700 font-semibold mb-2">
|
||||||
Respo:
|
Description:
|
||||||
</label>
|
</label>
|
||||||
<textarea
|
<textarea
|
||||||
type="text"
|
type="text"
|
||||||
name="respo"
|
name="desc"
|
||||||
value={ji.respo}
|
value={ji.desc}
|
||||||
onChange={handleInputChange}
|
onChange={handleInputChange}
|
||||||
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
className="w-full px-4 py-2 border rounded-lg focus:outline-none focus:ring-2 focus:ring-blue-500"
|
||||||
placeholder="Enter ji description"
|
placeholder="Enter ji description"
|
||||||
|
|||||||
@ -1,11 +1,7 @@
|
|||||||
import { Ji } from "./JiType";
|
|
||||||
import { User } from "./UserType";
|
import { User } from "./UserType";
|
||||||
|
|
||||||
export interface Instance {
|
export interface Instance {
|
||||||
id: number;
|
id: number;
|
||||||
name: string;
|
name: string;
|
||||||
ssh: string;
|
port: string;
|
||||||
pwd: string;
|
|
||||||
user: User;
|
|
||||||
tp: Tp;
|
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user