@keycloakify/keycloak-account-ui/content/ContentComponent.js

<p align="center"> <img src="https://github.com/user-attachments/assets/e31c4910-7205-441c-9a35-e134b806b3a8"> </p> <p align="center"> <i>Repackaged Keycloak Account UI</i> <br> <br> <a href="https://github.com/keycloakify/keycloak-a

import { jsx as _jsx } from "react/jsx-runtime";
import { Spinner } from "@patternfly/react-core";
import { Suspense, lazy, useMemo, useState } from "react";
import { useParams } from "react-router-dom";
import { useEnvironment } from "../ui-shared";
import { joinPath } from "../utils/joinPath";
import { usePromise } from "../utils/usePromise";
import fetchContentJson from "../content/fetchContent";
function findComponent(content, componentId) {
    for (const item of content) {
        if ("path" in item &&
            item.path.endsWith(componentId) &&
            "modulePath" in item) {
            return item.modulePath;
        }
        if ("children" in item) {
            return findComponent(item.children, componentId);
        }
    }
    return undefined;
}
export const ContentComponent = () => {
    const context = useEnvironment();
    const [content, setContent] = useState();
    const { componentId } = useParams();
    usePromise((signal) => fetchContentJson({ signal, context }), setContent);
    const modulePath = useMemo(() => findComponent(content || [], componentId), [content, componentId]);
    return modulePath && _jsx(Component, { modulePath: modulePath });
};
const Component = ({ modulePath }) => {
    const { environment } = useEnvironment();
    const Element = lazy(() => import(joinPath(environment.resourceUrl, modulePath)));
    return (_jsx(Suspense, { fallback: _jsx(Spinner, {}), children: _jsx(Element, {}) }));
};
export default ContentComponent;
//# sourceMappingURL=ContentComponent.js.map