Don't show card if existing Devfile is used

Instead, show an information message indicating that the existing
devfile will be used.

Fixes #3129

Signed-off-by: David Thompson <davthomp@redhat.com>

Author: datho7561

src/webview/common/setNameAndFolder.tsx

@@ -3,6 +3,8 @@
  *  Licensed under the MIT License. See LICENSE file in the project root for license information.
  *-----------------------------------------------------------------------------------------------*/
 import {
+    Alert,
+    Box,
     Button,
     Checkbox,
     FormControl,
@@ -114,18 +116,22 @@ export function SetNameAndFolder(props: SetNameAndFolderProps) {
             </div>
 
             <Stack direction="column" spacing={2} marginTop={2}>
-                <Paper elevation={4}>
-                    <Stack margin={2} spacing={2}>
-                        <DevfileListItem devfile={props.devfile} />
-                        {/* padding here is to match the padding build into the devfile list component */}
-                        {props.templateProject && (
-                            <Stack direction="row" alignItems="center" spacing={1} paddingX={1}>
-                                <Typography variant="body1">Project:</Typography>
-                                <code>{props.templateProject}</code>
-                            </Stack>
-                        )}
-                    </Stack>
-                </Paper>
+                {props.devfile ? (
+                    <Paper elevation={4}>
+                        <Stack margin={2} spacing={2}>
+                            <DevfileListItem devfile={props.devfile} />
+                            {/* padding here is to match the padding build into the devfile list component */}
+                            {props.templateProject && (
+                                <Stack direction="row" alignItems="center" spacing={1} paddingX={1}>
+                                    <Typography variant="body1">Project:</Typography>
+                                    <code>{props.templateProject}</code>
+                                </Stack>
+                            )}
+                        </Stack>
+                    </Paper>
+                ) : (
+                    <Alert severity="info">The Devfile that exists in the repo will be used</Alert>
+                )}
                 <ComponentNameInput
                     isComponentNameFieldValid={isComponentNameFieldValid}
                     componentNameErrorMessage={componentNameErrorMessage}

src/webview/create-component/pages/fromExistingGitRepo.tsx

@@ -332,21 +332,25 @@ export function FromExistingGitRepo({ setCurrentView }) {
                                                 ? 'Selected Devfile'
                                                 : 'Recommended Devfile'}
                                         </Typography>
-                                        {recommendedDevfile.isDevfileExistsInRepo ? (
-                                            <Alert severity="info">
-                                                The Devfile that exists in the repo will be used
-                                            </Alert>
-                                        ) : (
+                                        {!recommendedDevfile.isDevfileExistsInRepo && (
                                             <DevfileRecommendationInfo />
                                         )}
                                     </Stack>
-                                    <DevfileListItem
-                                        devfile={
-                                            selectedDevfile
-                                                ? selectedDevfile
-                                                : recommendedDevfile.devfile
-                                        }
-                                    />
+                                    {recommendedDevfile.isDevfileExistsInRepo ? (
+                                        <Box margin={2}>
+                                            <Alert severity="info">
+                                                The Devfile that exists in the repo will be used
+                                            </Alert>
+                                        </Box>
+                                    ) : (
+                                        <DevfileListItem
+                                            devfile={
+                                                selectedDevfile
+                                                    ? selectedDevfile
+                                                    : recommendedDevfile.devfile
+                                            }
+                                        />
+                                    )}
                                     <Stack
                                         direction="row"
                                         justifyContent="flex-end"
@@ -407,7 +411,7 @@ export function FromExistingGitRepo({ setCurrentView }) {
                         setCurrentPage('fromGitRepo');
                     }}
                     createComponent={createComponentFromGitRepo}
-                    devfile={selectedDevfile ? selectedDevfile : recommendedDevfile.devfile}
+                    devfile={recommendedDevfile.isDevfileExistsInRepo ? undefined : selectedDevfile ? selectedDevfile : recommendedDevfile.devfile}
                     initialComponentName={gitURL.url.substring(gitURL.url.lastIndexOf('/') + 1)}
                 />
             );