enhancement on backend info

machines/app.ts

@@ -16,10 +16,12 @@ import { createRequestMachine, requestMachine } from './request';
 import { createScanMachine, scanMachine } from './scan';
 import { pure, respond } from 'xstate/lib/actions';
 import { AppServices } from '../shared/GlobalContext';
+import { request } from '../shared/request';
 
 const model = createModel(
   {
     info: {} as AppInfo,
+    backendInfo: {} as BackendInfo,
     serviceRefs: {} as AppServices,
   },
   {
@@ -31,6 +33,7 @@ const model = createModel(
       REQUEST_DEVICE_INFO: () => ({}),
       READY: (data?: unknown) => ({ data }),
       APP_INFO_RECEIVED: (info: AppInfo) => ({ info }),
+      BACKEND_INFO_RECEIVED: (info: BackendInfo) => ({ info }),
     },
   }
 );
@@ -66,11 +69,22 @@ export const appMachine = model.createMachine(
             },
             on: {
               APP_INFO_RECEIVED: {
-                target: '#ready',
+                target: 'devinfo',
                 actions: ['setAppInfo'],
               },
             },
           },
+          devinfo: {
+            invoke: {
+              src: 'getBackendInfo',
+            },
+            on: {
+              BACKEND_INFO_RECEIVED: {
+                target: '#ready',
+                actions: ['setBackendInfo'],
+              },
+            },
+          },
         },
       },
       ready: {
@@ -197,6 +211,10 @@ export const appMachine = model.createMachine(
       setAppInfo: model.assign({
         info: (_, event) => event.info,
       }),
+
+      setBackendInfo: model.assign({
+        backendInfo: (_, event) => event.info,
+      }),
     },
 
     services: {
@@ -205,10 +223,14 @@ export const appMachine = model.createMachine(
           deviceId: getDeviceId(),
           deviceName: await getDeviceName(),
         };
-
         callback(model.events.APP_INFO_RECEIVED(appInfo));
       },
 
+      getBackendInfo: () => async (callback) => {
+        const backendInfo = await request('GET', '/info');
+        callback(model.events.BACKEND_INFO_RECEIVED(backendInfo));
+      },
+
       checkFocusState: () => (callback) => {
         const changeHandler = (newState: AppStateStatus) => {
           switch (newState) {
@@ -256,6 +278,14 @@ interface AppInfo {
   deviceId: string;
   deviceName: string;
 }
+interface BackendInfo {
+  application: {
+    name: string;
+    version: string;
+  };
+  build: object;
+  config: object;
+}
 
 type State = StateFrom<typeof appMachine>;
 
@@ -263,6 +293,10 @@ export function selectAppInfo(state: State) {
   return state.context.info;
 }
 
+export function selectBackendInfo(state: State) {
+  return state.context.backendInfo;
+}
+
 export function selectIsReady(state: State) {
   return state.matches('ready');
 }

machines/app.typegen.ts

@@ -4,6 +4,7 @@ export interface Typegen0 {
   '@@xstate/typegen': true;
   'eventsCausingActions': {
     setAppInfo: 'APP_INFO_RECEIVED';
+    setBackendInfo: 'BACKEND_INFO_RECEIVED';
     requestDeviceInfo: 'REQUEST_DEVICE_INFO';
     spawnStoreActor: 'xstate.init';
     logStoreEvents: 'xstate.init';
@@ -16,6 +17,7 @@ export interface Typegen0 {
   };
   'invokeSrcNameMap': {
     getAppInfo: 'done.invoke.app.init.info:invocation[0]';
+    getBackendInfo: 'done.invoke.app.init.devinfo:invocation[0]';
     checkFocusState: 'done.invoke.app.ready.focus:invocation[0]';
     checkNetworkState: 'done.invoke.app.ready.network:invocation[0]';
   };
@@ -27,6 +29,7 @@ export interface Typegen0 {
   };
   'eventsCausingServices': {
     getAppInfo: 'READY';
+    getBackendInfo: 'APP_INFO_RECEIVED';
     checkFocusState: 'xstate.init';
     checkNetworkState: 'xstate.init';
   };
@@ -37,6 +40,7 @@ export interface Typegen0 {
     | 'init.store'
     | 'init.services'
     | 'init.info'
+    | 'init.devinfo'
     | 'ready'
     | 'ready.focus'
     | 'ready.focus.checking'
@@ -47,7 +51,7 @@ export interface Typegen0 {
     | 'ready.network.online'
     | 'ready.network.offline'
     | {
-        init?: 'store' | 'services' | 'info';
+        init?: 'store' | 'services' | 'info' | 'devinfo';
         ready?:
           | 'focus'
           | 'network'

screens/Profile/ProfileScreen.tsx

@@ -36,7 +36,6 @@ const LanguageSetting: React.FC = () => {
 export const ProfileScreen: React.FC<MainRouteProps> = (props) => {
   const { t } = useTranslation('ProfileScreen');
   const controller = useProfileScreen(props);
-
   return (
     <Column fill padding="24 0" backgroundColor={Colors.LightGrey}>
       <MessageOverlay
@@ -84,12 +83,19 @@ export const ProfileScreen: React.FC<MainRouteProps> = (props) => {
       </ListItem>
       <Text
         weight="semibold"
-        margin="32"
+        margin="32 0 0 0"
         align="center"
         size="smaller"
         color={Colors.Grey}>
         Version: {getVersion()}
       </Text>
+      <Text weight="semibold" align="center" size="smaller" color={Colors.Grey}>
+        {controller.backendInfo.application.name}:{' '}
+        {controller.backendInfo.application.version}
+      </Text>
+      <Text weight="semibold" align="center" size="smaller" color={Colors.Grey}>
+        MOSIP: {controller.backendInfo.config['mosip.host']}
+      </Text>
     </Column>
   );
 };

screens/Profile/ProfileScreenController.ts

@@ -1,6 +1,7 @@
 import { useMachine, useSelector } from '@xstate/react';
 import { useContext, useEffect, useState } from 'react';
 import * as LocalAuthentication from 'expo-local-authentication';
+import { selectBackendInfo } from '../../machines/app';
 import {
   AuthEvents,
   selectBiometrics,
@@ -92,6 +93,7 @@ export function useProfileScreen({ navigation }: MainRouteProps) {
   return {
     alertMsg,
     hideAlert,
+    backendInfo: useSelector(appService, selectBackendInfo),
     name: useSelector(settingsService, selectName),
     vcLabel: useSelector(settingsService, selectVcLabel),
     isBiometricUnlockEnabled: useSelector(