Hide org slug input when default slug is set

This commit is contained in:
Daniel Hougaard
2024-06-24 19:08:19 +02:00
parent 4905ad1f48
commit e1a4185f76
+21 -15
View File
@@ -4,15 +4,19 @@ import { useRouter } from "next/router";
import { createNotification } from "@app/components/notifications"; import { createNotification } from "@app/components/notifications";
import { Button, Input } from "@app/components/v2"; import { Button, Input } from "@app/components/v2";
import { useServerConfig } from "@app/context";
import { loginLDAPRedirect } from "@app/hooks/api/auth/queries"; import { loginLDAPRedirect } from "@app/hooks/api/auth/queries";
export const LoginLDAP = () => { export const LoginLDAP = () => {
const router = useRouter(); const router = useRouter();
const { config } = useServerConfig();
const queryParams = new URLSearchParams(window.location.search); const queryParams = new URLSearchParams(window.location.search);
const passedOrgSlug = queryParams.get("organizationSlug"); const passedOrgSlug = queryParams.get("organizationSlug");
const passedUsername = queryParams.get("username"); const passedUsername = queryParams.get("username");
const [organizationSlug, setOrganizationSlug] = useState(passedOrgSlug || ""); const [organizationSlug, setOrganizationSlug] = useState(
config.defaultOrgSlug || passedOrgSlug || ""
);
const [username, setUsername] = useState(passedUsername || ""); const [username, setUsername] = useState(passedUsername || "");
const [password, setPassword] = useState(""); const [password, setPassword] = useState("");
@@ -63,21 +67,23 @@ export const LoginLDAP = () => {
What's your LDAP Login? What's your LDAP Login?
</p> </p>
<form onSubmit={handleSubmission}> <form onSubmit={handleSubmission}>
<div className="relative mx-auto flex max-h-24 w-1/4 w-full min-w-[20rem] items-center justify-center rounded-lg md:max-h-28 md:min-w-[22rem] lg:w-1/6"> {!config.defaultOrgSlug && (
<div className="flex max-h-24 w-full items-center justify-center rounded-lg md:max-h-28"> <div className="relative mx-auto flex max-h-24 w-1/4 w-full min-w-[20rem] items-center justify-center rounded-lg md:max-h-28 md:min-w-[22rem] lg:w-1/6">
<Input <div className="flex max-h-24 w-full items-center justify-center rounded-lg md:max-h-28">
value={organizationSlug} <Input
onChange={(e) => setOrganizationSlug(e.target.value)} value={organizationSlug}
type="text" onChange={(e) => setOrganizationSlug(e.target.value)}
placeholder="Enter your organization slug..." type="text"
isRequired placeholder="Enter your organization slug..."
autoComplete="email" isRequired
id="email" autoComplete="email"
className="h-12" id="email"
isDisabled={passedOrgSlug !== null} className="h-12"
/> isDisabled={passedOrgSlug !== null}
/>
</div>
</div> </div>
</div> )}
<div className="relative mx-auto mt-2 flex max-h-24 w-1/4 w-full min-w-[20rem] items-center justify-center rounded-lg md:max-h-28 md:min-w-[22rem] lg:w-1/6"> <div className="relative mx-auto mt-2 flex max-h-24 w-1/4 w-full min-w-[20rem] items-center justify-center rounded-lg md:max-h-28 md:min-w-[22rem] lg:w-1/6">
<div className="flex max-h-24 w-full items-center justify-center rounded-lg md:max-h-28"> <div className="flex max-h-24 w-full items-center justify-center rounded-lg md:max-h-28">
<Input <Input