diff --git a/src/component/Navigation/Navigation.tsx b/src/component/Navigation/Navigation.tsx index 33b4f1d..114416d 100644 --- a/src/component/Navigation/Navigation.tsx +++ b/src/component/Navigation/Navigation.tsx @@ -46,9 +46,10 @@ const Navigation: React.FC = ({ navigate("/login"); } }); - localStorage.setItem("theme", theme); + if (theme) localStorage.setItem("theme", theme); const localTheme = localStorage.getItem("theme"); - document.querySelector("html").setAttribute("data-theme", localTheme); + const doc = document.querySelector("html"); + if (doc) doc.setAttribute("data-theme", localTheme || "dark"); }, [theme, navigate]); return ( diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx index 458d535..a3839a6 100644 --- a/src/pages/Dashboard.tsx +++ b/src/pages/Dashboard.tsx @@ -2,9 +2,10 @@ import { useEffect, useState } from "react"; import axios from "axios"; import { Link } from "react-router-dom"; import { Tp } from "../type/TpType"; +import { DashboardType } from "../type/Dashboard"; function Dashboard() { - const [dashboard, setDashboard] = useState(null); + const [dashboard, setDashboard] = useState(null); const username = localStorage.getItem("username"); useEffect(() => { axios.get("/api/dashboard").then((res) => { diff --git a/src/pages/Instances.tsx b/src/pages/Instances.tsx index d96c6f3..ae4551d 100644 --- a/src/pages/Instances.tsx +++ b/src/pages/Instances.tsx @@ -1,6 +1,7 @@ import { useEffect, useState } from "react"; import axios from "axios"; import { Link } from "react-router-dom"; +import { Instance } from "../type/InstanceType"; function Instances() { const [instances, setInstances] = useState([]); @@ -15,7 +16,7 @@ function Instances() {

Your instances

- {instances.map((instance) => ( + {instances.map((instance: Instance) => (
diff --git a/src/pages/Practicals.tsx b/src/pages/Practicals.tsx index d4a0f69..70a18e6 100644 --- a/src/pages/Practicals.tsx +++ b/src/pages/Practicals.tsx @@ -1,6 +1,7 @@ import { useEffect, useState } from "react"; import axios from "axios"; import { Link } from "react-router-dom"; +import { Tp } from "../type/TpType"; function Practicals() { const [tps, setTps] = useState([]); @@ -15,7 +16,7 @@ function Practicals() {

Your TPs

- {tps.map((practical) => ( + {tps.map((practical: Tp) => (
([]); + const [practical, setPractical] = useState("0"); + const navigate = useNavigate(); + const [tps, setTps] = useState([]); - const handlePracticalChange = (e: React.ChangeEvent) => { - setPractical(e.target.value); + const handlePracticalChange = (e: React.ChangeEvent) => { + setPractical(e.target.value); + }; + + useEffect(() => { + axios.get("/api/tps").then((res) => { + setTps(res.data); + }); + }, []); + + const handleFileChange = (event: React.ChangeEvent) => { + if (event.target.files) { + const selectedFile = event.target.files[0]; + parseCSV(selectedFile); + } + }; + + const parseCSV = (file: File) => { + const reader = new FileReader(); + reader.onload = (event: ProgressEvent) => { + if (event.target) { + const text = event.target.result!.toString(); + const rows = text.split("\n").map((row) => row.split(",")); + const formattedData = rows.map((row) => ({ + name: row[0], + email: row[1], + password: row[2], + instance_name: row[3], + instance_ssh: row[4], + instance_port: row[5], + instance_pwd: row[6], + })); + setUserData(formattedData); + } }; + reader.readAsText(file); + }; - useEffect(() => { - axios.get("/api/tps").then((res) => { - setTps(res.data); - }); - }, []); + const handleSubmit = () => { + axios + .post("/api/users/jdmi", { + users: userData.filter((user: CSVParseType) => user.name !== ""), + tpId: practical, + }) + .then(() => navigate(`/admin/users`)); + }; - const handleFileChange = (event: React.ChangeEvent) => { - const selectedFile = event.target.files[0]; - parseCSV(selectedFile); - }; - - const parseCSV = (file: File) => { - const reader = new FileReader(); - reader.onload = (event: ProgressEvent) => { - const text = event.target.result; - const rows = text.split("\n").map((row) => row.split(",")); - const formattedData = rows.map((row) => ({ - name: row[0], - email: row[1], - password: row[2], - instance_name: row[3], - instance_ssh: row[4], - instance_port: row[5], - instance_pwd: row[6], - })); - setUserData(formattedData); - }; - reader.readAsText(file); - }; - - const handleSubmit = () => { - // Handle submission logic (e.g., sending data to the backend) - console.log(practical); - axios - .post("/api/users/jdmi", { - users: userData.filter((user) => user.name !== ""), - tpId: practical, - }) - .then(() => navigate(`/admin/users`)); - }; - - return ( -
-

Bulk User Creation

- - {userData.length > 0 && ( -
- - - - - - - - - - - - - - {userData.map((user, index) => ( - - - - - - - - - - ))} - -
NameEmailPasswordInstance nameInstance sshInstance portInstance pwd
{user.name}{user.email}{user.password}{user.instance_name}{user.instance_ssh}{user.instance_port}{user.instance_pwd}
-
- )} - -
- - -
- + return ( +
+

Bulk User Creation

+ + {userData.length > 0 && ( +
+ + + + + + + + + + + + + + {userData.map((user: BulkUserCreattionType, index: number) => ( + + + + + + + + + + ))} + +
NameEmailPasswordInstance nameInstance sshInstance portInstance pwd
{user.name}{user.email}{user.password}{user.instance_name}{user.instance_ssh}{user.instance_port}{user.instance_pwd}
- ); + )} + +
+ + +
+ +
+ ); } export default BulkUsers; diff --git a/src/pages/admin/Users.tsx b/src/pages/admin/Users.tsx index d9d4c6b..b418c8a 100644 --- a/src/pages/admin/Users.tsx +++ b/src/pages/admin/Users.tsx @@ -1,5 +1,6 @@ import axios from "axios"; import { useEffect, useState } from "react"; +import { User } from "../../type/UserType"; function Users() { const [users, setUsers] = useState([]); @@ -11,13 +12,12 @@ function Users() { }); }, [reload]); - const handleEditUser = (userId) => { + const handleEditUser = (userId: number) => { alert(`Edit user with ID: ${userId}`); }; const deleteJDMIUsers = () => { - axios.delete("/api/users").then((res) => { - console.log(res.data); + axios.delete("/api/users").then(() => { setReload(reload + 1); }); }; @@ -48,7 +48,7 @@ function Users() { - {users.map((user, index) => ( + {users.map((user: User, index: number) => ( {index + 1} {user.name} diff --git a/src/type/BulkUserCreattionType.ts b/src/type/BulkUserCreattionType.ts new file mode 100644 index 0000000..b64cbeb --- /dev/null +++ b/src/type/BulkUserCreattionType.ts @@ -0,0 +1,9 @@ +export interface BulkUserCreattionType { + name: string; + email: string; + password: string; + instance_name: string; + instance_ssh: string; + instance_port: string; + instance_pwd: string; +} diff --git a/src/type/CSVParseType.ts b/src/type/CSVParseType.ts new file mode 100644 index 0000000..914a793 --- /dev/null +++ b/src/type/CSVParseType.ts @@ -0,0 +1,9 @@ +export interface CSVParseType { + name: string; + email: string; + password: string; + instance_name: string; + instance_ssh: string; + instance_port: string; + instance_pwd: string; +} diff --git a/src/type/Dashboard.ts b/src/type/Dashboard.ts new file mode 100644 index 0000000..18c3925 --- /dev/null +++ b/src/type/Dashboard.ts @@ -0,0 +1,7 @@ +import { Instance } from "./InstanceType"; +import { Tp } from "./TpType"; + +export interface DashboardType { + tps: Tp[]; + instances: Instance[]; +} diff --git a/src/type/TpType.ts b/src/type/TpType.ts index c2705cd..568d5f7 100644 --- a/src/type/TpType.ts +++ b/src/type/TpType.ts @@ -5,4 +5,7 @@ export interface Tp { pdfLink: string; respo: string; date: string; + ssh: string; + port: string; + pwd: string; } diff --git a/src/type/UserType.ts b/src/type/UserType.ts index 1580632..9405873 100644 --- a/src/type/UserType.ts +++ b/src/type/UserType.ts @@ -4,4 +4,6 @@ export interface User { id: number; name: string; instances: Instance[]; + email: string; + roles: string; }