Skip to content

Commit 52afe7c

Browse files
committed
fix(TDOPS-4851): No copied message when switching back
1 parent ee74810 commit 52afe7c

File tree

2 files changed

+25
-4
lines changed

2 files changed

+25
-4
lines changed
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
'@talend/design-system': minor
3+
---
4+
5+
Form.Copy - Fix no copied message after switching back

packages/design-system/src/components/Form/Field/Input/Input.Copy.tsx

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -31,30 +31,46 @@ const InputCopy = forwardRef(
3131
ref: Ref<HTMLInputElement | null>,
3232
) => {
3333
const [copiedValue, setCopiedValue] = useState('');
34+
const [changedTime, setChangedTime] = useState<number | null | undefined>(null);
3435
const [copyError, setCopyError] = useState<Error | undefined | null>(null);
3536
const [{ value: clipboardValue, error: clipboardError }, copyToClipboard] =
3637
useCopyToClipboard();
3738
const inputRef = useRef<HTMLInputElement | null>(null);
3839
const { t } = useTranslation(I18N_DOMAIN_DESIGN_SYSTEM);
3940
const inputValue = value || defaultValue;
4041

42+
const updateChangeTime = (update: boolean) => {
43+
setChangedTime(update ? Date.now() : null);
44+
};
45+
useEffect(() => {
46+
if (inputValue) {
47+
updateChangeTime(true);
48+
}
49+
}, [inputValue]);
4150
useEffect(() => {
4251
if (inputValue !== copiedValue) {
4352
setCopiedValue('');
4453
setCopyError(null);
54+
updateChangeTime(false);
4555
}
4656
}, [inputValue, copiedValue]);
4757

4858
useEffect(() => {
49-
setCopiedValue(clipboardValue as string);
50-
}, [clipboardValue]);
59+
if (changedTime && copiedValue !== inputValue) {
60+
setCopiedValue(clipboardValue as string);
61+
updateChangeTime(false);
62+
}
63+
}, [clipboardValue, changedTime]);
5164

5265
useEffect(() => {
5366
setCopyError(clipboardError);
5467
}, [clipboardError]);
5568

5669
useImperativeHandle(ref, () => inputRef.current);
57-
70+
const doCopy = () => {
71+
copyToClipboard(inputRef.current?.value || '');
72+
updateChangeTime(true);
73+
};
5874
const getDescriptionMessage = () => {
5975
if (copyError) {
6076
return copyError.message;
@@ -83,7 +99,7 @@ const InputCopy = forwardRef(
8399
suffix={{
84100
type: 'button',
85101
icon: 'talend-files-o',
86-
onClick: () => copyToClipboard(inputRef.current?.value || ''),
102+
onClick: () => doCopy(),
87103
disabled: !!disabled || !!readOnly,
88104
children: t('FORM_COPY_COPY_TO_CLIPBOARD', 'Copy to clipboard'),
89105
hideText: true,

0 commit comments

Comments
 (0)