feat(frontend): integrate product search in SearchView

- Add ProductResults component import
- Add products and searchMode state
- Add parallel product search to search effect
- Add filter tabs (Todos/Medicamentos/Parafarmacia)
- Render ProductResults when products found
- Add CSS for filter tabs and products section

apps/frontend/src/views/SearchView.jsx

@@ -1,6 +1,7 @@
 import React, { useState, useEffect, useMemo, useCallback } from 'react';
 import SearchBar from '../components/SearchBar';
 import MedicineResults from '../components/MedicineResults';
+import ProductResults from '../components/ProductResults';
 import PharmacyList from '../components/PharmacyList';
 import PharmacyMap from '../components/PharmacyMap';
 import { haversineKm, getUserPosition, hasCachedPosition } from '../utils/geo';
@@ -16,6 +17,8 @@ const suggestions = [
 function SearchView({ currentUser, onLoginRequest, initialQuery = '' }) {
   const [searchQuery, setSearchQuery] = useState(initialQuery);
   const [medicines, setMedicines] = useState([]);
+  const [products, setProducts] = useState([]);
+  const [searchMode, setSearchMode] = useState('all');
   const [selectedMedicine, setSelectedMedicine] = useState(null);
   const [pharmacies, setPharmacies] = useState([]);
   const [loading, setLoading] = useState(false);
@@ -76,6 +79,7 @@ function SearchView({ currentUser, onLoginRequest, initialQuery = '' }) {
     const searchMedicines = async () => {
       if (searchQuery.trim().length < 2) {
         setMedicines([]);
+        setProducts([]);
         setSelectedMedicine(null);
         setPharmacies([]);
         return;
@@ -90,6 +94,16 @@ function SearchView({ currentUser, onLoginRequest, initialQuery = '' }) {
       } finally {
         setLoading(false);
       }
+
+      try {
+        const productsResponse = await fetch(`/api/products/search?q=${encodeURIComponent(searchQuery)}`);
+        if (productsResponse.ok) {
+          const productsData = await productsResponse.json();
+          setProducts(productsData.results || []);
+        }
+      } catch (err) {
+        console.error('Product search error:', err);
+      }
     };
     const timeoutId = setTimeout(searchMedicines, 300);
     return () => clearTimeout(timeoutId);
@@ -276,16 +290,53 @@ function SearchView({ currentUser, onLoginRequest, initialQuery = '' }) {
         )}
 
         {searchQuery && !selectedMedicine && (
-          <MedicineResults
-            medicines={medicines}
-            onSelect={(m) => {
-              saveToRecent(m);
-              setSelectedMedicine(m);
-            }}
-            query={searchQuery}
-            currentUser={currentUser}
-            onLoginRequest={onLoginRequest}
-          />
+          <>
+            <div className="filter-tabs">
+              <button
+                className={`filter-tab ${searchMode === 'all' ? 'filter-tab--active' : ''}`}
+                onClick={() => setSearchMode('all')}
+              >
+                Todos ({medicines.length + products.length})
+              </button>
+              <button
+                className={`filter-tab ${searchMode === 'medicines' ? 'filter-tab--active' : ''}`}
+                onClick={() => setSearchMode('medicines')}
+              >
+                Medicamentos ({medicines.length})
+              </button>
+              <button
+                className={`filter-tab ${searchMode === 'products' ? 'filter-tab--active' : ''}`}
+                onClick={() => setSearchMode('products')}
+              >
+                Parafarmacia ({products.length})
+              </button>
+            </div>
+
+            {(searchMode === 'all' || searchMode === 'medicines') && (
+              <MedicineResults
+                medicines={medicines}
+                onSelect={(m) => {
+                  saveToRecent(m);
+                  setSelectedMedicine(m);
+                }}
+                query={searchQuery}
+                currentUser={currentUser}
+                onLoginRequest={onLoginRequest}
+              />
+            )}
+
+            {(searchMode === 'all' || searchMode === 'products') && products.length > 0 && (
+              <div className="products-section">
+                <h3 className="section-subtitle">Parafarmacia y Bebé</h3>
+                <ProductResults
+                  products={products}
+                  onSelect={(p) => {
+                    window.location.href = `/product/${p.source}/${p.id}`;
+                  }}
+                />
+              </div>
+            )}
+          </>
         )}
 
         {selectedMedicine && (