Enabled save button only when link is changed

Author: florianduros

src/components/views/rooms/wysiwyg_composer/components/LinkModal.tsx

@@ -58,8 +58,9 @@ interface LinkModalProps {
 }
 
 export function LinkModal({ composer, isTextEnabled, onClose, composerContext, isEditing }: LinkModalProps) {
+    const [hasLinkChanged, setHasLinkChanged] = useState(false);
     const [fields, setFields] = useState({ text: "", link: isEditing ? composer.getLink() : "" });
-    const isSaveDisabled = (isTextEnabled && isEmpty(fields.text)) || isEmpty(fields.link);
+    const isSaveDisabled = !hasLinkChanged && ((isTextEnabled && isEmpty(fields.text)) || isEmpty(fields.link));
 
     return (
         <BaseDialog
@@ -97,9 +98,10 @@ export function LinkModal({ composer, isTextEnabled, onClose, composerContext, i
                     label={_td("Link")}
                     value={fields.link}
                     placeholder=""
-                    onChange={(e: ChangeEvent<HTMLInputElement>) =>
-                        setFields((fields) => ({ ...fields, link: e.target.value }))
-                    }
+                    onChange={(e: ChangeEvent<HTMLInputElement>) => {
+                        setHasLinkChanged(true);
+                        setFields((fields) => ({ ...fields, link: e.target.value }));
+                    }}
                 />
 
                 <div className="mx_LinkModal_buttons">

test/components/views/rooms/wysiwyg_composer/components/LinkModal-test.tsx

@@ -152,5 +152,12 @@ describe("LinkModal", () => {
 
         // Then
         expect(screen.getByLabelText("Link")).toContainHTML("my initial content");
+        expect(screen.getByText("Save")).toBeDisabled();
+
+        // When
+        await userEvent.type(screen.getByLabelText("Link"), "l");
+
+        // Then
+        await waitFor(() => expect(screen.getByText("Save")).toBeEnabled());
     });
 });