📦 Inventory Management

\n \n {/* Tab Navigation */}\n

\n setActiveTab('inventory')}\n className={`px-4 py-2 rounded-md font-medium ${\n activeTab === 'inventory'\n ? 'bg-green-600 text-white'\n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n 📋 Current Inventory\n \n setActiveTab('movements')}\n className={`px-4 py-2 rounded-md font-medium ${\n activeTab === 'movements'\n ? 'bg-green-600 text-white'\n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n 📊 Stock Movements\n \n

\n\n {error && (\n

\n ❌\n

{error}

\n )}\n\n {success && (\n

\n ✅\n

{success}

\n )}\n\n {activeTab === 'inventory' && (\n

\n {/* Stock Adjustment Form */}\n

🔧 Adjust Stock

\n \n Select Product\n \n {\n const product = products.find(p => p.id === parseInt(e.target.value));\n setSelectedProduct(product || null);\n }}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-green-500 focus:border-green-500\"\n >\n \n {products.map(product => (\n \n ))}\n \n

\n\n

\n \n Movement Type\n \n setAdjustmentData(prev => ({ \n ...prev, \n movementType: e.target.value as 'IN' | 'OUT' | 'ADJUSTMENT' \n }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-green-500 focus:border-green-500\"\n >\n \n \n \n \n

\n\n

\n \n Quantity\n \n setAdjustmentData(prev => ({ \n ...prev, \n quantity: parseInt(e.target.value) || 0 \n }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-green-500 focus:border-green-500\"\n placeholder=\"Enter quantity\"\n />\n

\n\n

\n \n Reason\n \n setAdjustmentData(prev => ({ \n ...prev, \n reason: e.target.value \n }))}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:ring-2 focus:ring-green-500 focus:border-green-500\"\n placeholder=\"Reason for adjustment\"\n />\n

\n\n

\n \n {isLoading ? 'Processing...' : 'Adjust Stock'}\n \n

\n\n {/* Products Table */}\n

\n \n \n \n \n \n \n \n \n \n \n \n \n {products.map((product) => {\n const stockStatus = getStockStatus(product);\n return (\n \n \n \n \n \n \n \n \n );\n })}\n \n

\n Product\n	\n Category\n	\n Current Stock\n	\n Min/Max Levels\n	\n Status\n	\n Unit\n
\n {product.name} \n	\n \n {product.productCategory}\n \n	\n \n {product.currentStock} {product.unit}\n \n	\n \n Min: {product.minStockLevel} / Max: {product.maxStockLevel}\n \n	\n \n {stockStatus.icon} {stockStatus.status}\n \n	\n {product.unit}\n

\n )}\n\n {activeTab === 'movements' && (\n

Recent Stock Movements

\n \n \n \n \n \n \n \n \n \n \n \n \n {stockMovements.map((movement) => (\n \n \n \n \n \n \n \n \n ))}\n \n

\n Date\n	\n Product\n	\n Type\n	\n Quantity\n	\n Stock Change\n	\n Reason\n
\n {formatDate(movement.createdAt!)}\n	\n \n {(movement as any).productName \|\| `Product #${movement.productId}`}\n \n	\n \n {movement.movementType === 'IN' ? '📈 IN' :\n movement.movementType === 'OUT' ? '📉 OUT' :\n '🔧 ADJUSTMENT'}\n \n	\n {movement.quantity}\n	\n {movement.previousStock} → {movement.newStock}\n	\n {movement.reason}\n

\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/eddie_walk/crm_OBUO_FARMS/code/frontend/components/InventoryManagement.tsx","extension","actionData","errors"]