From 30cdcd9b0eb20f444e5bbd702f6d35317c2b1c10 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Cau=C3=AA=20Faleiros?= <cauefaleiros@gmail.com>
Date: Tue, 4 Aug 2026 13:27:08 -0300
Subject: [PATCH] Add purchase needs pointer affordances

---
 src/pages/Supplies.tsx | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/pages/Supplies.tsx b/src/pages/Supplies.tsx
index 3748225..0109261 100644
--- a/src/pages/Supplies.tsx
+++ b/src/pages/Supplies.tsx
@@ -2220,7 +2220,7 @@ const PurchaseMaterialQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
                   <RouterLink
                     key={product.productId}
                     to={`/products/${product.productId}`}
-                    className="max-w-full truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary"
+                    className="max-w-full cursor-pointer truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary"
                     title={product.name}
                   >
                     #{product.productId} · {product.name}
@@ -2289,7 +2289,7 @@ const PurchaseServiceQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
               <div className="mt-3 flex flex-wrap items-center gap-2 border-t border-dark-border/70 pt-3">
                 <span className="text-[10px] font-bold uppercase tracking-widest text-dark-muted">Produtos afetados</span>
                 {products.slice(0, 3).map(product => (
-                  <RouterLink key={product.productId} to={`/products/${product.productId}`} className="max-w-full truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary" title={product.name}>
+                  <RouterLink key={product.productId} to={`/products/${product.productId}`} className="max-w-full cursor-pointer truncate rounded-md border border-dark-border bg-dark-input px-2 py-1 text-[11px] font-bold text-dark-muted transition-colors hover:border-brand-primary hover:text-brand-primary" title={product.name}>
                     #{product.productId} · {product.name}
                   </RouterLink>
                 ))}
@@ -2354,7 +2354,7 @@ const PurchaseMappingQueue = ({ needs }: { needs: SupplyPurchaseNeed[] }) => (
                 {referenceProduct ? (
                   <RouterLink
                     to={buildConsumptionReferencePath({ sku: referenceProduct.productId, name: referenceProduct.name })}
-                    className="inline-flex h-10 items-center justify-center gap-2 rounded-lg border border-sky-400/30 bg-sky-400/10 px-3 text-xs font-bold text-sky-300 transition-colors hover:bg-sky-400/20"
+                    className="inline-flex h-10 cursor-pointer items-center justify-center gap-2 rounded-lg border border-sky-400/30 bg-sky-400/10 px-3 text-xs font-bold text-sky-300 transition-colors hover:bg-sky-400/20"
                   >
                     <Pencil className="h-3.5 w-3.5" />
                     Mapear consumo
@@ -2467,7 +2467,7 @@ const PurchaseNeedsScreen = () => {
         <button
           type="button"
           onClick={() => openQueue('materials', 'to_buy')}
-          className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'to_buy' ? 'border-brand-primary/45 bg-brand-primary/[0.07]' : 'border-dark-border bg-dark-card hover:border-brand-primary/35'}`}
+          className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'to_buy' ? 'border-brand-primary/45 bg-brand-primary/[0.07]' : 'border-dark-border bg-dark-card hover:border-brand-primary/35'}`}
         >
           <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Materiais para comprar</p>
           <p className="mt-2 text-3xl font-bold text-dark-text">{purchaseItemCount}</p>
@@ -2481,7 +2481,7 @@ const PurchaseNeedsScreen = () => {
         <button
           type="button"
           onClick={() => openQueue('materials', 'negative_balance')}
-          className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'negative_balance' ? 'border-red-400/45 bg-red-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-red-400/35'}`}
+          className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'materials' && materialFilter === 'negative_balance' ? 'border-red-400/45 bg-red-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-red-400/35'}`}
         >
           <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Saldos a conferir</p>
           <p className="mt-2 text-3xl font-bold text-red-300">{negativeBalanceNeeds.length}</p>
@@ -2490,7 +2490,7 @@ const PurchaseNeedsScreen = () => {
         <button
           type="button"
           onClick={() => openQueue('mapping')}
-          className={`rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'mapping' ? 'border-sky-400/45 bg-sky-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-sky-400/35'}`}
+          className={`cursor-pointer rounded-2xl border p-5 text-left shadow-sm transition-colors ${activeTab === 'mapping' ? 'border-sky-400/45 bg-sky-400/[0.07]' : 'border-dark-border bg-dark-card hover:border-sky-400/35'}`}
         >
           <p className="text-xs font-bold uppercase tracking-widest text-dark-muted">Dados bloqueando o plano</p>
           <p className="mt-2 text-3xl font-bold text-sky-300">{impactedSkuCount || mappingNeeds.length}</p>
@@ -2559,7 +2559,7 @@ const PurchaseNeedsScreen = () => {
                 key={filter.id}
                 type="button"
                 onClick={() => openQueue('materials', filter.id)}
-                className={`rounded-lg border px-3 py-2 text-left text-xs font-bold transition-colors ${materialFilter === filter.id ? 'border-brand-primary/40 bg-brand-primary/10 text-brand-primary' : 'border-dark-border bg-dark-input text-dark-muted hover:border-brand-primary/35 hover:text-dark-text'}`}
+                className={`cursor-pointer rounded-lg border px-3 py-2 text-left text-xs font-bold transition-colors ${materialFilter === filter.id ? 'border-brand-primary/40 bg-brand-primary/10 text-brand-primary' : 'border-dark-border bg-dark-input text-dark-muted hover:border-brand-primary/35 hover:text-dark-text'}`}
                 title={filter.description}
               >
                 {filter.label} <span className="ml-1 opacity-75">{filter.count}</span>