Merge pull request #33170 from dbmdz/gitlab-repo-picker-improvements

Gitlab repo picker improvements

.changeset/olive-peaches-fly.md

@@ -0,0 +1,8 @@
+---
+'@backstage/plugin-scaffolder': patch
+---
+
+Fix the display of the description in `GitlabRepoPicker`:
+
+- Move `owner.description` helper text outside the `allowedOwners` conditional so it renders for both `Select` and `Autocomplete` modes.
+- Update the `Autocomplete` label to use `fields.gitlabRepoPicker.owner.inputTitle` instead of `fields.gitlabRepoPicker.owner.title`.

plugins/scaffolder/src/components/fields/RepoUrlPicker/GitlabRepoPicker.test.tsx

@@ -176,5 +176,42 @@ describe('GitlabRepoPicker', () => {
 
       expect(onChange).toHaveBeenCalledWith({ owner: 'my-mock-owner' });
     });
+
+    it('should render description if allowed owners are passed', async () => {
+      const { findByText } = await renderInTestApp(
+        <TestApiProvider apis={[[scaffolderApiRef, scaffolderApiMock]]}>
+          <GitlabRepoPicker
+            onChange={jest.fn()}
+            rawErrors={[]}
+            state={{ repoName: 'repo' }}
+            allowedOwners={['owner1']}
+          />
+        </TestApiProvider>,
+      );
+
+      expect(
+        await findByText(
+          /GitLab namespace where this repository will belong to./,
+        ),
+      ).toBeInTheDocument();
+    });
+
+    it('should render description if no allowed owners are passed', async () => {
+      const { findByText } = await renderInTestApp(
+        <TestApiProvider apis={[[scaffolderApiRef, scaffolderApiMock]]}>
+          <GitlabRepoPicker
+            onChange={jest.fn()}
+            rawErrors={[]}
+            state={{ repoName: 'repo' }}
+          />
+        </TestApiProvider>,
+      );
+
+      expect(
+        await findByText(
+          /GitLab namespace where this repository will belong to./,
+        ),
+      ).toBeInTheDocument();
+    });
   });
 });

plugins/scaffolder/src/components/fields/RepoUrlPicker/GitlabRepoPicker.tsx

@@ -139,9 +139,6 @@ export const GitlabRepoPicker = (
               selected={owner}
               items={ownerItems}
             />
-            <FormHelperText>
-              {t('fields.gitlabRepoPicker.owner.description')}
-            </FormHelperText>
           </>
         ) : (
           <Autocomplete
@@ -153,7 +150,7 @@ export const GitlabRepoPicker = (
             renderInput={params => (
               <TextField
                 {...params}
-                label={t('fields.gitlabRepoPicker.owner.title')}
+                label={t('fields.gitlabRepoPicker.owner.inputTitle')}
                 disabled={isDisabled}
                 required
               />
@@ -163,6 +160,9 @@ export const GitlabRepoPicker = (
             autoSelect
           />
         )}
+        <FormHelperText>
+          {t('fields.gitlabRepoPicker.owner.description')}
+        </FormHelperText>
       </FormControl>
     </>
   );