gcg/static-cms
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix: properly update duplicated and none i18n fields when default locale updates (#934)

Browse Source
This commit is contained in:
Daniel Lautzenheiser 2023-10-11 16:25:01 -04:00 committed by GitHub
parent a508158f59
commit 7b9d653411
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 29 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
packages/core/src/components/entry-editor/editor-control-pane/EditorControl.tsx
View File

@ -105,13 +105,15 @@ const EditorControl = ({
[field, i18n?.defaultLocale, parentDuplicate, locale],
);
const i18nDisabled = useMemo(
() => isFieldHidden(field, locale, i18n?.defaultLocale),
() =>
isFieldHidden(field, locale, i18n?.defaultLocale) ||
isFieldDuplicate(field, locale, i18n?.defaultLocale),
[field, i18n?.defaultLocale, locale],
);
const hidden = useHidden(field, entry, listItemPath);
useEffect(() => {
if (!['list', 'object'].includes(field.widget)) {
if (!['list', 'object'].includes(field.widget) && !i18nDisabled) {
return;
}
@ -220,7 +222,7 @@ const EditorControl = ({
field: field as UnknownField,
fieldsErrors,
submitted,
disabled: disabled || duplicate || hidden || i18nDisabled,
disabled: disabled || duplicate || controlled || i18nDisabled,
duplicate,
label: getFieldLabel(field, t),
locale,
@ -237,7 +239,7 @@ const EditorControl = ({
hasErrors,
errors,
theme,
controlled,
controlled: controlled || i18nDisabled,
})}
</div>
);

22
packages/core/src/widgets/string/StringControl.tsx
View File

@ -1,8 +1,7 @@
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import React, { useCallback, useMemo, useRef, useState } from 'react';
import Field from '@staticcms/core/components/common/field/Field';
import TextField from '@staticcms/core/components/common/text-field/TextField';
import useDebounce from '@staticcms/core/lib/hooks/useDebounce';
import classNames from '@staticcms/core/lib/util/classNames.util';
import { generateClassNames } from '@staticcms/core/lib/util/theming.util';
@ -36,21 +35,16 @@ const StringControl: FC<WidgetControlProps<string, StringOrTextField>> = ({
() => (controlled || duplicate ? rawValue : internalRawValue),
[controlled, duplicate, rawValue, internalRawValue],
);
const debouncedInternalValue = useDebounce(internalValue, 250);
const ref = useRef<HTMLInputElement | null>(null);
const handleChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {
setInternalValue(event.target.value);
}, []);
useEffect(() => {
if (rawValue === debouncedInternalValue) {
return;
}
onChange(debouncedInternalValue);
}, [debouncedInternalValue, onChange, rawValue]);
const handleChange = useCallback(
(event: ChangeEvent<HTMLInputElement>) => {
onChange(event.target.value);
setInternalValue(event.target.value);
},
[onChange],
);
return (
<Field

4
packages/core/src/widgets/string/__tests__/StringControl.spec.ts
View File

@ -66,10 +66,8 @@ describe(StringControl.name, () => {
await userEvent.type(input, 'I am some text');
});
expect(onChange).toHaveBeenCalledTimes(0);
await waitFor(() => {
expect(onChange).toHaveBeenCalledTimes(1);
expect(onChange).toHaveBeenCalledTimes(14);
expect(onChange).toHaveBeenLastCalledWith('I am some text');
});
});

27
packages/core/src/widgets/text/TextControl.tsx
View File

@ -1,8 +1,7 @@
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
import React, { useCallback, useMemo, useRef, useState } from 'react';
import Field from '@staticcms/core/components/common/field/Field';
import TextArea from '@staticcms/core/components/common/text-field/TextArea';
import useDebounce from '@staticcms/core/lib/hooks/useDebounce';
import classNames from '@staticcms/core/lib/util/classNames.util';
import { generateClassNames } from '@staticcms/core/lib/util/theming.util';
@ -27,29 +26,25 @@ const TextControl: FC<WidgetControlProps<string, StringOrTextField>> = ({
disabled,
field,
forSingleList,
controlled,
onChange,
}) => {
const rawValue = useMemo(() => value ?? '', [value]);
const [internalRawValue, setInternalValue] = useState(rawValue);
const internalValue = useMemo(
() => (duplicate ? rawValue : internalRawValue),
[internalRawValue, duplicate, rawValue],
() => (controlled || duplicate ? rawValue : internalRawValue),
[controlled, duplicate, rawValue, internalRawValue],
);
const debouncedInternalValue = useDebounce(internalValue, 250);
const ref = useRef<HTMLInputElement | null>(null);
const handleChange = useCallback((event: ChangeEvent<HTMLInputElement>) => {
setInternalValue(event.target.value);
}, []);
useEffect(() => {
if (rawValue === debouncedInternalValue) {
return;
}
onChange(debouncedInternalValue);
}, [debouncedInternalValue, onChange, rawValue]);
const handleChange = useCallback(
(event: ChangeEvent<HTMLInputElement>) => {
onChange(event.target.value);
setInternalValue(event.target.value);
},
[onChange],
);
return (
<Field

10
packages/core/src/widgets/text/__tests__/TextControl.spec.ts
View File

@ -2,8 +2,8 @@
* @jest-environment jsdom
*/
import '@testing-library/jest-dom';
import { act } from '@testing-library/react';
import userEvent from '@testing-library/user-event';
import { act, waitFor } from '@testing-library/react';
import { mockTextField } from '@staticcms/test/data/fields.mock';
import { createWidgetControlHarness } from '@staticcms/test/harnesses/widget.harness';
@ -66,12 +66,8 @@ describe(TextControl.name, () => {
await userEvent.type(input, 'I am some text');
});
expect(onChange).toHaveBeenCalledTimes(0);
await waitFor(() => {
expect(onChange).toHaveBeenCalledTimes(1);
expect(onChange).toHaveBeenLastCalledWith('I am some text');
});
expect(onChange).toHaveBeenCalledTimes(14);
expect(onChange).toHaveBeenLastCalledWith('I am some text');
});
it('should show error', async () => {