Dynamic Translation

main.ts

/**
 * Renders a translation that cannot be extracted statically.
 * Avoid using this component as much as possible!
 */
export class TransMsgDynamic extends React.Component<{
	keyAndDefaultTranslation: string;
	/**
	 * A static id that represents the pool of all possible keys.
	 * If this id is not used in the code base anymore,
	 * all keys associated with this id can be removed.
	 */
	keyPoolId: string;
	data?: I18nData;
}> {
	render() {
		const { keyAndDefaultTranslation, data } = this.props;
		const doc = parseGemlMarkupString(keyAndDefaultTranslation);
		return <>{evaluateGemlMarkupStringToReact(doc, data || {})}</>;
	}
}

/**
 * Translates text that cannot be extracted statically.
 * Avoid using this component as much as possible!
 */
export function transStrDynamic(
	keyAndDefaultTranslation: string,
	options: {
		/**
		 * A static id that represents the pool of all possible keys.
		 * If this id is not used in the code base anymore,
		 * all keys associated with this id can be removed.
		 */
		keyPoolId: string;
		data?: I18nData;
	}
): string {
	const doc = parseGemlMarkupString(keyAndDefaultTranslation);
	return evaluateGemlMarkupStringToString(doc, options.data || {});
}