- Introduced `ContextHelpContent` for displaying contextual help with title, description, examples, and guidance. - Created `DialogHelp` component to manage help dialogs, including popover and panel presentations. - Implemented `useDialogHelpLayout` hook for handling dialog layout and state management. - Added context for dialog help management with `DialogHelpContext` and `DialogHelpLabelsContext`. - Developed utility functions for determining dialog help presentation modes. - Included tests for dialog help functionality and layout behavior. - Created a Python script for auditing contextual help in real forms.
32 lines
683 B
TypeScript
32 lines
683 B
TypeScript
import { FormDialog } from "@repo/rdx-ui/components/form-dialog";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
import type { AccessKind } from "../../../../common";
|
|
|
|
import { EntityHelp } from "./entity-help";
|
|
|
|
export function AccessHelpDialog({
|
|
kind,
|
|
scope,
|
|
open,
|
|
onOpenChange,
|
|
}: {
|
|
kind: AccessKind;
|
|
scope: string;
|
|
open: boolean;
|
|
onOpenChange: (open: boolean) => void;
|
|
}) {
|
|
const { t } = useTranslation("access");
|
|
|
|
return (
|
|
<FormDialog
|
|
cancelLabel={t("helpClose")}
|
|
onOpenChange={onOpenChange}
|
|
open={open}
|
|
title={t(`kinds.${kind}`)}
|
|
>
|
|
<EntityHelp kind={kind} placement="inline" scope={scope} />
|
|
</FormDialog>
|
|
);
|
|
}
|