Merge pull request #192 from rairprotocol/191-metadata-filtering-issu…

…es-in-collection-view Infinite loop on Metadata Filter
rairprotocol · Sep 6, 2024 · 06815fa · 06815fa
2 parents d065f5a + d78b056
commit 06815fa
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 21 deletions.
diff --git a/rair-front/src/components/MockUpPage/NftList/NftData/NftCollectionPage.tsx b/rair-front/src/components/MockUpPage/NftList/NftData/NftCollectionPage.tsx
@@ -680,21 +680,17 @@ const NftCollectionPageComponent: FC<INftCollectionPageComponent> = ({
               </div>
               <div
                 style={{
-                  width: '100%'
+                  width: '100%',
+                  textAlign: 'left'
                 }}>
-                <input
-                  value={titleSearchAttributes}
-                  onChange={(e) => setTitleSearchAttributes(e.target.value)}
-                  style={{
-                    border: '1px solid #666666',
-                    width: '100%',
-                    borderRadius: '12px',
-                    padding: '5px 10px',
-                    background: 'none',
-                    outline: 'none',
-                    color: 'white'
+                <InputField
+                  label="Search"
+                  getter={titleSearchAttributes}
+                  setter={setTitleSearchAttributes}
+                  customClass="rounded-rair form-control"
+                  customCSS={{
+                    backgroundColor: 'inherit'
                   }}
-                  placeholder="Search..."
                 />
               </div>
               <MetadataAttributesProperties

diff --git a/...tList/NftData/TitleCollection/FilterMetadataTokens/ClearMetadataBox/ClearMetadataItem.tsx b/...tList/NftData/TitleCollection/FilterMetadataTokens/ClearMetadataBox/ClearMetadataItem.tsx
@@ -1,18 +1,14 @@
-import { useEffect, useState } from 'react';
+import { useState } from 'react';
 
 import { useAppSelector } from '../../../../../../../hooks/useReduxHooks';
 
-const ClearMetadataItem = ({ clickProperty, meta, val, getResetTokens }) => {
+const ClearMetadataItem = ({ clickProperty, meta, val }) => {
   const [, /*clearActive*/ setClearActive] = useState(false);
 
   const { primaryColor, textColor, primaryButtonColor } = useAppSelector(
     (store) => store.colors
   );
 
-  useEffect(() => {
-    getResetTokens();
-  }, [getResetTokens, val]);
-
   return (
     <button
       onClick={() => {

diff --git a/...lection/FilterMetadataTokens/MetadataAttrPropertyItems/MetadataAttributesPropertyItem.tsx b/...lection/FilterMetadataTokens/MetadataAttrPropertyItems/MetadataAttributesPropertyItem.tsx
@@ -46,11 +46,11 @@ const MetadataAttributesPropertyItem = ({
       {item.value.length > 7 && !isMobileDesign ? (
         <>
           <TooltipBox title={item.value}>
-            {`${item.value.slice(0, 4)}...(${quantity})`}
+            {`${item.value.slice(0, 4)}... (${quantity})`}
           </TooltipBox>
         </>
       ) : (
-        `${item.value}(${quantity})`
+        `${item.value} (${quantity})`
       )}
     </div>
   );