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

Remove useDownloadTerms see: https://docs.keycloakify.dev/terms-and-conditions, remove react-markdown

Browse Source
This commit is contained in:
Joseph Garrone
2024-06-22 02:53:30 +02:00
parent 7d42ce1c87
commit 454a9cd01c
9 changed files with 4 additions and 802 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/login/index.ts
View File

@ -1,4 +1,3 @@
export type { ExtendKcContext, Attribute } from "keycloakify/login/KcContext";
export type { ClassKey } from "keycloakify/login/TemplateProps";
export { useDownloadTerms } from "keycloakify/login/lib/useDownloadTerms";
export { createUseI18n } from "keycloakify/login/i18n";

88
src/login/lib/useDownloadTerms.tsx
View File

@ -1,88 +0,0 @@
import { useState, useEffect } from "react";
import { fallbackLanguageTag } from "keycloakify/login/i18n";
import { assert } from "tsafe/assert";
import { createStatefulObservable, useRerenderOnChange } from "keycloakify/tools/StatefulObservable";
import { useOnFistMount } from "keycloakify/tools/useOnFirstMount";
import { KcContext } from "../KcContext";
import type { Options as ReactMarkdownOptions } from "../../tools/react-markdown";
const obs = createStatefulObservable<
| {
ReactMarkdown: (props: Readonly<ReactMarkdownOptions>) => JSX.Element;
termsMarkdown: string;
}
| undefined
>(() => undefined);
export type KcContextLike_useDownloadTerms = {
pageId: string;
locale?: {
currentLanguageTag: string;
};
termsAcceptanceRequired?: boolean;
};
assert<KcContext extends KcContextLike_useDownloadTerms ? true : false>();
/** Allow to avoid bundling the terms and download it on demand*/
export function useDownloadTerms(params: {
kcContext: KcContextLike_useDownloadTerms;
downloadTermsMarkdown: (params: { currentLanguageTag: string }) => Promise<{ termsMarkdown: string; termsLanguageTag: string | undefined }>;
}) {
const { kcContext, downloadTermsMarkdown } = params;
useOnFistMount(async () => {
if (kcContext.pageId === "terms.ftl" || kcContext.termsAcceptanceRequired) {
const currentLanguageTag = kcContext.locale?.currentLanguageTag ?? fallbackLanguageTag;
const [ReactMarkdown_base, { termsMarkdown, termsLanguageTag }] = await Promise.all([
import("../../tools/react-markdown").then(_ => _.default),
downloadTermsMarkdown({ currentLanguageTag })
] as const);
const htmlLang = termsLanguageTag !== currentLanguageTag ? termsLanguageTag : undefined;
const ReactMarkdown: (props: Readonly<ReactMarkdownOptions>) => JSX.Element =
htmlLang === undefined
? ReactMarkdown_base
: props => {
const [anchor, setAnchor] = useState<HTMLDivElement | null>(null);
useEffect(() => {
if (anchor === null) {
return;
}
const parent = anchor.parentElement;
assert(parent !== null);
parent.setAttribute("lang", htmlLang);
anchor.remove();
}, [anchor]);
return (
<>
<ReactMarkdown_base {...props} />
<div ref={setAnchor} style={{ display: "none" }} aria-hidden />
</>
);
};
obs.current = { ReactMarkdown, termsMarkdown };
}
});
}
export function useTermsMarkdown() {
useRerenderOnChange(obs);
if (obs.current === undefined) {
return { isDownloadComplete: false as const };
}
const { ReactMarkdown, termsMarkdown } = obs.current;
return { isDownloadComplete: true, ReactMarkdown, termsMarkdown };
}

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

@ -1,6 +1,5 @@
import { useState } from "react";
import type { LazyOrNot } from "keycloakify/tools/LazyOrNot";
import { useTermsMarkdown } from "keycloakify/login/lib/useDownloadTerms";
import { getKcClsx, type KcClsx } from "keycloakify/login/lib/kcClsx";
import type { UserProfileFormFieldsProps } from "keycloakify/login/UserProfileFormFieldsProps";
import type { PageProps } from "keycloakify/login/pages/PageProps";
@ -77,14 +76,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, msgStr } = i18n;
const { msg } = i18n;
return (
<>
<div className="form-group">
<div className={kcClsx("kcInputWrapperClass")}>
{msg("termsTitle")}
<div id="kc-registration-terms-text">{msgStr("termsText") ? msg("termsText") : <TermsMarkdown />}</div>
<div id="kc-registration-terms-text">{msg("termsText")}</div>
</div>
</div>
<div className="form-group">
@ -111,13 +110,3 @@ function TermsAcceptance(props: { i18n: I18n; kcClsx: KcClsx; messagesPerField:
</>
);
}
function TermsMarkdown() {
const { isDownloadComplete, termsMarkdown, ReactMarkdown } = useTermsMarkdown();
if (!isDownloadComplete) {
return null;
}
return <ReactMarkdown>{termsMarkdown}</ReactMarkdown>;
}

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

@ -1,5 +1,4 @@
import { getKcClsx } from "keycloakify/login/lib/kcClsx";
import { useTermsMarkdown } from "keycloakify/login/lib/useDownloadTerms";
import type { PageProps } from "keycloakify/login/pages/PageProps";
import type { KcContext } from "../KcContext";
import type { I18n } from "../i18n";
@ -25,7 +24,7 @@ export default function Terms(props: PageProps<Extract<KcContext, { pageId: "ter
displayMessage={false}
headerNode={msg("termsTitle")}
>
<div id="kc-terms-text">{msgStr("termsText") ? msg("termsText") : <TermsMarkdown />}</div>
<div id="kc-terms-text">{msg("termsText")}</div>
<form className="form-actions" action={url.loginAction} method="POST">
<input
className={kcClsx("kcButtonClass", "kcButtonClass", "kcButtonClass", "kcButtonPrimaryClass", "kcButtonLargeClass")}
@ -46,13 +45,3 @@ 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>;
}