Imbus/TTime
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Checks if new project name meets requirements

Browse source
This commit is contained in:
Peter KW 2024-04-13 21:09:07 +02:00
parent ebe0f380c5
commit bcac9c020e
1 changed files with 19 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

27
frontend/src/Components/ProjectInfoModal.tsx
View file

@ -5,11 +5,14 @@ import { Link } from "react-router-dom";
import GetProjectTimes, { projectTimes } from "./GetProjectTimes";
import DeleteProject from "./DeleteProject";
import InputField from "./InputField";
import ProjectNameInput from "./Inputs/ProjectNameInput";
import { alphanumeric } from "../Data/regex";
import { projNameHighLimit, projNameLowLimit } from "../Data/constants";
function ProjectInfoModal(props: {
projectname: string;
onClose: () => void;
onClick: (username: string) => void;
onClick: (username: string, userRole: string) => void;
}): JSX.Element {
const [showInput, setShowInput] = useState(false);
const [users, setUsers] = useState<ProjectMember[]>([]);
@ -23,6 +26,7 @@ function ProjectInfoModal(props: {
const handleChangeNameView = (): void => {
if (showInput) {
setNewProjName("");
setShowInput(false);
} else {
setShowInput(true);
@ -30,7 +34,16 @@ function ProjectInfoModal(props: {
};
const handleClickChangeName = (): void => {
if (newProjName === "") return;
if (
newProjName.length > projNameHighLimit ||
newProjName.length < projNameLowLimit ||
!alphanumeric.test(newProjName)
) {
alert(
"Please provide valid project name: \n-Between 10-99 characters \n-No special characters (.-!?/*)",
);
return;
}
if (
confirm(
@ -68,14 +81,12 @@ function ProjectInfoModal(props: {
{showInput && (
<>
<h2 className="text-[20px] font-bold pb-2">Change name:</h2>
<div className="border-2 rounded-2xl border-black p-6 mb-7 space-y-4">
<InputField
type={"text"}
value={newProjName}
<div className="border-2 rounded-2xl border-black px-6 pt-6 pb-1 mb-7">
<ProjectNameInput
name={newProjName}
onChange={function (e): void {
setNewProjName(e.target.value);
}}
placeholder={"Project Name"}
/>
<div className="px-6 grid grid-cols-2 gap-10">
<Button
@ -130,7 +141,7 @@ function ProjectInfoModal(props: {
className="items-start px-2 py-1 border-2 border-black rounded-2xl bg-orange-200 transition-all hover:bg-orange-600 hover:text-white hover:cursor-pointer"
key={user.Username}
onClick={() => {
props.onClick(user.Username);
props.onClick(user.Username, user.UserRole);
}}
>
<span>