Skip to content

i18N Is not working #5

@DIBYAJYOTINANDA

Description

@DIBYAJYOTINANDA
Hi Team, i have followed your code and try to replicate the i18N part in my own app and the code is not working as well as i checked i18n in your app is also not working
my app  

npx create-react-app my-app --template @ui5/cra-template-webcomponents-react

Index.js
------------------
//i18n setup code
import '@ui5/webcomponents/dist/Assets';
import '@ui5/webcomponents-fiori/dist/Assets';
import '@ui5/webcomponents-react/dist/Assets';
import { registerI18nLoader} from "@ui5/webcomponents-base/dist/i18nBundle.js";
import parseProperties from "@ui5/webcomponents-base/dist/PropertiesFileFormat.js";


const supportedLocales = ["en", "fr", "de", "es"];
supportedLocales.forEach(localeToRegister => {
	registerI18nLoader("myApp", localeToRegister, async (localeId) => {
		const props = await (await fetch(`./i18n/i18n_${localeId}.properties`)).text();
		return parseProperties(props);
	});
});

//i18n setup code end

Home.js
-------------------

import { useI18nBundle, spacing } from "@ui5/webcomponents-react-base";
const Home = (props) => {
 
  const i18nBundle = useI18nBundle("myApp");
  const EMP_BTN_TXT = i18nBundle.getText("tst");  // output is `tst`

return (
    <Fragment>
      <FlexBox
        justifyContent={FlexBoxJustifyContent.Center}
        wrap={FlexBoxWrap.Wrap}
        style={spacing.sapUiContentPadding}
      >
        <Button icon="employee" onClick={handleOnClick}>
          {EMP_BTN_TXT}
        </Button>
      </FlexBox>
    </Fragment>
  );
};

i18n
------
tst=Employee

please help

Regards,
Dibyajyoti Nanda

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions