react [BUG] Form does not change language when options change

[BUG] Form does not change language when options change

Open madflow opened this issue 3 years ago • 8 comments

Environment

Please provide as many details as you can:

Hosting type
- [] Form.io
- [x] Local deployment
  - Version: Latest
Formio.js version: Latest
Frontend framework: React
Browser: Firefox latest
Browser version: latest

Steps to Reproduce

Use React and Formio with i18next.
Configure everything something like this:

  const options = {
    i18n: {
      [i18n.language]: i18n.getResourceBundle(i18n.language, 'translation'),
    },
    language: i18n.language,
    hooks: {},
  };

// https://help.form.io/developers/form-renderer#form-renderer-options
  return (
    <>
      <Form
        src={url}
        onSubmitDone={onSubmitDone}
        formReady={onFormReady}
        options={options}
      />
      {isReady ? null : <LoadingSpinner animation="border" />}
    </>
  );

Change the language

Expected behavior

Language changes in the form

Kapture 2021-09-27 at 17 53 35

Observed behavior

Language does not change

Kapture 2021-09-27 at 17 56 29

This can be hack-fixed by amending Form.jsx , https://github.com/formio/react/blob/e9d61b0dc7ec45be966fd57b92c41e9b9f8483ab/src/components/Form.jsx#L62

  useEffect(() => {
    const { src } = props;
    if (src) {
      createWebformInstance(src).then(() => {
        if (formio) {
          formio.src = src;
        }
      });
      initializeFormio();
    }
  }, [props.src, props.options]);