feat: new improvements added

deco-sites · Sep 30, 2024 · 34aca77 · 34aca77
1 parent 75a4559
commit 34aca77
Show file tree

Hide file tree

Showing 2 changed files with 72 additions and 35 deletions.
diff --git a/components/product/ProductDescription.tsx b/components/product/ProductDescription.tsx
@@ -11,51 +11,87 @@ export default function ProductDescription({ page }: Props) {
 
   const description = productDescription || isVariantOf?.description || "";
 
-  const properties =
-    isVariantOf?.additionalProperty?.filter((item) =>
-      item.propertyID === "allSpecifications"
-    ) ?? [];
+  const productCharacteristics = isVariantOf?.additionalProperty.filter((
+    item,
+  ) => item.propertyID?.includes("Características"));
+
+  const productSpecifications = isVariantOf?.additionalProperty.filter((item) =>
+    item.propertyID === "Especificações Técnicas" &&
+    item.name !== "Ref Fabricante"
+  );
+
+  const hasVariantAdditionalProperty = productCharacteristics ||
+    productSpecifications;
+
+  const undesiredNames = page.product.name?.includes("Estetoscópio");
 
   return (
     <div
       id="descricao"
       class="flex items-center justify-center w-full h-full py-8 lg:py-10 border-b-4 border-[#E4E4E4]"
     >
-      <div class="w-full container flex flex-col gap-8">
-        <h2 class="text-2xl text-black-neutral px-4">
+      <div class="w-full container flex flex-col gap-8 px-4">
+        <h2 class="text-2xl text-black-neutral">
           Descrição do <b>Produto</b>
         </h2>
 
-        <div class="flex flex-col gap-8 px-6">
-          <div class="flex flex-col gap-7">
-            <h3 class="text-black-neutral">
-              <b>Descrição</b>
-            </h3>
-            <div
-              dangerouslySetInnerHTML={{
-                __html: description.replace(/\r?\n/g, "<br />").replace(
-                  "iframe",
-                  "iframe loading='lazy'",
-                ),
-              }}
-            />
-          </div>
-
-          <div class="flex flex-col gap-7">
-            <h3 class="text-black-neutral">
-              <b>Características</b>
-            </h3>
-
-            {properties.filter((item) =>
-              item.name !== "sellerId" && item.name !== "Tabela de Medidas" &&
-              !item.name?.toLowerCase().includes("selecione a opção de")
-            )?.map((property) => (
-              <div class="even:bg-[#EEEEEE] odd:bg-white-normal grid grid-cols-2 w-full text-sm leading-6 px-4">
-                <span class="text-[#444] font-bold">{property.name}</span>
-                <span>{property.value}</span>
+        <div class="flex flex-col gap-8">
+          {!undesiredNames && (
+            <div class="flex flex-col gap-7">
+              <h3 class="text-black-neutral">
+                <b>Descrição</b>
+              </h3>
+
+              <div
+                dangerouslySetInnerHTML={{
+                  __html: description.replace(/\r?\n/g, "<br />").replace(
+                    "iframe",
+                    "iframe loading='lazy'",
+                  ),
+                }}
+                class="text-justify"
+              />
+            </div>
+          )}
+
+          {hasVariantAdditionalProperty && (
+            <div class="flex flex-col w-full">
+              <div class="flex flex-col gap-12 w-full">
+                {productCharacteristics && productCharacteristics.length > 0 &&
+                  (
+                    <div class="flex flex-col gap-6 w-full">
+                      <h3 class="text-xl font-bold">
+                        Características do Produto
+                      </h3>
+
+                      <ul class="flex flex-col w-full">
+                        {productCharacteristics?.map((item) => (
+                          <li class="grid grid-cols-2 gap-2.5 even:bg-white-normal odd:bg-[#eeeeee] w-full py-3 px-4 text-sm">
+                            <span class="font-bold">{item.name}</span>
+                            <span>{item.value}</span>
+                          </li>
+                        ))}
+                      </ul>
+                    </div>
+                  )}
+
+                {productSpecifications && productSpecifications.length > 0 && (
+                  <div class="flex flex-col gap-6 w-full">
+                    <h3 class="text-xl font-bold">Especificações Técnicas</h3>
+
+                    <ul class="flex flex-col w-full">
+                      {productSpecifications?.map((item) => (
+                        <li class="grid grid-cols-2 gap-2.5 even:bg-white-normal odd:bg-[#eeeeee] w-full py-3 px-4 text-sm">
+                          <span class="font-bold">{item.name}</span>
+                          <span>{item.value}</span>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
+                )}
               </div>
-            ))}
-          </div>
+            </div>
+          )}
         </div>
       </div>
     </div>

diff --git a/components/ui/Avatar.tsx b/components/ui/Avatar.tsx
@@ -5,6 +5,7 @@
 
 const colors: Record<string, string> = {
   "Bege": "bg-[#ad7d67] ring-[#ad7d67]",
+  "Taupe": "bg-[#a1928b] ring-[#a1928b]",
   "Bronze": "bg[#b68968] ring-[#b68968]",
   "Olinda": "bg-[#9e715b] ring-[#9e715b]",
   "Sahara": "bg-[#845a4a] ring-[#845a4a]",