Clear autocomplete input on selection accept

Fixes element-hq/element-web#27194

src/components/structures/AutocompleteInput.tsx

@@ -99,6 +99,8 @@ export const AutocompleteInput: React.FC<AutocompleteInputProps> = ({
 
         onSelectionChange(newSelection);
         focusEditor();
+        setQuery("");
+        setSuggestions([]);
     };
 
     const removeSelection = (completion: ICompletion): void => {

test/components/structures/AutocompleteInput-test.tsx

@@ -246,6 +246,36 @@ describe("AutocompleteInput", () => {
         expect(onSelectionChangeMock).toHaveBeenCalledWith([mockCompletion[0]]);
     });
 
+    it("should clear text field and suggestions when a suggestion is accepted", async () => {
+        const mockProvider = constructMockProvider(mockCompletion);
+        const onSelectionChangeMock = jest.fn();
+
+        const { container } = render(
+            <AutocompleteInput
+                provider={mockProvider}
+                placeholder="Search ..."
+                selection={[]}
+                onSelectionChange={onSelectionChangeMock}
+            />,
+        );
+
+        const input = getEditorInput();
+
+        act(() => {
+            fireEvent.focus(input);
+            fireEvent.change(input, { target: { value: "user" } });
+        });
+
+        const suggestions = await within(container).findAllByTestId("autocomplete-suggestion-item", { exact: false });
+
+        act(() => {
+            fireEvent.mouseDown(suggestions[0]);
+        });
+
+        expect(input).toHaveValue("");
+        expect(within(container).queryAllByTestId("autocomplete-suggestion-item", { exact: false })).toHaveLength(0);
+    });
+
     afterAll(() => {
         jest.clearAllMocks();
         jest.resetModules();