Skip to content

Commit 1ed654f

Browse files
committed
refactor
1 parent a0e593f commit 1ed654f

File tree

3 files changed

+123
-88
lines changed

3 files changed

+123
-88
lines changed

src/components/ControlPlanes/List/ControlPlaneListWorkspaceGridTile.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ import { useLink } from '../../../lib/shared/useLink.ts';
3939
import IllustrationMessageType from '@ui5/webcomponents-fiori/dist/types/IllustrationMessageType.js';
4040
import styles from './WorkspacesList.module.css';
4141
import { ControlPlanesListMenu } from '../ControlPlanesListMenu.tsx';
42-
import { CreateManagedControlPlaneWizardContainer } from '../../Wizards/CreateManagedControlPlaneWizardContainer.tsx';
42+
import { CreateManagedControlPlaneWizardContainer } from '../../Wizards/CreateManagedControlPlane/CreateManagedControlPlaneWizardContainer.tsx';
4343

4444
interface Props {
4545
projectName: string;

src/components/Wizards/CreateManagedControlPlaneWizardContainer.tsx renamed to src/components/Wizards/CreateManagedControlPlane/CreateManagedControlPlaneWizardContainer.tsx

Lines changed: 29 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,48 +1,47 @@
11
import { FC, useCallback, useEffect, useMemo, useRef, useState } from 'react';
2-
import { useApiResourceMutation } from '../../lib/api/useApiResource';
2+
33
import IllustrationMessageType from '@ui5/webcomponents-fiori/dist/types/IllustrationMessageType.js';
4-
import { useAuthOnboarding } from '../../spaces/onboarding/auth/AuthContextOnboarding.tsx';
5-
import { Member, MemberRoles } from '../../lib/api/types/shared/members.ts';
4+
65
import type { WizardStepChangeEventDetail } from '@ui5/webcomponents-fiori/dist/Wizard.js';
76
import { zodResolver } from '@hookform/resolvers/zod';
87
import { useForm } from 'react-hook-form';
9-
import { validationSchemaCreateManagedControlPlane } from '../../lib/api/validations/schemas.ts';
10-
import { OnCreatePayload } from '../Dialogs/CreateProjectWorkspaceDialog.tsx';
8+
119
import {
1210
Bar,
1311
Button,
1412
Dialog,
1513
Form,
1614
FormGroup,
17-
Grid,
18-
List,
19-
ListItemStandard,
20-
Title,
2115
Ui5CustomEvent,
2216
Wizard,
2317
WizardDomRef,
2418
WizardStep,
2519
} from '@ui5/webcomponents-react';
26-
import YamlViewer from '../Yaml/YamlViewer.tsx';
27-
import { stringify } from 'yaml';
28-
import { APIError } from '../../lib/api/error.ts';
20+
21+
import { SummarizeStep } from './SummarizeStep.tsx';
22+
import { useTranslation } from 'react-i18next';
23+
import { useAuthOnboarding } from '../../../spaces/onboarding/auth/AuthContextOnboarding.tsx';
24+
import {
25+
ErrorDialog,
26+
ErrorDialogHandle,
27+
} from '../../Shared/ErrorMessageBox.tsx';
28+
import { CreateDialogProps } from '../../Dialogs/CreateWorkspaceDialogContainer.tsx';
29+
import { validationSchemaCreateManagedControlPlane } from '../../../lib/api/validations/schemas.ts';
30+
import { Member, MemberRoles } from '../../../lib/api/types/shared/members.ts';
31+
import { useApiResourceMutation } from '../../../lib/api/useApiResource.ts';
2932
import {
3033
ComponentsListItem,
3134
CreateManagedControlPlane,
3235
CreateManagedControlPlaneResource,
3336
CreateManagedControlPlaneType,
34-
} from '../../lib/api/types/crate/createManagedControlPlane.ts';
35-
import { ErrorDialog, ErrorDialogHandle } from '../Shared/ErrorMessageBox.tsx';
36-
import { EditMembers } from '../Members/EditMembers.tsx';
37-
import { useTranslation } from 'react-i18next';
38-
import { MetadataForm } from '../Dialogs/MetadataForm.tsx';
39-
import { IllustratedBanner } from '../Ui/IllustratedBanner/IllustratedBanner.tsx';
40-
import {
41-
ComponentsSelectionContainer,
42-
getSelectedComponents,
43-
} from '../ComponentsSelection/ComponentsSelectionContainer.tsx';
44-
import { CreateDialogProps } from '../Dialogs/CreateWorkspaceDialogContainer.tsx';
45-
import { idpPrefix } from '../../utils/idpPrefix.ts';
37+
} from '../../../lib/api/types/crate/createManagedControlPlane.ts';
38+
import { OnCreatePayload } from '../../Dialogs/CreateProjectWorkspaceDialog.tsx';
39+
import { idpPrefix } from '../../../utils/idpPrefix.ts';
40+
import { APIError } from '../../../lib/api/error.ts';
41+
import { MetadataForm } from '../../Dialogs/MetadataForm.tsx';
42+
import { EditMembers } from '../../Members/EditMembers.tsx';
43+
import { ComponentsSelectionContainer } from '../../ComponentsSelection/ComponentsSelectionContainer.tsx';
44+
import { IllustratedBanner } from '../../Ui/IllustratedBanner/IllustratedBanner.tsx';
4645

4746
type CreateManagedControlPlaneWizardContainerProps = {
4847
isOpen: boolean;
@@ -347,69 +346,12 @@ export const CreateManagedControlPlaneWizardContainer: FC<
347346
selected={selectedStep === 'summarize'}
348347
data-step="summarize"
349348
>
350-
<Title>{t('common.summarize')}</Title>
351-
<Grid defaultSpan="XL6 L6 M6 S6">
352-
<div>
353-
<List headerText={t('common.metadata')}>
354-
<ListItemStandard
355-
text={t('common.name')}
356-
additionalText={getValues('name')}
357-
/>
358-
<ListItemStandard
359-
text={t('common.displayName')}
360-
additionalText={getValues('displayName')}
361-
/>
362-
<ListItemStandard
363-
text={t('CreateProjectWorkspaceDialog.chargingTargetLabel')}
364-
additionalText={getValues('chargingTarget')}
365-
/>
366-
<ListItemStandard
367-
text={t('common.namespace')}
368-
additionalText={`${projectName}--ws-${workspaceName}`}
369-
/>
370-
</List>
371-
<br />
372-
<List headerText={t('common.members')}>
373-
{getValues('members').map((member) => (
374-
<ListItemStandard
375-
key={member.name}
376-
text={member.name}
377-
additionalText={member.roles[0]}
378-
/>
379-
))}
380-
</List>
381-
<br />
382-
<List headerText={t('common.components')}>
383-
{getSelectedComponents(componentsList ?? []).map(
384-
(component) => (
385-
<ListItemStandard
386-
key={component.name}
387-
text={component.name}
388-
additionalText={component.selectedVersion}
389-
/>
390-
),
391-
)}
392-
</List>
393-
</div>
394-
<div>
395-
<YamlViewer
396-
yamlString={stringify(
397-
CreateManagedControlPlane(
398-
getValues('name'),
399-
`${projectName}--ws-${workspaceName}`,
400-
{
401-
displayName: getValues('displayName'),
402-
chargingTarget: getValues('chargingTarget'),
403-
members: getValues('members'),
404-
componentsList: componentsList ?? [],
405-
},
406-
idpPrefix,
407-
),
408-
)}
409-
filename={`mcp_${projectName}--ws-${workspaceName}`}
410-
/>
411-
</div>
412-
</Grid>
349+
<SummarizeStep
350+
getValues={getValues}
351+
workspaceName={workspaceName}
352+
projectName={projectName}
353+
componentsList={componentsList}
354+
/>
413355
</WizardStep>
414356
<WizardStep
415357
icon="activities"
Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,93 @@
1+
import { useTranslation } from 'react-i18next';
2+
import { Grid, List, ListItemStandard, Title } from '@ui5/webcomponents-react';
3+
import { stringify } from 'yaml';
4+
import { getSelectedComponents } from '../../ComponentsSelection/ComponentsSelectionContainer.tsx';
5+
import {
6+
ComponentsListItem,
7+
CreateManagedControlPlane,
8+
} from '../../../lib/api/types/crate/createManagedControlPlane.ts';
9+
import YamlViewer from '../../Yaml/YamlViewer.tsx';
10+
import { idpPrefix } from '../../../utils/idpPrefix.ts';
11+
import { UseFormGetValues } from 'react-hook-form';
12+
import { CreateDialogProps } from '../../Dialogs/CreateWorkspaceDialogContainer.tsx';
13+
14+
interface SummarizeStepProps {
15+
getValues: UseFormGetValues<CreateDialogProps>;
16+
projectName: string;
17+
workspaceName: string;
18+
componentsList?: ComponentsListItem[];
19+
}
20+
21+
export const SummarizeStep: React.FC<SummarizeStepProps> = ({
22+
getValues,
23+
projectName,
24+
workspaceName,
25+
componentsList,
26+
}) => {
27+
const { t } = useTranslation();
28+
return (
29+
<>
30+
<Title>{t('common.summarize')}</Title>
31+
<Grid defaultSpan="XL6 L6 M6 S6">
32+
<div>
33+
<List headerText={t('common.metadata')}>
34+
<ListItemStandard
35+
text={t('common.name')}
36+
additionalText={getValues('name')}
37+
/>
38+
<ListItemStandard
39+
text={t('common.displayName')}
40+
additionalText={getValues('displayName')}
41+
/>
42+
<ListItemStandard
43+
text={t('CreateProjectWorkspaceDialog.chargingTargetLabel')}
44+
additionalText={getValues('chargingTarget')}
45+
/>
46+
<ListItemStandard
47+
text={t('common.namespace')}
48+
additionalText={`${projectName}--ws-${workspaceName}`}
49+
/>
50+
</List>
51+
<br />
52+
<List headerText={t('common.members')}>
53+
{getValues('members').map((member) => (
54+
<ListItemStandard
55+
key={member.name}
56+
text={member.name}
57+
additionalText={member.roles[0]}
58+
/>
59+
))}
60+
</List>
61+
<br />
62+
<List headerText={t('common.components')}>
63+
{getSelectedComponents(componentsList ?? []).map((component) => (
64+
<ListItemStandard
65+
key={component.name}
66+
text={component.name}
67+
additionalText={component.selectedVersion}
68+
/>
69+
))}
70+
</List>
71+
</div>
72+
<div>
73+
<YamlViewer
74+
yamlString={stringify(
75+
CreateManagedControlPlane(
76+
getValues('name'),
77+
`${projectName}--ws-${workspaceName}`,
78+
{
79+
displayName: getValues('displayName'),
80+
chargingTarget: getValues('chargingTarget'),
81+
members: getValues('members'),
82+
componentsList: componentsList ?? [],
83+
},
84+
idpPrefix,
85+
),
86+
)}
87+
filename={`mcp_${projectName}--ws-${workspaceName}`}
88+
/>
89+
</div>
90+
</Grid>
91+
</>
92+
);
93+
};

0 commit comments

Comments
 (0)