fix(edge): filtering of edge devices [EE-3210] (#7077)

* fix(edge): filtering of edge devices [EE-3210]

fixes [EE-3210]

changes:
- replaces `edgeDeviceFilter` with two filters:
	- `edgeDevice`
	- `edgeDeviceUntrusted`

these filters will only apply to the edge endpoints in the query (so it's possible to get both regular endpoints and edge devices).

if `edgeDevice` is true, will filter out edge agents which are not an edge device.
			false, will filter out edge devices

`edgeDeviceUntrusted` applies only when `edgeDevice` is true. then false (default) will hide the untrusted edge devices, true will show only untrusted edge devices.

fix(edge/job-create): retrieve only trusted endpoints + fix endpoint selector pagination limits onChange

fix(endpoint-groups): remove listing of untrusted edge envs (aka in waiting room)

refactor(endpoints): move filter to another function

feat(endpoints): separate edge filters

refactor(environments): change getEnv api

refactor(endpoints): use single getEnv

feat(groups): show error when failed loading envs

style(endpoints): remove unused endpointsByGroup

* chore(deps): update go to 1.18

* fix(endpoint): filter out untrusted by default

* fix(edge): show correct endpoints

* style(endpoints): fix typo

* fix(endpoints): fix swagger

* fix(admin): use new getEnv function

Co-authored-by: LP B <xAt0mZ@users.noreply.github.com>

app/edge/EdgeDevices/EdgeDevicesView/EdgeDevicesDatatable/EdgeDevicesDatatableContainer.tsx

@@ -1,7 +1,7 @@
 import { useState } from 'react';
 
 import { useEnvironmentList } from '@/portainer/environments/queries/useEnvironmentList';
-import { Environment } from '@/portainer/environments/types';
+import { EdgeTypes, Environment } from '@/portainer/environments/types';
 import { useDebounce } from '@/portainer/hooks/useDebounce';
 
 import { useSearchBarState } from '@@/datatables/SearchBar';
@@ -89,8 +89,9 @@ function Loader({ children, storageKey }: LoaderProps) {
 
   const { environments, isLoading, totalCount } = useEnvironmentList(
     {
-      edgeDeviceFilter: 'trusted',
+      edgeDevice: true,
       search: debouncedSearchValue,
+      types: EdgeTypes,
       ...pagination,
     },
     settings.autoRefreshRate * 1000

app/edge/EdgeDevices/WaitingRoomView/WaitingRoomView.tsx

@@ -2,6 +2,7 @@ import { useRouter } from '@uirouter/react';
 
 import { useEnvironmentList } from '@/portainer/environments/queries/useEnvironmentList';
 import { r2a } from '@/react-tools/react2angular';
+import { EdgeTypes } from '@/portainer/environments/types';
 
 import { InformationPanel } from '@@/InformationPanel';
 import { TextTip } from '@@/Tip/TextTip';
@@ -15,7 +16,9 @@ export function WaitingRoomView() {
   const storageKey = 'edge-devices-waiting-room';
   const router = useRouter();
   const { environments, isLoading, totalCount } = useEnvironmentList({
-    edgeDeviceFilter: 'untrusted',
+    edgeDevice: true,
+    edgeDeviceUntrusted: true,
+    types: EdgeTypes,
   });
 
   if (process.env.PORTAINER_EDITION !== 'BE') {

app/edge/components/group-form/groupFormController.js

@@ -1,10 +1,11 @@
 import _ from 'lodash-es';
 import { confirmAsync } from '@/portainer/services/modal.service/confirm';
+import { EdgeTypes } from '@/portainer/environments/types';
+import { getEnvironments } from '@/portainer/environments/environment.service';
 
 export class EdgeGroupFormController {
   /* @ngInject */
-  constructor(EndpointService, $async, $scope) {
-    this.EndpointService = EndpointService;
+  constructor($async, $scope) {
     this.$async = $async;
     this.$scope = $scope;
 
@@ -19,7 +20,6 @@ export class EdgeGroupFormController {
     };
 
     this.associateEndpoint = this.associateEndpoint.bind(this);
-    this.dissociateEndpointAsync = this.dissociateEndpointAsync.bind(this);
     this.dissociateEndpoint = this.dissociateEndpoint.bind(this);
     this.getDynamicEndpointsAsync = this.getDynamicEndpointsAsync.bind(this);
     this.getDynamicEndpoints = this.getDynamicEndpoints.bind(this);
@@ -49,30 +49,28 @@ export class EdgeGroupFormController {
   }
 
   dissociateEndpoint(endpoint) {
-    return this.$async(this.dissociateEndpointAsync, endpoint);
-  }
+    return this.$async(async () => {
+      const confirmed = await confirmAsync({
+        title: 'Confirm action',
+        message: 'Removing the environment from this group will remove its corresponding edge stacks',
+        buttons: {
+          cancel: {
+            label: 'Cancel',
+            className: 'btn-default',
+          },
+          confirm: {
+            label: 'Confirm',
+            className: 'btn-primary',
+          },
+        },
+      });
 
-  async dissociateEndpointAsync(endpoint) {
-    const confirmed = await confirmAsync({
-      title: 'Confirm action',
-      message: 'Removing the environment from this group will remove its corresponding edge stacks',
-      buttons: {
-        cancel: {
-          label: 'Cancel',
-          className: 'btn-default',
-        },
-        confirm: {
-          label: 'Confirm',
-          className: 'btn-primary',
-        },
-      },
+      if (!confirmed) {
+        return;
+      }
+
+      this.model.Endpoints = _.filter(this.model.Endpoints, (id) => id !== endpoint.Id);
     });
-
-    if (!confirmed) {
-      return;
-    }
-
-    this.model.Endpoints = _.filter(this.model.Endpoints, (id) => id !== endpoint.Id);
   }
 
   getDynamicEndpoints() {
@@ -82,9 +80,9 @@ export class EdgeGroupFormController {
   async getDynamicEndpointsAsync() {
     const { pageNumber, limit, search } = this.endpoints.state;
     const start = (pageNumber - 1) * limit + 1;
-    const query = { search, types: [4, 7], tagIds: this.model.TagIds, tagsPartialMatch: this.model.PartialMatch };
+    const query = { search, types: EdgeTypes, tagIds: this.model.TagIds, tagsPartialMatch: this.model.PartialMatch };
 
-    const response = await this.EndpointService.endpoints(start, limit, query);
+    const response = await getEnvironments({ start, limit, query });
 
     const totalCount = parseInt(response.totalCount, 10);
     this.endpoints.value = response.value;

app/edge/views/edge-jobs/edgeJob/edgeJobController.js

@@ -1,8 +1,9 @@
 import _ from 'lodash-es';
+import { getEnvironments } from '@/portainer/environments/environment.service';
 
 export class EdgeJobController {
   /* @ngInject */
-  constructor($async, $q, $state, $window, ModalService, EdgeJobService, EndpointService, FileSaver, GroupService, HostBrowserService, Notifications, TagService) {
+  constructor($async, $q, $state, $window, ModalService, EdgeJobService, FileSaver, GroupService, HostBrowserService, Notifications, TagService) {
     this.state = {
       actionInProgress: false,
       showEditorTab: false,
@@ -15,7 +16,6 @@ export class EdgeJobController {
     this.$window = $window;
     this.ModalService = ModalService;
     this.EdgeJobService = EdgeJobService;
-    this.EndpointService = EndpointService;
     this.FileSaver = FileSaver;
     this.GroupService = GroupService;
     this.HostBrowserService = HostBrowserService;
@@ -114,7 +114,7 @@ export class EdgeJobController {
     const results = await this.EdgeJobService.jobResults(id);
     if (results.length > 0) {
       const endpointIds = _.map(results, (result) => result.EndpointId);
-      const endpoints = await this.EndpointService.endpoints(undefined, undefined, { endpointIds });
+      const endpoints = await getEnvironments({ query: { endpointIds } });
       this.results = this.associateEndpointsToResults(results, endpoints.value);
     } else {
       this.results = results;
@@ -155,7 +155,7 @@ export class EdgeJobController {
 
       if (results.length > 0) {
         const endpointIds = _.map(results, (result) => result.EndpointId);
-        const endpoints = await this.EndpointService.endpoints(undefined, undefined, { endpointIds });
+        const endpoints = await getEnvironments({ query: { endpointIds } });
         this.results = this.associateEndpointsToResults(results, endpoints.value);
       } else {
         this.results = results;

app/edge/views/edge-stacks/editEdgeStackView/editEdgeStackViewController.js

@@ -1,15 +1,15 @@
 import _ from 'lodash-es';
+import { getEnvironments } from '@/portainer/environments/environment.service';
 
 export class EditEdgeStackViewController {
   /* @ngInject */
-  constructor($async, $state, $window, ModalService, EdgeGroupService, EdgeStackService, EndpointService, Notifications) {
+  constructor($async, $state, $window, ModalService, EdgeGroupService, EdgeStackService, Notifications) {
     this.$async = $async;
     this.$state = $state;
     this.$window = $window;
     this.ModalService = ModalService;
     this.EdgeGroupService = EdgeGroupService;
     this.EdgeStackService = EdgeStackService;
-    this.EndpointService = EndpointService;
     this.Notifications = Notifications;
 
     this.stack = null;
@@ -99,8 +99,8 @@ export class EditEdgeStackViewController {
 
   async getPaginatedEndpointsAsync(lastId, limit, search) {
     try {
-      const query = { search, types: [4, 7], endpointIds: this.stackEndpointIds };
-      const { value, totalCount } = await this.EndpointService.endpoints(lastId, limit, query);
+      const query = { search, endpointIds: this.stackEndpointIds };
+      const { value, totalCount } = await getEnvironments({ start: lastId, limit, query });
       const endpoints = _.map(value, (endpoint) => {
         const status = this.stack.Status[endpoint.Id];
         endpoint.Status = status;