feat(home): move edge device to view [EE-4559] (#8189)

Co-authored-by: matias.spinarolli <matias.spinarolli@portainer.io>

app/portainer/__module.js

@@ -175,7 +175,10 @@ angular
 
       var endpoint = {
         name: 'portainer.endpoints.endpoint',
-        url: '/:id',
+        url: '/:id?redirectTo',
+        params: {
+          redirectTo: '',
+        },
         views: {
           'content@': {
             templateUrl: './views/endpoints/edit/endpoint.html',

app/portainer/components/datatables/datatable.css

@@ -51,7 +51,7 @@
 
 .datatable .searchBar {
   border: 1px solid var(--border-searchbar);
-  background: var(--bg-searchbar) !important;
+  background: var(--bg-searchbar);
   border-radius: 5px;
   padding: 4px 10px;
   font-size: 14px;
@@ -64,10 +64,9 @@
 }
 
 .toolBar .searchBar {
-  flex: right;
   margin-right: 10px;
-  height: 30px;
   display: inline-flex;
+  min-height: 30px;
 }
 
 .datatable .searchBar input[type='text'] {
@@ -112,12 +111,15 @@
 
 .datatable .footer .paginationControls {
   float: right;
-  margin: 10px 15px 5px 0;
+  margin: 10px 0 5px 0;
 }
 
 .datatable .footer .paginationControls .limitSelector {
   font-size: 12px;
-  margin-right: 15px;
+}
+
+.datatable .footer .paginationControls .limitSelector:not(:last-child) {
+  margin-right: 10px;
 }
 
 .datatable .footer .paginationControls .pagination {

app/portainer/helpers/endpointHelper.js

@@ -8,10 +8,6 @@ function findAssociatedGroup(endpoint, groups) {
 }
 
 export default class EndpointHelper {
-  static isLocalEndpoint(endpoint) {
-    return endpoint.URL.includes('unix://') || endpoint.URL.includes('npipe://') || endpoint.Type === PortainerEndpointTypes.KubernetesLocalEnvironment;
-  }
-
   static isDockerEndpoint(endpoint) {
     return [PortainerEndpointTypes.DockerEnvironment, PortainerEndpointTypes.AgentOnDockerEnvironment, PortainerEndpointTypes.EdgeAgentOnDockerEnvironment].includes(endpoint.Type);
   }

app/portainer/hostmanagement/open-amt/model.ts

@@ -1,40 +0,0 @@
-export interface OpenAMTConfiguration {
-  enabled: boolean;
-  mpsServer: string;
-  mpsUser: string;
-  mpsPassword: string;
-  domainName: string;
-  certFileName: string;
-  certFileContent: string;
-  certFilePassword: string;
-}
-
-export interface AMTInformation {
-  uuid: string;
-  amt: string;
-  buildNumber: string;
-  controlMode: string;
-  dnsSuffix: string;
-  rawOutput: string;
-}
-
-export interface AuthorizationResponse {
-  server: string;
-  token: string;
-}
-
-export interface DeviceFeatures {
-  ider: boolean;
-  kvm: boolean;
-  sol: boolean;
-  redirection: boolean;
-  userConsent: string;
-}
-
-export type Device = {
-  guid: string;
-  hostname: string;
-  powerState: number;
-  connectionStatus: boolean;
-  features?: DeviceFeatures;
-};

app/portainer/hostmanagement/open-amt/open-amt.service.ts

@@ -1,13 +1,11 @@
 import axios, { parseAxiosError } from '@/portainer/services/axios';
 import { EnvironmentId } from '@/react/portainer/environments/types';
-
 import {
   OpenAMTConfiguration,
   AMTInformation,
   AuthorizationResponse,
-  Device,
   DeviceFeatures,
-} from './model';
+} from '@/react/edge/edge-devices/open-amt/types';
 
 const BASE_URL = '/open_amt';
 
@@ -34,42 +32,6 @@ export async function getAMTInfo(environmentId: EnvironmentId) {
   }
 }
 
-export async function activateDevice(environmentId: EnvironmentId) {
-  try {
-    await axios.post(`${BASE_URL}/${environmentId}/activate`);
-  } catch (e) {
-    throw parseAxiosError(e as Error, 'Unable to activate device');
-  }
-}
-
-export async function getDevices(environmentId: EnvironmentId) {
-  try {
-    const { data: devices } = await axios.get<Device[]>(
-      `${BASE_URL}/${environmentId}/devices`
-    );
-
-    return devices;
-  } catch (e) {
-    throw parseAxiosError(e as Error, 'Unable to retrieve device information');
-  }
-}
-
-export async function executeDeviceAction(
-  environmentId: EnvironmentId,
-  deviceGUID: string,
-  action: string
-) {
-  try {
-    const actionPayload = { action };
-    await axios.post(
-      `${BASE_URL}/${environmentId}/devices/${deviceGUID}/action`,
-      actionPayload
-    );
-  } catch (e) {
-    throw parseAxiosError(e as Error, 'Unable to execute device action');
-  }
-}
-
 export async function enableDeviceFeatures(
   environmentId: EnvironmentId,
   deviceGUID: string,

app/portainer/hostmanagement/open-amt/queries.ts

@@ -1,18 +0,0 @@
-import { useMutation } from 'react-query';
-
-import { activateDevice } from './open-amt.service';
-
-export const activateDeviceMutationKey = [
-  'environments',
-  'open-amt',
-  'activate',
-];
-
-export function useActivateDeviceMutation() {
-  return useMutation(activateDevice, {
-    mutationKey: activateDeviceMutationKey,
-    meta: {
-      message: 'Unable to associate with OpenAMT',
-    },
-  });
-}

app/portainer/models/settings.js

@@ -38,6 +38,8 @@ export function PublicSettingsViewModel(settings) {
   this.Edge = new EdgeSettingsViewModel(settings.Edge);
   this.DefaultRegistry = settings.DefaultRegistry;
   this.ShowKomposeBuildOption = settings.ShowKomposeBuildOption;
+  this.IsAMTEnabled = settings.IsAMTEnabled;
+  this.IsFDOEnabled = settings.IsFDOEnabled;
 }
 
 export function InternalAuthSettingsViewModel(data) {

app/portainer/react/components/index.ts

@@ -98,7 +98,14 @@ export const componentsModule = angular
   )
   .component(
     'datatableSearchbar',
-    r2a(SearchBar, ['data-cy', 'onChange', 'value', 'placeholder'])
+    r2a(SearchBar, [
+      'data-cy',
+      'onChange',
+      'value',
+      'placeholder',
+      'children',
+      'className',
+    ])
   )
   .component('badgeIcon', r2a(BadgeIcon, ['icon', 'size']))
   .component(

app/portainer/services/api/dockerhubService.js

@@ -1,5 +1,5 @@
-import EndpointHelper from 'Portainer/helpers/endpointHelper';
-import { PortainerEndpointTypes } from 'Portainer/models/endpoint/models';
+import { PortainerEndpointTypes } from '@/portainer/models/endpoint/models';
+import { isLocalEnvironment } from '@/react/portainer/environments/utils';
 
 angular.module('portainer.app').factory('DockerHubService', DockerHubService);
 
@@ -10,7 +10,7 @@ function DockerHubService(Endpoints, AgentDockerhub) {
   };
 
   function checkRateLimits(endpoint, registryId) {
-    if (EndpointHelper.isLocalEndpoint(endpoint)) {
+    if (isLocalEnvironment(endpoint)) {
       return Endpoints.dockerhubLimits({ id: endpoint.Id, registryId }).$promise;
     }
 

app/portainer/views/endpoints/edit/endpointController.js

@@ -252,7 +252,7 @@ function EndpointController(
     EndpointService.updateEndpoint(endpoint.Id, payload).then(
       function success() {
         Notifications.success('Environment updated', $scope.endpoint.Name);
-        $state.go('portainer.endpoints', {}, { reload: true });
+        $state.go($state.params.redirectTo || 'portainer.endpoints', {}, { reload: true });
       },
       function error(err) {
         Notifications.error('Failure', err, 'Unable to update environment');