aksd: Extract shared components from CreateAKSProject

Signed-off-by: Evangelos Skopelitis <eskopelitis@microsoft.com>

Author: skoeva

plugins/aks-desktop/src/components/CreateAKSProject/CreateAKSProject.tsx

@@ -4,11 +4,11 @@
 import React from 'react';
 import { useHistory } from 'react-router-dom';
 import AzureAuthGuard from '../AzureAuth/AzureAuthGuard';
+import { ComputeStep } from '../shared/ComputeStep';
+import { NetworkingStep } from '../shared/NetworkingStep';
 import { AccessStep } from './components/AccessStep';
 import { BasicsStep } from './components/BasicsStep';
-import { ComputeStep } from './components/ComputeStep';
 import CreateAKSProjectPure from './components/CreateAKSProjectPure';
-import { NetworkingStep } from './components/NetworkingStep';
 import { ReviewStep } from './components/ReviewStep';
 import { useCreateAKSProjectWizard } from './hooks/useCreateAKSProjectWizard';
 

plugins/aks-desktop/src/components/CreateAKSProject/components/BasicsStep.tsx

@@ -16,9 +16,9 @@ import React, { useEffect, useRef, useState } from 'react';
 import { useAzureAuth } from '../../../hooks/useAzureAuth';
 import type { ClusterCapabilities } from '../../../types/ClusterCapabilities';
 import { registerAKSCluster } from '../../../utils/azure/aks';
+import { FormField } from '../../shared/FormField';
 import type { BasicsStepProps } from '../types';
 import { ClusterConfigurePanel } from './ClusterConfigurePanel';
-import { FormField } from './FormField';
 import { SearchableSelect, SearchableSelectOption } from './SearchableSelect';
 import { ValidationAlert } from './ValidationAlert';
 

plugins/aks-desktop/src/components/CreateAKSProject/components/ComputeStep.stories.tsx

@@ -3,8 +3,8 @@
 
 import { Meta, StoryFn } from '@storybook/react';
 import React from 'react';
+import { ComputeStep } from '../../shared/ComputeStep';
 import type { ComputeStepProps } from '../types';
-import { ComputeStep } from './ComputeStep';
 
 const BASE_FORM_DATA = {
   projectName: 'azure-microservices-demo',

plugins/aks-desktop/src/components/CreateAKSProject/components/CreateAKSProjectPure.guidepup.test.tsx

@@ -115,6 +115,9 @@ vi.mock('@iconify/react', () => ({
   Icon: ({ icon, ...props }: any) => <span data-icon={icon} {...props} />,
 }));
 
+import { ComputeStep } from '../../shared/ComputeStep';
+import { FormField } from '../../shared/FormField';
+import { NetworkingStep } from '../../shared/NetworkingStep';
 import type {
   BreadcrumbProps,
   ComputeStepProps,
@@ -125,11 +128,8 @@ import type {
 import { STEPS } from '../types';
 import { AccessStep } from './AccessStep';
 import { Breadcrumb } from './Breadcrumb';
-import { ComputeStep } from './ComputeStep';
 import type { CreateAKSProjectPureProps } from './CreateAKSProjectPure';
 import CreateAKSProjectPure from './CreateAKSProjectPure';
-import { FormField } from './FormField';
-import { NetworkingStep } from './NetworkingStep';
 import { ReviewStep } from './ReviewStep';
 import type { SearchableSelectProps } from './SearchableSelect';
 import { SearchableSelect } from './SearchableSelect';

plugins/aks-desktop/src/components/CreateAKSProject/components/FormField.stories.tsx

@@ -3,8 +3,8 @@
 
 import { Meta, StoryFn } from '@storybook/react';
 import React from 'react';
+import { FormField } from '../../shared/FormField';
 import type { FormFieldProps } from '../types';
-import { FormField } from './FormField';
 
 const BASE_PROPS: FormFieldProps = {
   label: 'Project Name',

plugins/aks-desktop/src/components/CreateAKSProject/components/NetworkingStep.stories.tsx

@@ -3,8 +3,8 @@
 
 import { Meta, StoryFn } from '@storybook/react';
 import React from 'react';
+import { NetworkingStep } from '../../shared/NetworkingStep';
 import type { NetworkingStepProps } from '../types';
-import { NetworkingStep } from './NetworkingStep';
 
 const BASE_FORM_DATA = {
   projectName: 'azure-microservices-demo',

plugins/aks-desktop/src/components/CreateNamespace/CreateNamespace.tsx

@@ -20,11 +20,11 @@ import { useHistory } from 'react-router-dom';
 import { createNamespaceAsProject } from '../../utils/kubernetes/namespaceUtils';
 import { getClusterSettings, setClusterSettings } from '../../utils/shared/clusterSettings';
 import { Breadcrumb } from '../CreateAKSProject/components/Breadcrumb';
-import { FormField } from '../CreateAKSProject/components/FormField';
 import {
   SearchableSelect,
   SearchableSelectOption,
 } from '../CreateAKSProject/components/SearchableSelect';
+import { FormField } from '../shared/FormField';
 
 const STEPS = ['Basics', 'Review'] as const;
 

…ateAKSProject/components/ComputeStep.tsx …op/src/components/shared/ComputeStep.tsxplugins/aks-desktop/src/components/CreateAKSProject/components/ComputeStep.tsx renamed to plugins/aks-desktop/src/components/shared/ComputeStep.tsx plugins/aks-desktop/src/components/CreateAKSProject/components/ComputeStep.tsx renamed to plugins/aks-desktop/src/components/shared/ComputeStep.tsx

@@ -5,7 +5,7 @@ import { Icon } from '@iconify/react';
 import { useTranslation } from '@kinvolk/headlamp-plugin/lib';
 import { Box, Grid, Typography } from '@mui/material';
 import React from 'react';
-import type { ComputeStepProps } from '../types';
+import type { ComputeStepProps } from '../CreateAKSProject/types';
 import { FormField } from './FormField';
 import { ResourceCard } from './ResourceCard';
 

…reateAKSProject/components/FormField.tsx …ktop/src/components/shared/FormField.tsxplugins/aks-desktop/src/components/CreateAKSProject/components/FormField.tsx renamed to plugins/aks-desktop/src/components/shared/FormField.tsx plugins/aks-desktop/src/components/CreateAKSProject/components/FormField.tsx renamed to plugins/aks-desktop/src/components/shared/FormField.tsx

@@ -4,7 +4,7 @@
 import { InputAdornment, TextField } from '@mui/material';
 import { useTheme } from '@mui/material/styles';
 import React from 'react';
-import type { FormFieldProps } from '../types';
+import type { FormFieldProps } from '../CreateAKSProject/types';
 
 /**
  * Reusable form field component with consistent styling

…AKSProject/components/NetworkingStep.tsx …src/components/shared/NetworkingStep.tsxplugins/aks-desktop/src/components/CreateAKSProject/components/NetworkingStep.tsx renamed to plugins/aks-desktop/src/components/shared/NetworkingStep.tsx plugins/aks-desktop/src/components/CreateAKSProject/components/NetworkingStep.tsx renamed to plugins/aks-desktop/src/components/shared/NetworkingStep.tsx

@@ -5,8 +5,8 @@ import { useTranslation } from '@kinvolk/headlamp-plugin/lib';
 import { TextField } from '@mui/material';
 import { Box, MenuItem, Typography } from '@mui/material';
 import React from 'react';
-import type { NetworkingStepProps } from '../types';
-import { EGRESS_OPTIONS, INGRESS_OPTIONS } from '../types';
+import type { NetworkingStepProps } from '../CreateAKSProject/types';
+import { EGRESS_OPTIONS, INGRESS_OPTIONS } from '../CreateAKSProject/types';
 
 /**
  * Networking step component for ingress and egress policy configuration