fix(additional-links): show multilingual name fallback and literal badge - #2302
fix(additional-links): show multilingual name fallback and literal badge#2302AbhishekPAnil wants to merge 1 commit into
Conversation
|
This pull request is automatically being deployed by Amplify Hosting (learn more). |
There was a problem hiding this comment.
Pull request overview
This PR improves multilingual “additional links” handling across editable forms (including Form.List) and read-only views by fixing how fallback values and field paths are computed and applied, and by filtering unedited fallback literals from outgoing payloads.
Changes:
- Added “absolute name path” support (
namePrefix) for imperative Ant Design form APIs withinForm.Listcontexts. - Improved fallback value injection so empty/untouched list fields receive the correct fallback after mount/initialization.
- Filtered out unedited fallback literal values for additional-links
nameduring payload construction and avoided read-only fallback collisions by makingfieldNameunique per link.
Reviewed changes
Copilot reviewed 7 out of 7 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| src/utils/formPayloadHandler.js | Filters unedited fallback literal values from additional-links name before submitting payload. |
| src/pages/Dashboard/PersonReadOnly/PersonReadOnly.jsx | Makes additional-link read-only fallback fieldName unique per row to prevent collisions. |
| src/pages/Dashboard/OrganizationsReadOnly/OrganizationsReadOnly.jsx | Makes additional-link read-only fallback fieldName unique per row to prevent collisions. |
| src/layout/CreateMultiLingualFormItems/CreateMultiLingualFormItems.jsx | Separates relative vs absolute field paths; uses absolute paths for imperative calls and watchers; forwards namePrefix. |
| src/hooks/useChildrenWithLanguageFallback.js | Adds absolute-path handling for list contexts and injects fallback values imperatively for list items. |
| src/components/MultilingualInput/MultilingualInput.jsx | Ensures label/fallback detection reads the correct absolute field value in Form.List contexts via namePrefix. |
| src/components/AdditonalLinks/AdditionalLinks.jsx | Passes namePrefix and filters initial multilingual name data to non-empty values for more robust initialization/rendering. |
Suppressed comments (2)
src/hooks/useChildrenWithLanguageFallback.js:101
- This effect updates redux activeFallbackFieldsInfo using combinedName, calendarContentLanguage, isFieldsDirty, and the previous activeFallbackFieldsInfo, but only re-runs when fallbackStatus changes. That can leave the store out of sync if any of those referenced values change without a fallbackStatus change.
// eslint-disable-next-line no-unused-vars
const { [combinedName]: _, ...rest } = activeFallbackFieldsInfo;
dispatch(setActiveFallbackFieldsInfo({ data: rest, method: 'remove' }));
}
}, [fallbackStatus]);
src/hooks/useChildrenWithLanguageFallback.js:120
- The imperative fallback injection effect uses children, form, namePrefix, and toAbsolutePath, but its dependency array only includes fallbackStatus. If children/namePrefix/form changes (common when Form.List items are added/removed), the effect may not inject fallback values for the new fields.
if ((currentValue === undefined || currentValue === '') && !form.isFieldTouched(absolutePath)) {
form.setFieldValue(absolutePath, fallbackValue);
}
});
}, [fallbackStatus]);
💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.
| form.setFieldValue(absolutePath(lanKey), value); | ||
| } | ||
| }); | ||
| }, [data]); |
| children?.map((child) => { | ||
| const name = child?.props?.name; | ||
| if (Array.isArray(name)) { | ||
| const langKey = name?.length > 1 && name[1]; | ||
| const langKey = name?.length > 1 && name[name.length - 1]; | ||
| if (langKey) { | ||
| currentActiveDataInFormFields[langKey] = form.getFieldValue(name); | ||
| currentActiveDataInFormFields[langKey] = form.getFieldValue(toAbsolutePath(name)); |
This pull request improves the handling of multi-lingual additional links, especially when used inside dynamic form lists. The changes ensure that language fallback values are correctly injected, initial values are handled robustly, and form field names are managed accurately both for rendering and for imperative form API calls. These updates address subtle bugs in fallback value injection and ensure consistency in how multi-lingual fields are managed in both editable and read-only contexts.
Multi-lingual Additional Links Improvements:
Added logic to compute and pass absolute field names (
namePrefix) to multi-lingual form components, ensuring that imperative form API calls (likegetFieldValue,setFieldValue, andisFieldTouched) work correctly insideForm.Listcontexts. This affectsCreateMultiLingualFormItems,MultilingualInput, anduseChildrenWithLanguageFallback. [1] [2] [3] [4] [5] [6]Improved fallback value injection for multi-lingual fields inside
Form.Listby imperatively setting fallback values only when the field is empty and untouched, ensuring that users see the correct default/fallback values even if initial values are loaded after mount.Refactored how field names and paths are constructed and used throughout the multi-lingual form logic, distinguishing between relative and absolute paths for rendering and imperative API calls, and ensuring accurate field state tracking (dirty, touched, etc.). [1] [2] [3]
Read-only Page Adjustments:
fieldNameprop forFallbackInjectorForReadOnlyPagesin bothOrganizationsReadOnlyandPersonReadOnlyto be unique per link, preventing key collisions and ensuring correct fallback injection in read-only views. [1] [2]Payload Handling:
namefield, using the correct field naming scheme and initial values, ensuring only user-edited values are submitted. [1] [2]Initial Data Handling: