diff --git a/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json b/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json
index 9a1c59602..9fb4f9dda 100644
--- a/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json
+++ b/packages/forklift-console-plugin/locales/en/plugin__forklift-console-plugin.json
@@ -69,7 +69,6 @@
"Create NetworkMap": "Create NetworkMap",
"Create new provider": "Create new provider",
"Create plan": "Create plan",
- "Create Plan": "Create Plan",
"Create provider": "Create provider",
"Create Provider": "Create Provider",
"Create Providers by using the form or manually entering YAML or JSON definitions. Provider CRs store attributes that enable MTV to connect to and interact with the source and target providers.": "Create Providers by using the form or manually entering YAML or JSON definitions. Provider CRs store attributes that enable MTV to connect to and interact with the source and target providers.",
@@ -171,6 +170,7 @@
"Filter by status": "Filter by status",
"Filter by template": "Filter by template",
"Filter by tenant": "Filter by tenant",
+ "Filter provider": "Filter provider",
"Flavor": "Flavor",
"For example: <1>https://identity_service.com:5000/v31>.": "For example: <1>https://identity_service.com:5000/v31>.",
"From": "From",
@@ -345,6 +345,8 @@
"Secrets": "Secrets",
"Select migration network": "Select migration network",
"Select provider type": "Select provider type",
+ "Select source provider": "Select source provider",
+ "Select virtual machines": "Select virtual machines",
"Select virtual machines and create a migration plan.": "Select virtual machines and create a migration plan.",
"Selected columns will be displayed in the table.": "Selected columns will be displayed in the table.",
"Selected VMs": "Selected VMs",
@@ -403,12 +405,14 @@
"This plan cannot be edited because it is running must gather.": "This plan cannot be edited because it is running must gather.",
"This plan cannot be edited because the inventory data for its associated providers is not ready.": "This plan cannot be edited because the inventory data for its associated providers is not ready.",
"This plan cannot be restarted because it is running must gather service": "This plan cannot be restarted because it is running must gather service",
+ "This plan will be created in <1>{defaultNamespace}1> namespace, if you wish to choose another namespace please cancel, and choose a namespace from the top bar.": "This plan will be created in <1>{defaultNamespace}1> namespace, if you wish to choose another namespace please cancel, and choose a namespace from the top bar.",
"This provider will be created in <1>{defaultNamespace}1> namespace, if you wish to choose another namespace please cancel, and choose a namespace from the top bar.": "This provider will be created in <1>{defaultNamespace}1> namespace, if you wish to choose another namespace please cancel, and choose a namespace from the top bar.",
"This resource is managed by <2>2> and any modifications may be overwritten. Edit the managing resource to preserve changes.": "This resource is managed by <2>2> and any modifications may be overwritten. Edit the managing resource to preserve changes.",
"To": "To",
"To make changes to the plan, select Duplicate and edit the duplicate plan.": "To make changes to the plan, select Duplicate and edit the duplicate plan.",
- "To migrate virtual machines from <1>{name}1> provider, select the virtual machines to migrate from the list of available virtual machines and click the <4>Migrate4> button.": "To migrate virtual machines from <1>{name}1> provider, select the virtual machines to migrate from the list of available virtual machines and click the <4>Migrate4> button.",
+ "To migrate virtual machines from <1>{name}1> provider, select the virtual machines to migrate from the list of available virtual machines and click the <4>Create migration plan4> button.": "To migrate virtual machines from <1>{name}1> provider, select the virtual machines to migrate from the list of available virtual machines and click the <4>Create migration plan4> button.",
"To migrate virtual machines from <1>{provider.metadata.name}1> provider, select the virtual machines to migrate from the list of available virtual machines located in the virtual machines tab. <4>Go to <1>Virtual Machines1> tab4>": "To migrate virtual machines from <1>{provider.metadata.name}1> provider, select the virtual machines to migrate from the list of available virtual machines located in the virtual machines tab. <4>Go to <1>Virtual Machines1> tab4>",
+ "To migrate virtual machines select a provider, then select the virtual machines to migrate and click the <1>Create migration plan1> button.": "To migrate virtual machines select a provider, then select the virtual machines to migrate and click the <1>Create migration plan1> button.",
"To troubleshoot, check the Forklift controller pod events and logs.": "To troubleshoot, check the Forklift controller pod events and logs.",
"To troubleshoot, check the Forklift controller pod logs.": "To troubleshoot, check the Forklift controller pod logs.",
"To troubleshoot, view the provider status available in the provider details page\n and check the Forklift controller pod logs.": "To troubleshoot, view the provider status available in the provider details page\n and check the Forklift controller pod logs.",
diff --git a/packages/forklift-console-plugin/src/components/images/logos.tsx b/packages/forklift-console-plugin/src/components/images/logos.tsx
new file mode 100644
index 000000000..08da11474
--- /dev/null
+++ b/packages/forklift-console-plugin/src/components/images/logos.tsx
@@ -0,0 +1,52 @@
+import React from 'react';
+
+import openshiftImg from './resources/openshift.svg';
+import openstackImg from './resources/openstack.svg';
+import ovaImg from './resources/ova.svg';
+import redhatImg from './resources/redhat.svg';
+import vmImg from './resources/vm.svg';
+
+export const openshiftLogo = (
+
+);
+
+export const openstackLogo = (
+
+);
+
+export const vmLogo = (
+
+);
+
+export const redhatLogo = (
+
+);
+
+export const ovaLogo = (
+
+);
diff --git a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/openshift.svg b/packages/forklift-console-plugin/src/components/images/resources/openshift.svg
similarity index 95%
rename from packages/forklift-console-plugin/src/modules/Providers/views/create/images/openshift.svg
rename to packages/forklift-console-plugin/src/components/images/resources/openshift.svg
index 5bc707b41..20a1577de 100644
--- a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/openshift.svg
+++ b/packages/forklift-console-plugin/src/components/images/resources/openshift.svg
@@ -8,7 +8,7 @@
viewBox="-1.7338671 -1.7338671 59.64439 59.616873"
id="svg45453"
sodipodi:docname="openshift.svg"
- inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+ inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
@@ -24,19 +24,19 @@
inkscape:deskcolor="#d1d1d1"
showgrid="false"
inkscape:zoom="1.3372396"
- inkscape:cx="195.17819"
- inkscape:cy="383.6261"
+ inkscape:cx="195.926"
+ inkscape:cy="384"
inkscape:window-width="3440"
inkscape:window-height="1371"
inkscape:window-x="0"
- inkscape:window-y="0"
+ inkscape:window-y="32"
inkscape:window-maximized="1"
inkscape:current-layer="svg45453" />
+ transform="translate(-0.41875627,-1.6449201)">
+
diff --git a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/ova.svg b/packages/forklift-console-plugin/src/components/images/resources/ova.svg
similarity index 58%
rename from packages/forklift-console-plugin/src/modules/Providers/views/create/images/ova.svg
rename to packages/forklift-console-plugin/src/components/images/resources/ova.svg
index 21334cd74..1fe9a71e1 100644
--- a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/ova.svg
+++ b/packages/forklift-console-plugin/src/components/images/resources/ova.svg
@@ -1,13 +1,13 @@
diff --git a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/redhat.svg b/packages/forklift-console-plugin/src/components/images/resources/redhat.svg
similarity index 100%
rename from packages/forklift-console-plugin/src/modules/Providers/views/create/images/redhat.svg
rename to packages/forklift-console-plugin/src/components/images/resources/redhat.svg
diff --git a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/vm.svg b/packages/forklift-console-plugin/src/components/images/resources/vm.svg
similarity index 50%
rename from packages/forklift-console-plugin/src/modules/Providers/views/create/images/vm.svg
rename to packages/forklift-console-plugin/src/components/images/resources/vm.svg
index 3152e0841..069f8f02c 100644
--- a/packages/forklift-console-plugin/src/modules/Providers/views/create/images/vm.svg
+++ b/packages/forklift-console-plugin/src/components/images/resources/vm.svg
@@ -9,7 +9,7 @@
id="icon"
version="1.1"
sodipodi:docname="vm.svg"
- inkscape:version="1.2.2 (b0a8486541, 2022-12-01)"
+ inkscape:version="1.3.2 (091e20ef0f, 2023-11-25)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns="http://www.w3.org/2000/svg"
@@ -24,14 +24,14 @@
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
showgrid="false"
- inkscape:zoom="1.28375"
- inkscape:cx="400.77897"
- inkscape:cy="399.61052"
- inkscape:window-width="3440"
- inkscape:window-height="1371"
- inkscape:window-x="0"
- inkscape:window-y="0"
- inkscape:window-maximized="1"
+ inkscape:zoom="0.90774833"
+ inkscape:cx="445.05728"
+ inkscape:cy="421.3723"
+ inkscape:window-width="1499"
+ inkscape:window-height="1243"
+ inkscape:window-x="1740"
+ inkscape:window-y="119"
+ inkscape:window-maximized="0"
inkscape:current-layer="icon" />
@@ -43,7 +43,7 @@
,
+
+ {
+ type: 'console.resource/create',
+ properties: {
+ component: {
+ $codeRef: 'PlanCreatePage',
+ },
+ model: PlanModelGroupVersionKind,
+ ...PlanModel,
+ },
+ } as EncodedExtension,
];
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.style.css b/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.style.css
new file mode 100644
index 000000000..3ffbbcddd
--- /dev/null
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.style.css
@@ -0,0 +1,64 @@
+.forklift-create-provider-edit-section {
+ padding-top: 0;
+}
+
+.forklift-create-provider-edit-section-header {
+ margin-bottom: 0;
+}
+
+.forklift-section-create-deviser {
+ padding-top: var(--pf-global--spacer--md);
+ padding-bottom: var(--pf-global--spacer--md);
+}
+
+.forklift-create-subtitle {
+ padding-bottom: var(--pf-global--spacer--md);
+}
+
+.forklift-create-card--list {
+ list-style-type: none;
+ padding: 0;
+}
+
+.forklift--create-provider-edit-card-selected {
+ min-width: 25%;
+}
+
+.forklift--create-provider-edit-card-title {
+ justify-content: normal;
+}
+
+.forklift--create-provider-edit-card-title-logo {
+ margin-right: var(--pf-global--spacer--sm);
+}
+
+.forklift--create-provider-field-error-validation {
+ color: var(--pf-c-form__helper-text--m-error--Color);
+ font-size: small;
+ padding-top: var(--pf-c-form__helper-text--MarginTop);
+}
+
+.forklift--create-provider-field-warning-validation {
+ color: var(--pf-c-form__helper-text--m-warning--Color);
+ font-size: small;
+ padding-top: var(--pf-c-form__helper-text--MarginTop);
+}
+
+.forklift--create-provider-field-success-validation {
+ color: var(--pf-c-form__helper-text--m-success--Color);
+ font-size: small;
+ padding-top: var(--pf-c-form__helper-text--MarginTop);
+}
+
+.forklift--create-provider-field-default-validation {
+ font-size: small;
+ padding-top: var(--pf-c-form__helper-text--MarginTop);
+}
+
+.forklift--create-plan--filters-toolbar {
+ padding-bottom: 0;
+}
+
+.forklift--create-plan--alert {
+ margin-top: var(--pf-global--spacer--md);
+}
diff --git a/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.tsx b/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.tsx
new file mode 100644
index 000000000..87f7e016e
--- /dev/null
+++ b/packages/forklift-console-plugin/src/modules/Plans/views/create/PlanCreatePage.tsx
@@ -0,0 +1,138 @@
+import React, { useReducer } from 'react';
+import { Trans } from 'react-i18next';
+import { useHistory } from 'react-router';
+import { getResourceUrl } from 'src/modules/Providers/utils';
+import { MigrationAction } from 'src/modules/Providers/views/details/tabs/VirtualMachines/components/MigrationAction';
+import { useForkliftTranslation } from 'src/utils/i18n';
+
+import { ProviderModelGroupVersionKind, ProviderModelRef, V1beta1Provider } from '@kubev2v/types';
+import { useK8sWatchResource } from '@openshift-console/dynamic-plugin-sdk';
+import {
+ Alert,
+ Button,
+ PageSection,
+ Title,
+ Toolbar,
+ ToolbarContent,
+ ToolbarItem,
+} from '@patternfly/react-core';
+import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
+
+import { findProviderByID, PlanCreateForm, ProviderVirtualMachinesList } from './components';
+import { planCreatePageInitialState, planCreatePageReducer } from './states';
+
+import './PlanCreatePage.style.css';
+
+export const PlanCreatePage: React.FC<{
+ namespace: string;
+}> = ({ namespace }) => {
+ const { t } = useForkliftTranslation();
+ const history = useHistory();
+ const [filterState, filterDispatch] = useReducer(
+ planCreatePageReducer,
+ planCreatePageInitialState,
+ );
+
+ const [providers] = useK8sWatchResource({
+ groupVersionKind: ProviderModelGroupVersionKind,
+ namespaced: true,
+ isList: true,
+ namespace,
+ });
+
+ const defaultNamespace = process?.env?.DEFAULT_NAMESPACE || 'default';
+
+ const providersListURL = getResourceUrl({
+ reference: ProviderModelRef,
+ namespace: namespace,
+ });
+
+ const filteredProviders = providers.filter(
+ (provider) =>
+ provider.metadata.name.toLowerCase().includes(filterState.nameFilter.toLowerCase()) &&
+ (filterState.typeFilters.length === 0 ||
+ filterState.typeFilters.includes(provider.spec.type)),
+ );
+
+ const selectedProvider =
+ filterState.selectedProviderUID !== ''
+ ? findProviderByID(filterState.selectedProviderUID, providers)
+ : undefined;
+ const selectedProviderName = selectedProvider?.metadata?.name;
+ const selectedProviderNamespace = selectedProvider?.metadata?.namespace;
+
+ return (
+
+
+ }
+ variant="info"
+ title={t('How to create a migration plan')}
+ >
+
+ To migrate virtual machines select a provider, then select the virtual machines to
+ migrate and click the Create migration plan button.
+
+
+
+ {!namespace && (
+
+
+ This plan will be created in {defaultNamespace} namespace, if you
+ wish to choose another namespace please cancel, and choose a namespace from the top
+ bar.
+
+
+ )}
+
+
+ {t('Select source provider')}
+
+
+
+
+ {filterState.selectedProviderUID && (
+
+ filterDispatch({ type: 'UPDATE_SELECTED_VMS', payload: selectedVms })
+ }
+ initialSelectedIds={filterState.selectedVMs.map((vm) => vm.vm.id)}
+ />
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+