n/tid
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated variables names to make a bit more sense :) #2

Merged
n merged 2 commits from chore/var-cleanup_2025-03-13 into main 2025-03-13 04:42:45 +00:00
Conversation 0 Commits 2 Files Changed 1 +15 -19
1 changed files with 15 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/App.tsx
View File

@ -17,42 +17,38 @@ const uri =
"https://login.microsoft.com/{tenant}/.well-known/openid-configuration"; "https://login.microsoft.com/{tenant}/.well-known/openid-configuration";
function App() { function App() {
const [domain, setDomain] = useState<string>(location.hash.replace("#", "")); const [input, setInput] = useState<string>(location.hash.replace("#", ""));
const [tenantId, setTenantId] = useState<string | null>(null); const [tenantId, setTenantId] = useState<string | null>(null);
const [isLoading, setIsLoading] = useState<boolean>(false); const [isLoading, setIsLoading] = useState<boolean>(false);
const [error, setError] = useState<string | null>(null); const [error, setError] = useState<string | null>(null);
// const location = useLocation(); const [domain, setDomain] = useDebounce<string>(input, 500);
const [debouncedDomain, setDebouncedDomain] = useDebounce<string>(
domain,
500
);
const onChange = async (event: React.ChangeEvent<HTMLInputElement>) => const onChange = async (event: React.ChangeEvent<HTMLInputElement>) =>
setDomain(event.target.value); setInput(event.target.value);
useEffect(() => { useEffect(() => {
location.hash = debouncedDomain; location.hash = domain;
if ( if (
(!debouncedDomain.includes("@") && !debouncedDomain.includes(".")) || (!domain.includes("@") && !domain.includes(".")) ||
debouncedDomain.includes(" ") || domain.includes(" ") ||
debouncedDomain.endsWith(".") || domain.endsWith(".") ||
debouncedDomain.length < 3 || domain.length < 3 ||
debouncedDomain.length > 254 domain.length > 254
) { ) {
setTenantId(null); setTenantId(null);
setIsLoading(false); setIsLoading(false);
setError("Please enter a valid email address or domain."); setError("Please enter a valid email address or domain.");
return; return;
} }
if (debouncedDomain.includes("@")) { if (domain.includes("@")) {
const parts = debouncedDomain.split("@"); const parts = domain.split("@");
setIsLoading(false); setIsLoading(false);
setDebouncedDomain(parts[parts.length - 1]); setDomain(parts[parts.length - 1]);
return; return;
} }
setIsLoading(true); setIsLoading(true);
setError(null); setError(null);
(async function () { (async function () {
const response = await fetch(uri.replace("{tenant}", debouncedDomain)); const response = await fetch(uri.replace("{tenant}", domain));
const body = await response.json(); const body = await response.json();
if (!response.ok) { if (!response.ok) {
setTenantId(null); setTenantId(null);
@ -64,7 +60,7 @@ function App() {
setTenantId(myTenantId); setTenantId(myTenantId);
setIsLoading(false); setIsLoading(false);
})(); })();
}, [debouncedDomain, setDebouncedDomain]); }, [domain, setDomain]);
return ( return (
<> <>
@ -112,7 +108,7 @@ function App() {
<Input <Input
placeholder="Enter your email address or domain" placeholder="Enter your email address or domain"
onChange={onChange} onChange={onChange}
value={domain} value={input}
/> />
</CardFooter> </CardFooter>
</Card> </Card>