fix: Remove duplication in search result + small UI fixes (#516)

Co-authored-by: Taras Oliynyk <taras.oliynyk@hapi.one>

explorer/src/pages/Home/components/Jumbotron/index.tsx

@@ -10,7 +10,7 @@ import { veraxLink } from "@/constants";
 export const Jumbotron: React.FC = () => {
   return (
     <div className="w-full flex flex-col gap-6 relative">
-      <p className="self-stretch text-text-primary text-2xl not-italic font-medium leading-[102%] tracking-[-0.96px] md:text-4xl lg:text-[2.75rem] md:font-semibold dark:text-whiteDefault">
+      <p className="self-stretch text-text-primary text-[2rem] font-medium leading-[110%] lg:leading-[3rem] md:text-4xl lg:text-[2.75rem] md:font-semibold dark:text-whiteDefault">
         {t("home.title")}
       </p>
       <p className="self-stretch text-text-tertiary text-base not-italic font-normal leading-[140%] max-w-[32.5rem]">

explorer/src/pages/Module/index.tsx

@@ -53,10 +53,10 @@ export const Module = () => {
         <a
           href={`${links[chain.id].address}/${module.moduleAddress}`}
           target="_blank"
-          className="cursor-pointer hover:underline overflow-hidden text-ellipsis sm:w-fit dark:text-text-secondaryDark flex items-center gap-2"
+          className="cursor-pointer hover:underline break-all sm:w-fit dark:text-text-secondaryDark flex items-center gap-2"
         >
-          {module.moduleAddress}
-          <ArrowUpRight height="1rem" width="auto" />
+          <span className="flex-1">{module.moduleAddress}</span>
+          <ArrowUpRight height="auto" width="1rem" />
         </a>
       </div>
     </section>

explorer/src/pages/Search/components/SearchAttestations/loadAttestationList.ts

@@ -3,6 +3,7 @@ import AttestationDataMapper from "@verax-attestation-registry/verax-sdk/lib/typ
 import { ITEMS_PER_PAGE_DEFAULT } from "@/constants";
 import { ResultParseSearch } from "@/interfaces/components";
 import { isNotNullOrUndefined } from "@/utils";
+import { uniqMap } from "@/utils/searchUtils";
 
 export const loadAttestationList = async (
   attestation: AttestationDataMapper,
@@ -32,11 +33,12 @@ export const loadAttestationList = async (
     ? await attestation.findBy(ITEMS_PER_PAGE_DEFAULT, undefined, { schemaString: parsedString.schemaString })
     : [];
 
-  const result = [
+  const results = [
     ...(listByIds || []),
     ...(listByAddress?.[0] || []),
     ...(listByAddress?.[1] || []),
     ...(listBySchemaString || []),
   ];
-  return result;
+
+  return uniqMap(results, "id");
 };

explorer/src/pages/Search/components/SearchModules/loadModuleList.ts

@@ -3,6 +3,7 @@ import ModuleDataMapper from "@verax-attestation-registry/verax-sdk/lib/types/sr
 import { ITEMS_PER_PAGE_DEFAULT } from "@/constants";
 import { ResultParseSearch } from "@/interfaces/components";
 import { isNotNullOrUndefined } from "@/utils";
+import { uniqMap } from "@/utils/searchUtils";
 
 export const loadModuleList = async (module: ModuleDataMapper, parsedString: Partial<ResultParseSearch>) => {
   const [listByName, listByDescription] = parsedString.nameOrDescription
@@ -20,7 +21,7 @@ export const loadModuleList = async (module: ModuleDataMapper, parsedString: Par
     parsedString.address ? await Promise.all(parsedString.address.map((id) => module.findOneById(id))) : []
   ).filter(isNotNullOrUndefined);
 
-  const result = [...(listByIds || []), ...(listByName || []), ...(listByDescription || [])];
+  const results = [...(listByIds || []), ...(listByName || []), ...(listByDescription || [])];
 
-  return result;
+  return uniqMap(results, "id");
 };

explorer/src/pages/Search/components/SearchSchemas/loadSchemaList.ts

@@ -3,6 +3,7 @@ import SchemaDataMapper from "@verax-attestation-registry/verax-sdk/lib/types/sr
 import { ITEMS_PER_PAGE_DEFAULT } from "@/constants";
 import { ResultParseSearch } from "@/interfaces/components";
 import { isNotNullOrUndefined } from "@/utils";
+import { uniqMap } from "@/utils/searchUtils";
 
 export const loadSchemaList = async (schema: SchemaDataMapper, parsedString: Partial<ResultParseSearch>) => {
   const [listByName, listByDescription] = parsedString.nameOrDescription
@@ -30,13 +31,13 @@ export const loadSchemaList = async (schema: SchemaDataMapper, parsedString: Par
       )
     : [];
 
-  const result = [
+  const results = [
     ...(listByIds || []),
     ...listBySchemaString,
     ...(listByName || []),
     ...(listByDescription || []),
     ...(listByContext || []),
   ];
 
-  return result;
+  return uniqMap(results, "id");
 };

explorer/src/utils/searchUtils.ts

@@ -65,3 +65,7 @@ export const parseSearch = (search: string | null): Partial<ResultParseSearch> =
     schemaString,
   };
 };
+
+export const uniqMap = <T>(array: T[], by: keyof T): T[] => [
+  ...new Map(array.map((result) => [result[by], result])).values(),
+];