Skip to content

Instantly share code, notes, and snippets.

@codefactor
Last active February 6, 2023 20:55
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save codefactor/7fb0c13816b49555f6e9b2a2c23b78fd to your computer and use it in GitHub Desktop.
Save codefactor/7fb0c13816b49555f6e9b2a2c23b78fd to your computer and use it in GitHub Desktop.
An updated version of withJsonFormsCellProps that adds a translated error message
import {
CellProps, ControlElement,
getCombinedErrorMessage,
getErrorAt,
getErrorTranslator,
getSchema,
getTranslator,
JsonFormsState,
OwnPropsOfCell,
Resolve
} from "@jsonforms/core";
import {
ctxDispatchToControlProps,
ctxToCellProps,
ctxToDispatchCellProps,
ctxToEnumCellProps,
ctxToOneOfEnumCellProps,
JsonFormsStateContext,
withJsonFormsContext
} from "@jsonforms/react";
import React, { ComponentType } from "react";
/**
* Get the translated error message for a cell.
*
* An enhanced version of withJsonFormsCellProps which translates the errors string for display within a cell
* which is necessary due to the following issue:
* @see https://github.com/eclipsesource/jsonforms/issues/2090
*/
export function withJsonFormsCellPropsWithI18nError(Component: ComponentType<CellProps>, memoize = true): ComponentType<OwnPropsOfCell> {
return withJsonFormsPropsWithI18nError(Component, ctxToCellProps, memoize);
}
export function withJsonFormsDispatchCellPropsWithI18nError(Component: ComponentType<CellProps>, memoize = true): ComponentType<OwnPropsOfCell> {
return withJsonFormsPropsWithI18nError(Component, ctxToDispatchCellProps, memoize);
}
export function withJsonFormsEnumCellPropsWithI18nError(Component: ComponentType<CellProps>, memoize = true): ComponentType<OwnPropsOfCell> {
return withJsonFormsPropsWithI18nError(Component, ctxToEnumCellProps, memoize);
}
export function withJsonFormsOneOfEnumCellPropsWithI18nError(Component: ComponentType<CellProps>, memoize = true): ComponentType<OwnPropsOfCell> {
return withJsonFormsPropsWithI18nError(Component, ctxToOneOfEnumCellProps, memoize);
}
interface CtxToProps {
(ctx: JsonFormsStateContext, props: any): any
}
function withJsonFormsPropsWithI18nError(Component: ComponentType<CellProps>, ctxToProps: CtxToProps, memoize = true) {
return withJsonFormsContext(withContextToPropsWithI18nError(memoize ? React.memo(Component) : Component, ctxToProps));
}
function withContextToPropsWithI18nError(Component: ComponentType<any>, ctxToProps: CtxToProps): ComponentType<any> {
return function WrapperComponent({ ctx, props }) {
const cellProps = ctxToProps(ctx, props);
const dispatchProps = ctxDispatchToControlProps(ctx.dispatch as React.Dispatch<unknown>);
return (
<Component {...props} {...dispatchProps} {...cellProps} errors={getErrorMessage(ctx, props)} />
);
};
}
function getErrorMessage(ctx: JsonFormsStateContext, ownProps: OwnPropsOfCell): string {
const { uischema, path } = ownProps;
const controlElement = uischema as ControlElement;
const state: JsonFormsState = { jsonforms: { ...ctx } };
const rootSchema = getSchema(state);
const resolvedSchema = Resolve.schema(ownProps.schema || rootSchema, controlElement.scope, rootSchema);
const schema = resolvedSchema ?? rootSchema;
const errors = getErrorAt(path as string, resolvedSchema)(state);
const t = getTranslator()(state);
const te = getErrorTranslator()(state);
return getCombinedErrorMessage(errors, te, t, schema, uischema, path);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment