Merge pull request #1859 from oasisprotocol/mz/roflSearch

Include ROFL apps in search results

Author: buberdds

.changelog/1859.bugfix.md

@@ -0,0 +1 @@
+Include ROFL apps in search results

src/app/components/Rofl/RoflAppsList.tsx

@@ -1,7 +1,8 @@
 import { FC } from 'react'
 import { useTranslation } from 'react-i18next'
 import { RoflApp } from '../../../oasis-nexus/api'
-import { Table, TableCellAlign, TableColProps } from '..//Table'
+import { useScreenSize } from '../../hooks/useScreensize'
+import { Table, TableCellAlign, TableColProps } from '../Table'
 import { TablePaginationProps } from '../Table/TablePagination'
 import { TableHeaderAge } from '../TableHeaderAge'
 import { TableCellAge } from '../TableCellAge'
@@ -17,12 +18,18 @@ type RoflAppsListProps = {
 
 export const RoflAppsList: FC<RoflAppsListProps> = ({ isLoading, limit, pagination, apps }) => {
   const { t } = useTranslation()
+  const { isTablet } = useScreenSize()
+
   const tableColumns: TableColProps[] = [
     { key: 'order', content: '' },
     { key: 'name', content: t('common.name') },
     { key: 'status', content: t('common.status') },
     { key: 'id', content: t('rofl.appId') },
-    { key: 'instances', content: t('rofl.instances'), align: TableCellAlign.Right },
+    {
+      key: 'instances',
+      content: isTablet ? t('rofl.instances') : t('rofl.activeInstances'),
+      align: TableCellAlign.Right,
+    },
     { key: 'created', content: t('rofl.created'), align: TableCellAlign.Right },
     {
       key: 'lastActivity',
@@ -39,8 +46,8 @@ export const RoflAppsList: FC<RoflAppsListProps> = ({ isLoading, limit, paginati
           key: 'order',
         },
         {
-          content: app.metadata?.name ? (
-            <RoflAppLink id={app.id} name={app.metadata?.name} network={app.network} />
+          content: app?.metadata['net.oasis.rofl.name'] ? (
+            <RoflAppLink id={app.id} name={app?.metadata['net.oasis.rofl.name']} network={app.network} />
           ) : (
             t('rofl.nameNotProvided')
           ),

src/app/components/Search/search-utils.ts

@@ -5,6 +5,7 @@ import {
   isValidTxHash,
   isValidOasisAddress,
   isValidEthAddress,
+  isValidRoflAppId,
 } from '../../utils/helpers'
 import { RouteUtils, SpecifiedPerEnabledLayer } from '../../utils/route-utils'
 import { AppError, AppErrors } from '../../../types/errors'
@@ -133,6 +134,11 @@ export const validateAndNormalize = {
       return searchTerm.replace(/\s/g, '').toLowerCase()
     }
   },
+  roflApp: (searchTerm: string) => {
+    if (isValidRoflAppId(searchTerm.replace(/\s/g, '').toLowerCase())) {
+      return searchTerm.replace(/\s/g, '').toLowerCase()
+    }
+  },
   evmAccount: (searchTerm: string): string | undefined => {
     if (isValidEthAddress(`0x${searchTerm}`)) {
       return `0x${searchTerm.toLowerCase()}`