feat: add login oauth grant page (#25)

Co-authored-by: Anthony Lukin <anthony@lukin.dev>

README.md

@@ -9,6 +9,7 @@ Keywind is a component-based Keycloak Login Theme built with [Tailwind CSS](http
 - Login
 - Login Config TOTP
 - Login IDP Link Confirm
+- Login OAuth Grant
 - Login OTP
 - Login Reset Password
 - Login Update Password

theme/keywind/login/login-config-totp.ftl

@@ -16,27 +16,27 @@
     ${msg("loginTotpTitle")}
   <#elseif section="form">
     <ol class="list-decimal pl-4 space-y-2">
-      <li>
+      <li class="space-y-2">
         <p>${msg("loginTotpStep1")}</p>
-        <ul class="list-disc pl-6 py-2 space-y-2">
+        <ul class="list-disc pl-4">
           <#list totp.supportedApplications as app>
             <li>${msg(app)}</li>
           </#list>
         </ul>
       </li>
       <#if mode?? && mode = "manual">
-        <li>
+        <li class="space-y-2">
           <p>${msg("loginTotpManualStep2")}</p>
-          <p class="font-bold py-2 text-xl">${totp.totpSecretEncoded}</p>
+          <p class="font-bold text-xl">${totp.totpSecretEncoded}</p>
         </li>
         <li>
           <@linkPrimary.kw href=totp.qrUrl>
             ${msg("loginTotpScanBarcode")}
           </@linkPrimary.kw>
         </li>
-        <li>
+        <li class="space-y-2">
           <p>${msg("loginTotpManualStep3")}</p>
-          <ul class="list-disc pl-6 py-2 space-y-2">
+          <ul class="list-disc pl-4">
             <li>${msg("loginTotpType")}: ${msg("loginTotp." + totp.policy.type)}</li>
             <li>${msg("loginTotpAlgorithm")}: ${totp.policy.getAlgorithmKey()}</li>
             <li>${msg("loginTotpDigits")}: ${totp.policy.digits}</li>
@@ -96,7 +96,6 @@
           <@buttonPrimary.kw type="submit">
             ${msg("doSubmit")}
           </@buttonPrimary.kw>
-
           <@buttonSecondary.kw name="cancel-aia" type="submit">
             ${msg("doCancel")}
           </@buttonSecondary.kw>

theme/keywind/login/login-oauth-grant.ftl

@@ -0,0 +1,61 @@
+<#import "template.ftl" as layout>
+<#import "components/button/primary.ftl" as buttonPrimary>
+<#import "components/button/secondary.ftl" as buttonSecondary>
+
+<@layout.registrationLayout; section>
+  <#if section="header">
+    <#if client.attributes.logoUri??>
+      <img class="mb-4 mx-auto" src="${client.attributes.logoUri}"/>
+    </#if>
+    <p>
+      <#if client.name?has_content>
+        ${msg("oauthGrantTitle", advancedMsg(client.name))}
+      <#else>
+        ${msg("oauthGrantTitle", client.clientId)}
+      </#if>
+    </p>
+  <#elseif section="form">
+    <h3>${msg("oauthGrantRequest")}</h3>
+    <ul class="list-disc pl-4">
+      <#if oauth.clientScopesRequested??>
+        <#list oauth.clientScopesRequested as clientScope>
+          <li>
+            <#if !clientScope.dynamicScopeParameter??>
+              ${advancedMsg(clientScope.consentScreenText)}
+            <#else>
+              ${advancedMsg(clientScope.consentScreenText)}: <b>${clientScope.dynamicScopeParameter}</b>
+            </#if>
+          </li>
+        </#list>
+      </#if>
+    </ul>
+    <#if client.attributes.policyUri?? || client.attributes.tosUri??>
+      <h3>
+        <#if client.name?has_content>
+          ${msg("oauthGrantInformation",advancedMsg(client.name))}
+        <#else>
+          ${msg("oauthGrantInformation",client.clientId)}
+        </#if>
+        <#if client.attributes.tosUri??>
+          ${msg("oauthGrantReview")}
+          <a href="${client.attributes.tosUri}" target="_blank">${msg("oauthGrantTos")}</a>
+        </#if>
+        <#if client.attributes.policyUri??>
+          ${msg("oauthGrantReview")}
+          <a href="${client.attributes.policyUri}" target="_blank">${msg("oauthGrantPolicy")}</a>
+        </#if>
+      </h3>
+    </#if>
+    <form action="${url.oauthAction}" class="m-0 space-y-4" method="POST">
+      <input name="code" type="hidden" value="${oauth.code}">
+      <div class="flex flex-col pt-4 space-y-2">
+        <@buttonPrimary.kw name="accept" type="submit">
+          ${msg("doYes")}
+        </@buttonPrimary.kw>
+        <@buttonSecondary.kw name="cancel" type="submit">
+          ${msg("doNo")}
+        </@buttonSecondary.kw>
+      </div>
+    </form>
+  </#if>
+</@layout.registrationLayout>