feat(namespace): migrate create ns to react [EE-2226] (#10377)

app/kubernetes/__module.js

@@ -1,5 +1,5 @@
 import { EnvironmentStatus } from '@/react/portainer/environments/types';
-import { getSelfSubjectAccessReview } from '@/react/kubernetes/namespaces/service';
+import { getSelfSubjectAccessReview } from '@/react/kubernetes/namespaces/getSelfSubjectAccessReview';
 
 import { PortainerEndpointTypes } from 'Portainer/models/endpoint/models';
 
@@ -375,12 +375,12 @@ angular.module('portainer.kubernetes', ['portainer.app', registriesModule, custo
       },
     };
 
-    const resourcePoolCreation = {
+    const namespaceCreation = {
       name: 'kubernetes.resourcePools.new',
       url: '/new',
       views: {
         'content@': {
-          component: 'kubernetesCreateResourcePoolView',
+          component: 'kubernetesCreateNamespaceView',
         },
       },
     };
@@ -504,7 +504,7 @@ angular.module('portainer.kubernetes', ['portainer.app', registriesModule, custo
     $stateRegistryProvider.register(node);
     $stateRegistryProvider.register(nodeStats);
     $stateRegistryProvider.register(resourcePools);
-    $stateRegistryProvider.register(resourcePoolCreation);
+    $stateRegistryProvider.register(namespaceCreation);
     $stateRegistryProvider.register(resourcePool);
     $stateRegistryProvider.register(resourcePoolAccess);
     $stateRegistryProvider.register(volumes);

app/kubernetes/react/components/index.ts

@@ -1,11 +1,11 @@
 import angular from 'angular';
 
 import { r2a } from '@/react-tools/react2angular';
-import { IngressClassDatatable } from '@/react/kubernetes/cluster/ingressClass/IngressClassDatatable';
+import { IngressClassDatatableAngular } from '@/react/kubernetes/cluster/ingressClass/IngressClassDatatable/IngressClassDatatableAngular';
 import { NamespacesSelector } from '@/react/kubernetes/cluster/RegistryAccessView/NamespacesSelector';
 import { StorageAccessModeSelector } from '@/react/kubernetes/cluster/ConfigureView/ConfigureForm/StorageAccessModeSelector';
 import { NamespaceAccessUsersSelector } from '@/react/kubernetes/namespaces/AccessView/NamespaceAccessUsersSelector';
-import { CreateNamespaceRegistriesSelector } from '@/react/kubernetes/namespaces/CreateView/CreateNamespaceRegistriesSelector';
+import { RegistriesSelector } from '@/react/kubernetes/namespaces/components/RegistriesFormSection/RegistriesSelector';
 import { KubeApplicationAccessPolicySelector } from '@/react/kubernetes/applications/CreateView/KubeApplicationAccessPolicySelector';
 import { KubeServicesForm } from '@/react/kubernetes/applications/CreateView/application-services/KubeServicesForm';
 import { kubeServicesValidation } from '@/react/kubernetes/applications/CreateView/application-services/kubeServicesValidation';
@@ -27,7 +27,7 @@ export const ngModule = angular
   .module('portainer.kubernetes.react.components', [])
   .component(
     'ingressClassDatatable',
-    r2a(IngressClassDatatable, [
+    r2a(IngressClassDatatableAngular, [
       'onChangeControllers',
       'description',
       'ingressControllers',
@@ -74,12 +74,7 @@ export const ngModule = angular
   )
   .component(
     'createNamespaceRegistriesSelector',
-    r2a(CreateNamespaceRegistriesSelector, [
-      'inputId',
-      'onChange',
-      'options',
-      'value',
-    ])
+    r2a(RegistriesSelector, ['inputId', 'onChange', 'options', 'value'])
   )
   .component(
     'kubeApplicationAccessPolicySelector',

app/kubernetes/react/views/index.ts

@@ -10,11 +10,16 @@ import { DashboardView } from '@/react/kubernetes/dashboard/DashboardView';
 import { ServicesView } from '@/react/kubernetes/services/ServicesView';
 import { ConsoleView } from '@/react/kubernetes/applications/ConsoleView';
 import { ConfigmapsAndSecretsView } from '@/react/kubernetes/configs/ListView/ConfigmapsAndSecretsView';
+import { CreateNamespaceView } from '@/react/kubernetes/namespaces/CreateView/CreateNamespaceView';
 import { ApplicationDetailsView } from '@/react/kubernetes/applications/DetailsView/ApplicationDetailsView';
 import { ConfigureView } from '@/react/kubernetes/cluster/ConfigureView';
 
 export const viewsModule = angular
   .module('portainer.kubernetes.react.views', [])
+  .component(
+    'kubernetesCreateNamespaceView',
+    r2a(withUIRouter(withReactQuery(withCurrentUser(CreateNamespaceView))), [])
+  )
   .component(
     'kubernetesServicesView',
     r2a(withUIRouter(withReactQuery(withCurrentUser(ServicesView))), [])

app/kubernetes/views/resource-pools/create/createResourcePool.js

@@ -1,10 +0,0 @@
-import angular from 'angular';
-import KubernetesCreateResourcePoolController from './createResourcePoolController';
-
-angular.module('portainer.kubernetes').component('kubernetesCreateResourcePoolView', {
-  templateUrl: './createResourcePool.html',
-  controller: KubernetesCreateResourcePoolController,
-  bindings: {
-    endpoint: '<',
-  },
-});

app/kubernetes/views/resource-pools/edit/resourcePool.html

@@ -339,7 +339,7 @@
         refresh-callback="ctrl.getIngresses"
         loading="ctrl.state.ingressesLoading"
         title-text="Ingress routes and applications"
-        title-icon="svg-route"
+        title-icon="database"
       >
       </kubernetes-resource-pool-ingresses-datatable>
     </div>