Convert mapper to functional component

Signed-off-by: Radoslaw Szwajkowski <[email protected]>

client/src/app/components/Icons/taskStateToIcon.tsx → client/src/app/components/Icons/TaskStateIcon.tsx

@@ -1,5 +1,5 @@
 import { TaskState } from "@app/api/models";
-import React from "react";
+import React, { FC } from "react";
 import { Icon } from "@patternfly/react-core";
 import {
   CheckCircleIcon,
@@ -12,7 +12,7 @@ import {
   PauseCircleIcon,
 } from "@patternfly/react-icons";
 
-export const taskStateToIcon = (state?: TaskState) => {
+export const TaskStateIcon: FC<{ state?: TaskState }> = ({ state }) => {
   switch (state) {
     case "not supported":
     case "No task":

client/src/app/components/Icons/index.ts

@@ -1,4 +1,4 @@
 export * from "./OptionalTooltip";
 export * from "./IconedStatus";
 export * from "./IconWithLabel";
-export * from "./taskStateToIcon";
+export * from "./TaskStateIcon";

client/src/app/components/task-manager/TaskManagerDrawer.tsx

@@ -26,7 +26,7 @@ import { useTaskManagerContext } from "./TaskManagerContext";
 import { useServerTasks } from "@app/queries/tasks";
 
 import "./TaskManagerDrawer.css";
-import { taskStateToIcon } from "../Icons";
+import { TaskStateIcon } from "../Icons";
 
 /** A version of `Task` specific for the task manager drawer components */
 interface TaskManagerTask {
@@ -121,7 +121,9 @@ export const TaskManagerDrawer: React.FC<TaskManagerDrawerProps> = forwardRef(
 TaskManagerDrawer.displayName = "TaskManagerDrawer";
 
 const TaskStateToIcon: React.FC<{ taskState: TaskState }> = ({ taskState }) => (
-  <Tooltip content={taskState}>{taskStateToIcon(taskState)}</Tooltip>
+  <Tooltip content={taskState}>
+    <TaskStateIcon state={taskState} />
+  </Tooltip>
 );
 
 const TaskItem: React.FC<{

client/src/app/pages/tasks/tasks-page.tsx

@@ -43,7 +43,7 @@ import { TablePersistenceKeyPrefix } from "@app/Constants";
 import { useSelectionState } from "@migtools/lib-ui";
 import { useServerTasks } from "@app/queries/tasks";
 import { Task } from "@app/api/models";
-import { IconWithLabel, taskStateToIcon } from "@app/components/Icons";
+import { IconWithLabel, TaskStateIcon } from "@app/components/Icons";
 import { ManageColumnsToolbar } from "../applications/applications-table/components/manage-columns-toolbar";
 import dayjs from "dayjs";
 import { useTaskActions } from "./useTaskActions";
@@ -226,7 +226,7 @@ export const TasksPage: React.FC = () => {
     kind: kind ?? addon,
     state: (
       <IconWithLabel
-        icon={taskStateToIcon(state)}
+        icon={<TaskStateIcon state={state} />}
         label={
           <Link
             to={formatPath(Paths.taskDetails, {