CNV-78079: move Virtual machine networks page to kubevirt-plugin

- moves Virtual machine networks page feature from networking-console-plugin to kubevirt-plugin
- add VLAN ID field validation (disable next step) in create VM network form
- show errors in Disconnect and Move VM modals

Other changes:
- updates UDN vs NAD constants. NAD spec.config uses lowercase for topology and role, UDN spec uses Capital case
- fix SelectTypeahead so children in options prop is optional
- MultiSelectTypeahead checkbox variant
- LabelList and LabelRow prop updates so the "Key" and "Value" titles don't need to be on top of each key + value text inputs
- add components from networking: ListErrorState, ExpandableProjectList
- add useProjectResources hook for fetching project K8sResourceCommon, not just project names (which useProjects does)

Author: adamviktora

locales/en/plugin__kubevirt-plugin.json

@@ -12,6 +12,7 @@ import { extensions as StorageMigrationExtensions } from './src/views/storagemig
 import { extensions as TopologyExtensions } from './src/views/topology/extensions';
 import { extensions as VirtualMachineInstanceMigrationsExtensions } from './src/views/virtualmachineinstancemigrations/extensions';
 import { extensions as VirtualMachinesExtensions } from './src/views/virtualmachines/extensions';
+import { extensions as VMNetworksExtensions } from './src/views/vmnetworks/extensions';
 
 const extensions: EncodedExtension[] = [
   ...VirtualizationPerspectiveExtensions,
@@ -26,6 +27,7 @@ const extensions: EncodedExtension[] = [
   ...TopologyExtensions,
   ...MulticlusterExtensions,
   ...VirtualMachineInstanceMigrationsExtensions,
+  ...VMNetworksExtensions,
   {
     properties: {
       flag: 'KUBEVIRT_CDI',

locales/es/plugin__kubevirt-plugin.json

@@ -12,6 +12,7 @@ import { exposedModules as StorageMigrationExposedModules } from './src/views/st
 import { exposedModules as TopologyExposedModules } from './src/views/topology/extensions';
 import { exposedModules as VirtualMachineInstanceMigrationsExposedModules } from './src/views/virtualmachineinstancemigrations/extensions';
 import { exposedModules as VirtualMachinesExposedModules } from './src/views/virtualmachines/extensions';
+import { exposedModules as VMNetworksExposedModules } from './src/views/vmnetworks/extensions';
 
 const metadata: ConsolePluginBuildMetadata = {
   dependencies: {
@@ -31,6 +32,7 @@ const metadata: ConsolePluginBuildMetadata = {
     ...MulticlusterExposedModules,
     ...VirtualMachineInstanceMigrationsExposedModules,
     ...PhysicalNetworksExposedModules,
+    ...VMNetworksExposedModules,
     BootableVolumesList: './views/bootablevolumes/list/BootableVolumesList.tsx',
     Catalog: './views/catalog/Catalog.tsx',
     ClusterOverviewPage: './views/clusteroverview/ClusterOverviewPage.tsx',

locales/fr/plugin__kubevirt-plugin.json

@@ -60,9 +60,13 @@ const ActionsDropdown: FC<ActionsDropdownProps> = ({
   if (isDisabled)
     return (
       <div className={classNames('kv-actions-dropdown', className)} ref={containerRef}>
-        <Tooltip content={disabledTooltip}>
-          <span> {Toggle(toggleRef)}</span>
-        </Tooltip>
+        {disabledTooltip ? (
+          <Tooltip content={disabledTooltip}>
+            <span>{Toggle(toggleRef)}</span>
+          </Tooltip>
+        ) : (
+          <span>{Toggle(toggleRef)}</span>
+        )}
       </div>
     );
 

locales/ja/plugin__kubevirt-plugin.json

@@ -0,0 +1,49 @@
+import React, { FC, useState } from 'react';
+
+import { modelToGroupVersionKind, NamespaceModel } from '@kubevirt-ui-ext/kubevirt-api/console';
+import { useKubevirtTranslation } from '@kubevirt-utils/hooks/useKubevirtTranslation';
+import { isEmpty } from '@kubevirt-utils/utils/utils';
+import { ResourceLink } from '@openshift-console/dynamic-plugin-sdk';
+import { Button, ButtonVariant, Skeleton } from '@patternfly/react-core';
+
+import { SHOW_MAX_ITEMS } from './constants';
+
+type ExpandableProjectListProps = {
+  emptyMessage?: string;
+  loaded?: boolean;
+  maxItems?: number;
+  projectNames: string[];
+};
+
+const ExpandableProjectList: FC<ExpandableProjectListProps> = ({
+  emptyMessage,
+  loaded = true,
+  maxItems = SHOW_MAX_ITEMS,
+  projectNames,
+}) => {
+  const { t } = useKubevirtTranslation();
+  const [expand, setExpand] = useState(false);
+
+  if (!loaded) return <Skeleton />;
+
+  if (isEmpty(projectNames)) return <span>{emptyMessage ?? t('No projects matched')}</span>;
+
+  return (
+    <>
+      {projectNames.slice(0, expand ? projectNames.length : maxItems).map((project) => (
+        <ResourceLink
+          groupVersionKind={modelToGroupVersionKind(NamespaceModel)}
+          key={project}
+          name={project}
+        />
+      ))}
+      {projectNames.length > maxItems && (
+        <Button onClick={() => setExpand(!expand)} variant={ButtonVariant.link}>
+          {expand ? t('Show less') : t('+{{num}} more', { num: projectNames.length - maxItems })}
+        </Button>
+      )}
+    </>
+  );
+};
+
+export default ExpandableProjectList;