You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

functions.js 1.2KB

123456789101112131415161718192021222324252627282930313233
  1. import React from 'react';
  2. import { translate as reactI18nextTranslate } from 'react-i18next';
  3. /**
  4. * Wraps a specific React Component in order to enable translations in it.
  5. *
  6. * @param {Component} component - The React Component to wrap.
  7. * @param {Object} options - Additional options to pass into react-i18next's
  8. * initialization.
  9. * @returns {Component} The React Component which wraps {@link component} and
  10. * enables translations in it.
  11. */
  12. export function translate(component, options = { wait: true }) {
  13. // Use the default list of namespaces.
  14. return (
  15. reactI18nextTranslate([ 'main', 'languages', 'countries' ], options)(
  16. component));
  17. }
  18. /**
  19. * Translates a specific key to text containing HTML via a specific translate
  20. * function.
  21. *
  22. * @param {Function} t - The translate function.
  23. * @param {string} key - The key to translate.
  24. * @param {Array<*>} options - The options, if any, to pass to {@link t}.
  25. * @returns {ReactElement} A ReactElement which depicts the translated HTML
  26. * text.
  27. */
  28. export function translateToHTML(t, key, options = {}) {
  29. // eslint-disable-next-line react/no-danger
  30. return <span dangerouslySetInnerHTML = {{ __html: t(key, options) }} />;
  31. }