Small fixes to design

This commit is contained in:
Peter KW 2024-03-19 01:48:01 +01:00
parent 6a84b1c14d
commit cdbd6ca0ce
2 changed files with 14 additions and 17 deletions

View file

@ -16,12 +16,19 @@ function UserInfoModal(props: {
flex justify-center items-center" flex justify-center items-center"
> >
<div className="border-4 border-black bg-white p-2 rounded-lg text-center"> <div className="border-4 border-black bg-white p-2 rounded-lg text-center">
<h1 className="font-bold text-[30px] mb-[20px]">{props.username}</h1> <p className="font-bold text-[30px]">{props.username}</p>
<Link to="/AdminChangeUserName">
<p className="mb-[20px] hover:font-bold hover:cursor-pointer underline">
(Change Username)
</p>
</Link>
<div> <div>
<h2 className="font-bold text-[22px] mb-[20px]"> <h2 className="font-bold text-[22px] mb-[20px]">
Member of these projects: Member of these projects:
</h2> </h2>
<UserProjectListAdmin username={props.username} /> <div className="pr-6 pl-6">
<UserProjectListAdmin />
</div>
</div> </div>
<div className="items-center space-x-6 pr-6 pl-6"> <div className="items-center space-x-6 pr-6 pl-6">
<Button <Button
@ -31,15 +38,6 @@ function UserInfoModal(props: {
}} }}
type="button" type="button"
/> />
<Link to="/AdminChangeUserName">
<Button
text="Change Username"
onClick={(): void => {
return;
}}
type="button"
/>
</Link>
<Button <Button
text={"Close"} text={"Close"}
onClick={function (): void { onClick={function (): void {

View file

@ -2,16 +2,16 @@ import { useEffect, useState } from "react";
import { api } from "../API/API"; import { api } from "../API/API";
import { Project } from "../Types/goTypes"; import { Project } from "../Types/goTypes";
function UserProjectListAdmin(props: { username: string }): JSX.Element { function UserProjectListAdmin(): JSX.Element {
const [projects, setProjects] = useState<Project[]>([]); const [projects, setProjects] = useState<Project[]>([]);
useEffect(() => { useEffect(() => {
const fetchProjects = async (): Promise<void> => { const fetchProjects = async (): Promise<void> => {
try { try {
const token = localStorage.getItem("accessToken") ?? ""; const token = localStorage.getItem("accessToken") ?? "";
const username = props.username; // const username = props.username;
const response = await api.getUserProjects(username, token); const response = await api.getUserProjects(token);
if (response.success) { if (response.success) {
setProjects(response.data ?? []); setProjects(response.data ?? []);
} else { } else {
@ -23,11 +23,10 @@ function UserProjectListAdmin(props: { username: string }): JSX.Element {
}; };
void fetchProjects(); void fetchProjects();
}); }, []);
return ( return (
<div> <div className="border-2 border-black bg-white p-2 rounded-lg text-center">
<h2>User Projects</h2>
<ul> <ul>
{projects.map((project) => ( {projects.map((project) => (
<li key={project.id}> <li key={project.id}>