From 79099ab1235598a050c59aa6d99a1b56a1b83331 Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Thu, 9 Nov 2023 18:39:32 +0700
Subject: [PATCH] fix: module search and abi

---
 .../components/modules/ModuleLists.tsx        | 69 +++++++++++--------
 .../components/modules/ModuleListsBody.tsx    | 46 ++++---------
 src/lib/pages/account-details/index.tsx       |  2 +-
 src/lib/styles/theme/components/form.ts       |  2 +-
 src/lib/utils/abi.ts                          | 19 +++--
 5 files changed, 67 insertions(+), 71 deletions(-)

diff --git a/src/lib/pages/account-details/components/modules/ModuleLists.tsx b/src/lib/pages/account-details/components/modules/ModuleLists.tsx
index 441f3a2e0..62c819254 100644
--- a/src/lib/pages/account-details/components/modules/ModuleLists.tsx
+++ b/src/lib/pages/account-details/components/modules/ModuleLists.tsx
@@ -1,8 +1,10 @@
 import { Flex } from "@chakra-ui/react";
+import { useState } from "react";
 
 import { useMobile } from "lib/app-provider";
 import { CustomIcon } from "lib/components/icon";
-import { TableTitle } from "lib/components/table";
+import InputWithIcon from "lib/components/InputWithIcon";
+import { TableTitle, ViewMore } from "lib/components/table";
 import { type IndexedModule } from "lib/services/move/moduleService";
 import type { MoveAccountAddr, Option } from "lib/types";
 
@@ -23,41 +25,52 @@ export const ModuleLists = ({
   isLoading,
   onViewMore,
 }: ModuleListsProps) => {
+  const [keyword, setKeyword] = useState("");
   const isMobile = useMobile();
   const isMobileOverview = isMobile && !!onViewMore;
-  return (
+  return isMobileOverview ? (
+    <Flex
+      justify="space-between"
+      w="full"
+      bg="gray.900"
+      borderRadius="8px"
+      p={4}
+      onClick={onViewMore}
+    >
+      <TableTitle title="Modules" count={totalCount} mb={0} />
+      <CustomIcon name="chevron-right" color="gray.600" />
+    </Flex>
+  ) : (
     <Flex
       direction="column"
       mt={{ base: 4, md: 8 }}
       mb={{ base: 0, md: 8 }}
       width="full"
+      gap={6}
     >
-      {isMobileOverview ? (
-        <Flex
-          justify="space-between"
-          w="full"
-          bg="gray.900"
-          borderRadius="8px"
-          p={4}
-          onClick={onViewMore}
-        >
-          <TableTitle title="Modules" count={totalCount} mb={0} />
-          <CustomIcon name="chevron-right" color="gray.600" />
-        </Flex>
-      ) : (
-        <>
-          <TableTitle
-            title="Module Instances"
-            helperText="Modules are ‘smart contracts’ deployed by this account"
-            count={totalCount}
-          />
-          <ModuleListsBody
-            selectedAddress={selectedAddress}
-            modules={modules}
-            isLoading={isLoading}
-            onViewMore={onViewMore}
-          />
-        </>
+      <TableTitle
+        title="Module Instances"
+        helperText="Modules are ‘smart contracts’ deployed by this account"
+        count={totalCount}
+        mb={0}
+      />
+      {!onViewMore && (
+        <InputWithIcon
+          placeholder="Search with Module Name..."
+          value={keyword}
+          onChange={(e) => setKeyword(e.target.value)}
+          action="execute-message-search"
+        />
+      )}
+      <ModuleListsBody
+        selectedAddress={selectedAddress}
+        keyword={keyword}
+        modules={modules}
+        isLoading={isLoading}
+        onViewMore={onViewMore}
+      />
+      {onViewMore && totalCount && totalCount > 9 && (
+        <ViewMore onClick={onViewMore} />
       )}
     </Flex>
   );
diff --git a/src/lib/pages/account-details/components/modules/ModuleListsBody.tsx b/src/lib/pages/account-details/components/modules/ModuleListsBody.tsx
index 3563f1c1a..ab1a85d96 100644
--- a/src/lib/pages/account-details/components/modules/ModuleListsBody.tsx
+++ b/src/lib/pages/account-details/components/modules/ModuleListsBody.tsx
@@ -1,18 +1,17 @@
-import { Box, SimpleGrid } from "@chakra-ui/react";
-import { useMemo, useState } from "react";
+import { SimpleGrid } from "@chakra-ui/react";
+import { useMemo } from "react";
 
 import { ErrorFetching } from "../ErrorFetching";
 import { useInternalNavigate } from "lib/app-provider";
-import InputWithIcon from "lib/components/InputWithIcon";
 import { Loading } from "lib/components/Loading";
 import { ModuleCard } from "lib/components/module";
 import { EmptyState } from "lib/components/state";
-import { ViewMore } from "lib/components/table";
 import type { IndexedModule } from "lib/services/move/moduleService";
 import type { MoveAccountAddr, Option } from "lib/types";
 
 interface ModuleListsBodyProps {
   selectedAddress: MoveAccountAddr;
+  keyword: string;
   modules: Option<IndexedModule[]>;
   isLoading: boolean;
   onViewMore?: () => void;
@@ -20,12 +19,12 @@ interface ModuleListsBodyProps {
 
 export const ModuleListsBody = ({
   selectedAddress,
+  keyword,
   modules,
   isLoading,
   onViewMore,
 }: ModuleListsBodyProps) => {
   const navigate = useInternalNavigate();
-  const [keyword, setKeyword] = useState("");
 
   const filteredModules = useMemo(() => {
     if (!keyword) return modules;
@@ -58,33 +57,18 @@ export const ModuleListsBody = ({
       />
     );
   return (
-    <div>
-      {!onViewMore && (
-        <Box mb={8}>
-          <InputWithIcon
-            placeholder="Search with Module Name..."
-            value={keyword}
-            onChange={(e) => setKeyword(e.target.value)}
-            action="execute-message-search"
+    <SimpleGrid columns={{ sm: 1, md: 2, lg: 3 }} spacing={4}>
+      {(onViewMore ? filteredModules.slice(0, 9) : filteredModules).map(
+        (item) => (
+          <ModuleCard
+            key={item.moduleName}
+            selectedAddress={selectedAddress}
+            module={item}
+            selectedModule={undefined}
+            setSelectedModule={handleOnSelect}
           />
-        </Box>
+        )
       )}
-      <SimpleGrid columns={{ sm: 1, md: 2, lg: 3 }} spacing={4} mb={4}>
-        {(onViewMore ? filteredModules.slice(0, 9) : filteredModules).map(
-          (item) => (
-            <ModuleCard
-              key={item.moduleName}
-              selectedAddress={selectedAddress}
-              module={item}
-              selectedModule={undefined}
-              setSelectedModule={handleOnSelect}
-            />
-          )
-        )}
-      </SimpleGrid>
-      {onViewMore && filteredModules.length > 9 && (
-        <ViewMore onClick={onViewMore} />
-      )}
-    </div>
+    </SimpleGrid>
   );
 };
diff --git a/src/lib/pages/account-details/index.tsx b/src/lib/pages/account-details/index.tsx
index c4634f810..185454876 100644
--- a/src/lib/pages/account-details/index.tsx
+++ b/src/lib/pages/account-details/index.tsx
@@ -404,8 +404,8 @@ const AccountDetailsBody = ({
           </TabPanel>
           <TabPanel p={0}>
             <ModuleLists
-              selectedAddress={accountAddress}
               totalCount={modulesData?.length}
+              selectedAddress={accountAddress}
               modules={modulesData}
               isLoading={isModulesLoading}
             />
diff --git a/src/lib/styles/theme/components/form.ts b/src/lib/styles/theme/components/form.ts
index 6885f926e..618a33983 100644
--- a/src/lib/styles/theme/components/form.ts
+++ b/src/lib/styles/theme/components/form.ts
@@ -10,7 +10,7 @@ const errorMain = "error.main";
 const labelStyles = {
   top: 0,
   left: 0,
-  zIndex: 2,
+  zIndex: 1,
   position: "absolute",
   pointerEvents: "none",
   mx: 3,
diff --git a/src/lib/utils/abi.ts b/src/lib/utils/abi.ts
index 897aabd07..c17487be5 100644
--- a/src/lib/utils/abi.ts
+++ b/src/lib/utils/abi.ts
@@ -55,16 +55,15 @@ export const getAbiInitialData = (length: number) =>
 // ------------------------------------------//
 // -----------------MOVE ARGS----------------//
 // ------------------------------------------//
-export const getArgType = (argType: string) => {
-  if (argType === "0x1::string::String") return BCS.STRING;
-  if (argType.startsWith("0x1::option::Option")) return BCS.OPTION;
-  if (argType.startsWith("0x1::object::Object")) return BCS.OBJECT;
-  if (argType === "0x1::fixed_point32::FixedPoint32") return BCS.FIXED_POINT32;
-  if (argType === "0x1::fixed_point64::FixedPoint64") return BCS.FIXED_POINT64;
-  if (argType === "0x1::decimal128::Decimal128") return BCS.DECIMAL128;
-  if (argType === "0x1::decimal256::Decimal256") return BCS.DECIMAL256;
-  return argType;
-};
+export const getArgType = (argType: string) =>
+  argType
+    .replace("0x1::string::String", BCS.STRING)
+    .replace("0x1::option::Option", BCS.OPTION)
+    .replace("0x1::object::Object", BCS.OBJECT)
+    .replace("0x1::fixed_point32::FixedPoint32", BCS.FIXED_POINT32)
+    .replace("0x1::fixed_point64::FixedPoint64", BCS.FIXED_POINT64)
+    .replace("0x1::decimal128::Decimal128", BCS.DECIMAL128)
+    .replace("0x1::decimal256::Decimal256", BCS.DECIMAL256);
 
 const getArgValue = ({
   type,