Add agent version to agent UI (#50)

Signed-off-by: Montse Ortega <mortegag@redhat.com>

apps/agent/src/common/AgentUIVersion.tsx

@@ -0,0 +1,39 @@
+import React, { useState, useEffect } from 'react';
+import type { AgentApiInterface } from "@migration-planner-ui/agent-client/apis";
+import { useInjection } from '@migration-planner-ui/ioc';
+import { Symbols } from '#/main/Symbols';
+import { StatusReply } from '@migration-planner-ui/agent-client/models';
+
+export const AgentUIVersion: React.FC = () => {
+    const agentApi = useInjection<AgentApiInterface>(Symbols.AgentApi);
+    const [versionInfo, setVersionInfo] = useState<StatusReply | null>(null);
+    const [error, setError] = useState<string | null>(null);
+
+    useEffect(() => {
+        const fetchVersion = async ():Promise<void> => {
+            try {
+                const statusReply = await agentApi.getAgentVersion();
+                setVersionInfo(statusReply);
+            } catch (err) {
+                console.error('Error fetching agent version:', err);
+                setError('Error fetching version');
+            }
+        };
+
+        fetchVersion();
+    }, [agentApi]);
+
+    if (error) {
+        return <div data-testid="agent-api-lib-version" hidden>Error: {error}</div>;
+    }
+
+    if (!versionInfo) {
+        return <div data-testid="agent-api-lib-version" hidden>Loading...</div>;
+    }
+
+    return (
+        <div data-testid="agent-api-lib-version" hidden>      
+           {versionInfo.statusInfo}
+        </div>
+    );
+};

apps/agent/src/main/Root.tsx

@@ -12,6 +12,7 @@ import {
 } from "@migration-planner-ui/ioc";
 import { router } from "./Router";
 import { Symbols } from "./Symbols";
+import { AgentUIVersion } from "#/common/AgentUIVersion";
 
 function getConfigurationBasePath(): string {
   if (import.meta.env.PROD) {
@@ -40,6 +41,7 @@ function main(): void {
       <React.StrictMode>
         <DependencyInjectionProvider container={container}>
           <React.Suspense fallback={<Spinner />}>
+            <AgentUIVersion />
             <RouterProvider router={router} />
           </React.Suspense>
         </DependencyInjectionProvider>

packages/agent-client/src/apis/AgentApi.ts

@@ -15,6 +15,7 @@ export interface AgentApiInterface {
     options?: RequestInit & { pathParams?: string[] }
   ): Promise<Either<number, CredentialsError>>;
   getStatus(options?: RequestInit): Promise<StatusReply>;
+  getAgentVersion():Promise<StatusReply>;
 }
 
 export class AgentApi implements AgentApiInterface {
@@ -59,4 +60,14 @@ export class AgentApi implements AgentApiInterface {
       return [null, error];
     }
   }
+
+  async getAgentVersion(): Promise<StatusReply> {
+    const request = new Request(this.configuration.basePath + "/version", {
+      method: "GET"
+    });
+
+    const response = await fetch(request);
+    const statusReply = (await response.json()) as StatusReply;
+    return statusReply;
+  }
 }