"Create Component from Git" doesn't sanitize the suggested component …

…name redhat-developer#3294 Fixes: redhat-developer#3294 Signed-off-by: Victor Rubezhny <vrubezhny@redhat.com>
vrubezhny · Oct 3, 2023 · 9bf5103 · 9bf5103
1 parent a874a08
commit 9bf5103
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 10 deletions.
diff --git a/src/webview/common/sanitize.ts b/src/webview/common/sanitize.ts
@@ -0,0 +1,25 @@
+/*-----------------------------------------------------------------------------------------------
+ *  Copyright (c) Red Hat, Inc. All rights reserved.
+ *  Licensed under the MIT License. See LICENSE file in the project root for license information.
+ *-----------------------------------------------------------------------------------------------*/
+
+/**
+ * Builds a sanitized compponent name from a component folder full path or
+ * a Git-repo URL
+ *
+ * @param pathOrURL an absolute path ot a Git-repo URL
+ * @returns sanitized component name
+ */
+export function buildSanitizedComponentName(pathOrURL?: string): string {
+    let folder: string = pathOrURL ? pathOrURL : '';
+    folder = folder.endsWith('.git') ? folder.substring(0, folder.lastIndexOf('.git')) : folder;
+    const isWindowsPath = folder.length > 1 && folder.charAt(1) === ':';
+    const componentNameFromFolder = folder //
+        .substring(folder.lastIndexOf(isWindowsPath ? '\\' : '/') + 1)
+        .toLocaleLowerCase()
+        .replace(/[^a-z0-9-]+/g, '-')
+        .replace(/-+/g, '-')
+        .replace(/-$/, '')
+        .replace(/^[0-9]+/, '');
+    return componentNameFromFolder.length ? componentNameFromFolder : 'component';
+}
diff --git a/src/webview/create-component/pages/fromExistingGitRepo.tsx b/src/webview/create-component/pages/fromExistingGitRepo.tsx
@@ -22,6 +22,7 @@ import { DevfileRecommendationInfo } from '../../common/devfileRecommendationInf
 import { DevfileSearch } from '../../common/devfileSearch';
 import { NoSuitableDevfile } from '../../common/noSuitableDevfile';
 import { SetNameAndFolder } from '../../common/setNameAndFolder';
+import { buildSanitizedComponentName } from '../../common/sanitize';
 
 type Message = {
     action: string;
@@ -454,7 +455,7 @@ export function FromExistingGitRepo({ setCurrentView }) {
                     }}
                     createComponent={createComponentFromGitRepo}
                     devfile={recommendedDevfile.isDevfileExistsInRepo ? undefined : selectedDevfile ? selectedDevfile : recommendedDevfile.devfile}
-                    initialComponentName={gitURL.url.substring(gitURL.url.lastIndexOf('/') + 1)}
+                    initialComponentName={buildSanitizedComponentName(gitURL.url)}
                 />
             );
         case 'selectDifferentDevfile':

diff --git a/src/webview/create-component/pages/fromLocalCodebase.tsx b/src/webview/create-component/pages/fromLocalCodebase.tsx
@@ -26,6 +26,7 @@ import { DevfileRecommendationInfo } from '../../common/devfileRecommendationInf
 import { DevfileSearch } from '../../common/devfileSearch';
 import { NoSuitableDevfile } from '../../common/noSuitableDevfile';
 import { PortNumberInput } from '../../common/portNumberInput';
+import { buildSanitizedComponentName } from '../../common/sanitize';
 
 type Message = {
     action: string;
@@ -149,15 +150,7 @@ export function FromLocalCodebase(props: FromLocalCodebaseProps) {
         window.vscodeApi.postMessage({ action: 'getWorkspaceFolders' });
         if (props.rootFolder && props.rootFolder.length !== 0) {
             setProjectFolder(props.rootFolder);
-            const isWindowsPath = props.rootFolder.charAt(1) === ':';
-            let componentNameFromFolder: string = props.rootFolder //
-                .substring(props.rootFolder.lastIndexOf(isWindowsPath ? '\\' : '/') + 1)
-                .toLocaleLowerCase()
-                .replace(/[^a-z0-9-]+/g, '-')
-                .replace(/-+/g, '-')
-                .replace(/-$/, '')
-                .replace(/^[0-9]+/, '');
-            componentNameFromFolder = componentNameFromFolder.length ? componentNameFromFolder : 'component';
+            const componentNameFromFolder = buildSanitizedComponentName(props.rootFolder);
             setComponentName(componentNameFromFolder);
             window.vscodeApi.postMessage({
                 action: 'validateComponentName',