scaffolder: Fix GitLab repo picker in case workspace is nested subgroup

Signed-off-by: Tuan Anh Tran <me@tuananh.org>

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

@@ -128,17 +128,19 @@ export const RepoUrlPicker = (props: RepoUrlPickerProps) => {
         return;
       }
 
-      const [encodedHost, encodedWorkspace, encodedRepoName] = [
-        state.host,
-        workspace,
-        state.repoName,
-      ].map(encodeURIComponent);
+      // previously, we were encodeURI for state.host, workspace and state.repoName separately.
+      // That created an issue where GitLab workspace can be nested like groupA/subgroupB
+      // when we encodeURi separately and then join, the URL will be malformed and
+      // resulting in 400 request error from GitLab API
+      const url = encodeURIComponent(
+        [state.host, workspace, state.repoName].join(),
+      );
 
       // user has requested that we use the users credentials
       // so lets grab them using the scmAuthApi and pass through
       // any additional scopes from the ui:options
       const { token } = await scmAuthApi.getCredentials({
-        url: `https://${encodedHost}/${encodedWorkspace}/${encodedRepoName}`,
+        url,
         additionalScope: {
           repoWrite: true,
           customScopes: requestUserCredentials.additionalScopes,