zitadel

1
import React, { useState, useEffect } from "react";
2

3
export const AuthRequestContext = React.createContext(null);
4

5
export default ({ children }) => {
6
  const [instance, setInstance] = useState("your-instance");
7
  const [clientId, setClientId] = useState("your-client-id");
8
  const [redirectUri, setRedirectUri] = useState("your-redirect-uri");
9
  const [responseType, setResponseType] = useState("your-response-type");
10
  const [scope, setScope] = useState("your-scope");
11

12
  const [prompt, setPrompt] = useState("your-prompt");
13
  const [authMethod, setAuthMethod] = useState("your-auth-method");
14
  const [codeChallenge, setCodeChallenge] = useState("your-code-challenge");
15
  const [codeVerifier, setCodeVerifier] = useState("your-code-verifier");
16
  const [loginHint, setLoginHint] = useState("your-login-hint");
17
  const [idTokenHint, setIdTokenHint] = useState("your-id-token-hint");
18
  const [organizationId, setOrganizationId] = useState("your-organization-id");
19

20
  useEffect(() => {
21
    const params = new URLSearchParams(window.location.search);
22

23
    const instance_param = params.get("instance");
24
    const client_id = params.get("client_id");
25
    const redirect_uri = params.get("redirect_uri");
26
    const response_type = params.get("response_type");
27
    const scope_param = params.get("scope");
28

29
    // optional parameters
30
    const prompt_param = params.get("prompt");
31
    const auth_method_param = params.get("auth_method");
32
    const code_verifier_param = params.get("code_verifier");
33
    const login_hint = params.get("login_hint");
34
    const id_token_hint = params.get("id_token_hint");
35
    const organization_id = params.get("organization_id");
36

37
    setInstance(instance_param ?? "https://mydomain-xyza.zitadel.cloud/");
38
    setClientId(client_id ?? "170086824411201793@yourapp");
39
    setRedirectUri(
40
      redirect_uri ?? "http://localhost:8080/api/auth/callback/zitadel"
41
    );
42
    setResponseType(response_type ?? "code");
43
    setScope(scope_param ?? "openid email profile");
44
    setPrompt(prompt_param ?? "");
45
    setAuthMethod(auth_method_param ?? "(none) PKCE");
46
    setCodeVerifier(code_verifier_param ?? "random-string");
47
    // optional parameters
48
    setLoginHint(login_hint ?? "johndoe@example.zitadel.cloud");
49
    setIdTokenHint(id_token_hint ?? "[your-id-token]");
50
    setOrganizationId(organization_id ?? "168811945419506433");
51

52
    if (
53
      instance_param ||
54
      client_id ||
55
      redirect_uri ||
56
      response_type ||
57
      scope_param ||
58
      prompt_param ||
59
      organization_id ||
60
      login_hint ||
61
      id_token_hint
62
    ) {
63
      const example = document.getElementById("example");
64
      if (example) {
65
        example.scrollIntoView();
66
      }
67
    }
68
  }, []);
69

70
  const authRequest = {
71
    instance: [instance, setInstance],
72
    clientId: [clientId, setClientId],
73
    redirectUri: [redirectUri, setRedirectUri],
74
    responseType: [responseType, setResponseType],
75
    scope: [scope, setScope],
76
    prompt: [prompt, setPrompt],
77
    authMethod: [authMethod, setAuthMethod],
78
    codeChallenge: [codeChallenge, setCodeChallenge],
79
    codeVerifier: [codeVerifier, setCodeVerifier],
80
    loginHint: [loginHint, setLoginHint],
81
    idTokenHint: [idTokenHint, setIdTokenHint],
82
    organizationId: [organizationId, setOrganizationId],
83
  };
84

85
  return (
86
    <AuthRequestContext.Provider value={authRequest}>
87
      {children}
88
    </AuthRequestContext.Provider>
89
  );
90
};
91