fix (@jitsucom/console): signin page markup + oidc configuration handling (#1167)

* update html
* add oidcLoginEnabled
* remove unused prop

Author: danhemerlein

webapps/console/lib/nextauth.config.ts

@@ -16,6 +16,7 @@ const crypto = require("crypto");
 const log = getServerLog("auth");
 
 export const githubLoginEnabled = !!process.env.GITHUB_CLIENT_ID;
+export const oidcLoginEnabled = !!process.env.AUTH_OIDC_PROVIDER;
 export const oidcLoginConfig = ParseJSONConfigFromEnv(process.env.AUTH_OIDC_PROVIDER as string);
 export const credentialsLoginEnabled =
   isTruish(process.env.ENABLE_CREDENTIALS_LOGIN) || !!(process.env.SEED_USER_EMAIL && process.env.SEED_USER_PASSWORD);

webapps/console/pages/signin.tsx

@@ -9,7 +9,7 @@ import React, { useState } from "react";
 import { feedbackError } from "../lib/ui";
 import { useRouter } from "next/router";
 import { branding } from "../lib/branding";
-import { credentialsLoginEnabled, githubLoginEnabled, oidcLoginConfig } from "../lib/nextauth.config";
+import { credentialsLoginEnabled, githubLoginEnabled, oidcLoginEnabled } from "../lib/nextauth.config";
 import { useQuery } from "@tanstack/react-query";
 
 function JitsuLogo() {
@@ -21,7 +21,7 @@ function JitsuLogo() {
   );
 }
 
-function CredentialsForm({}) {
+function CredentialsForm() {
   const lastUsedLogin = localStorage.getItem("last-used-login-email") || undefined;
   const { data, isLoading, error } = useQuery(["next-auth-csrfToken"], async () => {
     return {
@@ -130,12 +130,12 @@ const NextAuthSignInPage = ({ csrfToken, providers: { github, oidc, credentials
     return (
       <div className="w-screen h-screen flex flex-col items-center justify-center">
         <AlertTriangle className="w-32 h-32 text-error" />
-        <div className="mt-3 text-textLight text-center">
+        <p className="mt-3 text-textLight text-center">
           This page should not be used if Firebase authorization is enabled. Please proceed to a{" "}
           <Link href="/" className="underline text-primary">
             main page of the app
           </Link>
-        </div>
+        </p>
       </div>
     );
   }
@@ -144,34 +144,34 @@ const NextAuthSignInPage = ({ csrfToken, providers: { github, oidc, credentials
       <div className="space-y-2 flex justify-center h-16">
         <JitsuLogo />
       </div>
-      <div className={"flex flex-col gap-1.5"}>
+      <div className="flex flex-col gap-1.5">
         {credentials.enabled && <CredentialsForm />}
         {credentials.enabled && (github.enabled || oidc.enabled) && <hr className="my-4" />}
         {github.enabled && <GitHubSignIn />}
         {oidc.enabled && <OIDCSignIn />}
       </div>
       {router.query.error && (
-        <div className="text-error">
+        <p className="text-error">
           Something went wrong. Please try again. Error code: <code>{router.query.error}</code>
-        </div>
+        </p>
       )}
       {!app.disableSignup && (github.enabled || oidc.enabled) && (
-        <div className="text-center text-textLight text-xs">
+        <p className="text-center text-textLight text-xs">
           Automatic signup is enabled for this instance. Sign in with github and if you don't have an account, a new
           account will be created automatically. This account won't have any access to pre-existing project unless the
           access is explicitly granted
-        </div>
+        </p>
       )}
     </div>
   );
 };
 
-export async function getServerSideProps(context) {
+export async function getServerSideProps() {
   if (process.env.FIREBASE_AUTH) {
     throw new Error(`Firebase auth is enabled. This page should not be used.`);
   }
-  if (!githubLoginEnabled && !credentialsLoginEnabled && !oidcLoginConfig) {
-    throw new Error(`No auth providers are enabled found. Available providers: github, credentials`);
+  if (!githubLoginEnabled && !credentialsLoginEnabled && !oidcLoginEnabled) {
+    throw new Error(`No auth providers are enabled found. Available providers: github, credentials, OIDC`);
   }
   return {
     props: {
@@ -184,7 +184,7 @@ export async function getServerSideProps(context) {
           enabled: githubLoginEnabled,
         },
         oidc: {
-          enabled: !!oidcLoginConfig,
+          enabled: oidcLoginEnabled,
         },
       },
       publicPage: true,