chore: add additional test for add language section

web/src/components/add-language-section.test.tsx

@@ -17,7 +17,7 @@ beforeEach(() => {
   jest.resetAllMocks();
   jest.spyOn(redux, 'useDispatch');
   jest.spyOn(redux, 'useSelector');
-  
+
   (redux.useDispatch as jest.Mock).mockImplementation(() => dispatchMock);
   (redux.useSelector as jest.Mock).mockImplementation(() => ({
     allLanguages,
@@ -65,3 +65,18 @@ test('should add language and set button to disabled', async () => {
 
   expect((screen.getByRole('button') as HTMLButtonElement).disabled).toBeTruthy();
 });
+
+test('should show error when language can not be added', async () => {
+  dispatchMock.mockRejectedValue(new Error('oh no'));
+
+  act(() => { render(<AddLanguageSection />); });
+  fireEvent.change(screen.getByRole('combobox'), { target: { value: 'en' } });
+  expect((screen.getByRole('button') as HTMLButtonElement).disabled).toBe(false);
+
+  await act(async () => {
+    await userEvent.click(screen.getByRole('button'));
+    expect(dispatchMock).toHaveBeenCalled();
+  });
+
+  expect(screen.queryByText(/Could not add language/)).toBeTruthy();
+});

web/src/components/add-language-section.tsx

@@ -23,10 +23,6 @@ export default function AddLanguage() {
     setError('');
 
     try {
-      if (!language) {
-        throw new Error('Please select a language');
-      }
-
       await dispatch(addLanguage(language));
     } catch (error) {
       setError(`Could not add language: ${error.message}`);
@@ -37,7 +33,7 @@ export default function AddLanguage() {
 
   return (
     <section>
-      { error && ( <p className="error-message">{error}</p> ) }
+      {error && (<p className="error-message">{error}</p>)}
 
       <LanguageSelector
         selected={language}
@@ -48,7 +44,7 @@ export default function AddLanguage() {
         onChange={onLanguageSelect}
       />
       <button disabled={!!pendingLanguages || !language}
-              onClick={onLanguageAdd} className="add-language">Add Language</button>
+        onClick={onLanguageAdd} className="add-language">Add Language</button>
     </section>
   );
 }