agtic/keycloak_theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rework Terms

Browse Source
This commit is contained in:
Joseph Garrone
2024-06-21 02:01:32 +02:00
parent 41739c8528
commit aa9b7cccc7
19 changed files with 918 additions and 297 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
src/login/pages/Register.tsx
View File

@ -1,5 +1,4 @@
import { useState } from "react";
import { Markdown } from "keycloakify/tools/Markdown";
import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
import { useTermsMarkdown } from "keycloakify/login/lib/useDownloadTerms";
import { getKcClsx, type KcClsx } from "keycloakify/login/lib/kcClsx";
@ -78,23 +77,14 @@ export default function Register(props: RegisterProps) {
function TermsAcceptance(props: { i18n: I18n; kcClsx: KcClsx; messagesPerField: Pick<KcContext["messagesPerField"], "existsError" | "get"> }) {
const { i18n, kcClsx, messagesPerField } = props;
const { msg } = i18n;
// NOTE: Refer to https://docs.keycloakify.dev/terms-and-conditions to load your terms and conditions.
const { termsMarkdown } = useTermsMarkdown();
if (termsMarkdown === undefined) {
return null;
}
const { msg, msgStr } = i18n;
return (
<>
<div className="form-group">
<div className={kcClsx("kcInputWrapperClass")}>
{msg("termsTitle")}
<div id="kc-registration-terms-text">
<Markdown>{termsMarkdown}</Markdown>
</div>
<div id="kc-registration-terms-text">{msgStr("termsText") ? msg("termsText") : <TermsMarkdown />}</div>
</div>
</div>
<div className="form-group">
@ -121,3 +111,13 @@ function TermsAcceptance(props: { i18n: I18n; kcClsx: KcClsx; messagesPerField:
</>
);
}
function TermsMarkdown() {
const { isDownloadComplete, termsMarkdown, ReactMarkdown } = useTermsMarkdown();
if (!isDownloadComplete) {
return null;
}
return <ReactMarkdown>{termsMarkdown}</ReactMarkdown>;
}

23
src/login/pages/Terms.tsx
View File

@ -1,4 +1,3 @@
import { Markdown } from "keycloakify/tools/Markdown";
import { getKcClsx } from "keycloakify/login/lib/kcClsx";
import { useTermsMarkdown } from "keycloakify/login/lib/useDownloadTerms";
import type { PageProps } from "keycloakify/login/pages/PageProps";
@ -15,13 +14,7 @@ export default function Terms(props: PageProps<Extract<KcContext, { pageId: "ter
const { msg, msgStr } = i18n;
const { locale, url } = kcContext;
const { isDownloadComplete, termsMarkdown, termsLanguageTag } = useTermsMarkdown();
if (!isDownloadComplete) {
return null;
}
const { url } = kcContext;
return (
<Template
@ -32,9 +25,7 @@ export default function Terms(props: PageProps<Extract<KcContext, { pageId: "ter
displayMessage={false}
headerNode={msg("termsTitle")}
>
<div id="kc-terms-text" lang={termsLanguageTag !== locale?.currentLanguageTag ? termsLanguageTag : undefined}>
<Markdown>{termsMarkdown}</Markdown>
</div>
<div id="kc-terms-text">{msgStr("termsText") ? msg("termsText") : <TermsMarkdown />}</div>
<form className="form-actions" action={url.loginAction} method="POST">
<input
className={kcClsx("kcButtonClass", "kcButtonClass", "kcButtonClass", "kcButtonPrimaryClass", "kcButtonLargeClass")}
@ -55,3 +46,13 @@ export default function Terms(props: PageProps<Extract<KcContext, { pageId: "ter
</Template>
);
}
function TermsMarkdown() {
const { isDownloadComplete, termsMarkdown, ReactMarkdown } = useTermsMarkdown();
if (!isDownloadComplete) {
return null;
}
return <ReactMarkdown>{termsMarkdown}</ReactMarkdown>;
}