AWS Amplify Internationalization does not update inside useEffect hook

Question

I am trying to load a language translation from backend api in AWS Amplify UI. When i try to pass the custom translations using I18n.putVocabularies it does not reflect changes. I need to navigate to other aws amplify page then go back again e.x. Sign In page to be able to see the changes.

    import { I18n } from "aws-amplify/utils";
    
    useEffect(() => {
        if (status === "success") {
            const languages = {...data} // translations from backend api
            I18n.setLanguage("th");
            I18n.putVocabularies(languages);
        } 
    }, [status]);