refactor(icons): replace fa icons [EE-4459] (#7907)

refactor(icons): remove fontawesome EE-4459

refactor(icon) replace feather with lucide EE-4472

app/react/edge/components/EdgeScriptForm/OsSelector.tsx

@@ -1,4 +1,9 @@
+import { LayoutGrid } from 'lucide-react';
+
+import Linux from '@/assets/ico/linux.svg?c';
+
 import { ButtonSelector } from '@@/form-components/ButtonSelector/ButtonSelector';
+import { Icon } from '@@/Icon';
 
 import { OS } from './types';
 
@@ -20,7 +25,7 @@ export function OsSelector({ onChange, value }: Props) {
               value: 'linux',
               label: (
                 <>
-                  <i className="fab fa-linux space-right" aria-hidden="true" />
+                  <Icon icon={Linux} className="mr-1" />
                   Linux
                 </>
               ),
@@ -29,10 +34,7 @@ export function OsSelector({ onChange, value }: Props) {
               value: 'win',
               label: (
                 <>
-                  <i
-                    className="fab fa-windows space-right"
-                    aria-hidden="true"
-                  />
+                  <Icon icon={LayoutGrid} className="mr-1" />
                   Windows
                 </>
               ),

app/react/edge/edge-devices/ListView/EdgeDevicesDatatable/AMTDevicesDatatable/columns/power-state.tsx

@@ -1,8 +1,11 @@
 import { CellProps, Column } from 'react-table';
 import clsx from 'clsx';
+import { Settings } from 'lucide-react';
 
 import { Device } from '@/portainer/hostmanagement/open-amt/model';
 
+import { Icon } from '@@/Icon';
+
 import { useRowContext } from './RowContext';
 
 enum PowerState {
@@ -48,7 +51,11 @@ export function PowerStateCell({
       >
         {parsePowerState(device.powerState)}
       </span>
-      <span>{isLoading && <i className="fa fa-cog fa-spin space-left" />}</span>
+      <span>
+        {isLoading && (
+          <Icon icon={Settings} className="animate-spin-slow !ml-1" />
+        )}
+      </span>
     </>
   );
 }

app/react/edge/edge-devices/ListView/EdgeDevicesDatatable/EdgeDevicesDatatable.tsx

@@ -1,6 +1,6 @@
 import _ from 'lodash';
 import { useStore } from 'zustand';
-import { Box } from 'react-feather';
+import { Box } from 'lucide-react';
 import { useState } from 'react';
 
 import { EdgeTypes, Environment } from '@/react/portainer/environments/types';

app/react/edge/edge-devices/ListView/EdgeDevicesDatatable/EdgeDevicesDatatableActions.tsx

@@ -1,4 +1,5 @@
 import { useRouter } from '@uirouter/react';
+import { Plus, Trash2, Link as LinkIcon } from 'lucide-react';
 
 import type { Environment } from '@/react/portainer/environments/types';
 import {
@@ -40,13 +41,12 @@ export function EdgeDevicesDatatableActions({
         disabled={selectedItems.length < 1}
         color="danger"
         onClick={() => onDeleteEdgeDeviceClick()}
-        icon="trash-2"
-        featherIcon
+        icon={Trash2}
       >
         Remove
       </Button>
 
-      <Button onClick={() => onAddNewDeviceClick()} icon="plus" featherIcon>
+      <Button onClick={() => onAddNewDeviceClick()} icon={Plus}>
         Add Device
       </Button>
 
@@ -54,8 +54,7 @@ export function EdgeDevicesDatatableActions({
         <Button
           disabled={selectedItems.length !== 1}
           onClick={() => onAssociateOpenAMTClick(selectedItems)}
-          icon="link"
-          featherIcon
+          icon={LinkIcon}
         >
           Associate with OpenAMT
         </Button>