diff --git a/chrome/content/zotero/components/createParent/createParent.jsx b/chrome/content/zotero/components/createParent/createParent.jsx index 34460a406c..7e86611bce 100644 --- a/chrome/content/zotero/components/createParent/createParent.jsx +++ b/chrome/content/zotero/components/createParent/createParent.jsx @@ -25,14 +25,20 @@ 'use strict'; -import React, { memo, useEffect } from 'react'; +import React, { memo, useEffect, useRef } from 'react'; import PropTypes from 'prop-types'; import cx from 'classnames'; function CreateParent({ loading, item, toggleAccept }) { // With React 18, this is required for the window's dialog to be properly sized + const ref = useRef(); useEffect(() => { - window.sizeToContent(); + // Wait for Fluent to inject translated strings before resizing the dialog (fixes #5365). + const observer = new MutationObserver(() => window.sizeToContent()); + observer.observe(ref.current, { childList: true, subtree: true }); + return () => { + observer.disconnect(); + }; }, []); // When the input has/does not have characters toggle the accept button on the dialog @@ -46,7 +52,7 @@ function CreateParent({ loading, item, toggleAccept }) { }; return ( -