finito spero

backend/src/models/Item.ts

@@ -5,6 +5,7 @@ export interface IItem extends Document {
   name:        string;
   description: string;
   tags:        Types.Array<ITag['_id']>;
+  quantity:    number;           // ← nuovo
   dateAdded:   Date;
   addedBy:     string;
 }
@@ -13,8 +14,9 @@ const itemSchema = new Schema<IItem>({
   name:        { type: String, required: true },
   description: { type: String, required: true },
   tags:        [{ type: Schema.Types.ObjectId, ref: 'Tag' }],
+  quantity:    { type: Number, default: 0, min: 0 },   // default 0, mai negativo
   dateAdded:   { type: Date, default: Date.now },
-  addedBy:     { type: String }
+  addedBy:     { type: String },
 });
 
 export default model<IItem>('Item', itemSchema);

backend/src/routes/items.ts

@@ -1,6 +1,6 @@
 import { Router } from 'express';
 import Item from '../models/Item.js';
-import Tag from '../models/Tag.js';
+import Tag  from '../models/Tag.js';
 import auth from '../middleware/auth.js';
 
 const router = Router();
@@ -26,16 +26,16 @@ router.get('/search', async (req, res) => {
     ],
   };
 
-  const items = await Item.find(filter).populate('tags');
+  res.json(await Item.find(filter).populate('tags'));
-  res.json(items);
 });
 
-/* ──────────── POST: crea item (protetto) ──────────── */
+/* ──────────── POST: crea item ──────────── */
 router.post('/', auth, async (req, res) => {
-  const { name, description, tagIds } = req.body as {
+  const { name, description, tagIds, quantity = 0 } = req.body as {
     name: string;
     description: string;
     tagIds: string[];
+    quantity?: number;
   };
 
   const tags = await Tag.find({ _id: { $in: tagIds } });
@@ -43,23 +43,68 @@ router.post('/', auth, async (req, res) => {
     name,
     description,
     tags,
+    quantity,
     addedBy: req.user!.email,
   });
 
   res.status(201).json(await item.populate('tags'));
 });
 
-/* ──────────── DELETE: elimina item (protetto) ──────────── */
+/* ──────────── PUT: aggiorna intero item ──────────── */
+router.put('/:id', auth, async (req, res) => {
+  const { id } = req.params;
+  const { name, description, tagIds, quantity } = req.body as {
+    name?: string;
+    description?: string;
+    tagIds?: string[];
+    quantity?: number;
+  };
+
+  const update: any = {};
+  if (name !== undefined)        update.name        = name;
+  if (description !== undefined) update.description = description;
+  if (quantity !== undefined)    update.quantity    = quantity;
+  if (tagIds)                    update.tags = await Tag.find({ _id: { $in: tagIds } });
+
+  const item = await Item.findByIdAndUpdate(id, update, { new: true }).populate('tags');
+  if (!item) {
+    res.status(404).json({ message: 'Item non trovato' });
+    return;
+  }
+  res.json(item);
+});
+
+/* ──────────── PATCH: modifica solo la quantità ──────────── */
+router.patch('/:id/quantity', auth, async (req, res) => {
+  const { id } = req.params;
+  const { quantity } = req.body as { quantity: number };
+
+  if (quantity < 0) {
+    res.status(400).json({ message: 'La quantità non può essere negativa' });
+    return;
+  }
+
+  const item = await Item.findByIdAndUpdate(
+    id,
+    { quantity },
+    { new: true }
+  ).populate('tags');
+
+  if (!item) {
+    res.status(404).json({ message: 'Item non trovato' });
+    return;
+  }
+  res.json(item);
+});
+
+/* ──────────── DELETE: elimina item ──────────── */
 router.delete('/:id', auth, async (req, res) => {
   const { id } = req.params;
-
   const deleted = await Item.findByIdAndDelete(id);
   if (!deleted) {
     res.status(404).json({ message: 'Item non trovato' });
     return;
   }
-
-  // 204 No Content: operazione riuscita, nessun body
   res.status(204).end();
 });
 

frontend/.gitignore

@@ -23,4 +23,6 @@ dist-ssr
 *.sln
 *.sw?
 
+.git
+
 .env

frontend/src/components/AddItemDialog.tsx

@@ -51,6 +51,7 @@ export const AddItemDialog = ({ open, onOpenChange, tags, onItemAdded }: AddItem
       const newItem = await inventoryService.createItem({
         name: name.trim(),
         description: description.trim(),
+        quantity: 1, // Default quantity set to 1
         tagIds: selectedTagIds
       });
 
@@ -117,17 +118,17 @@ export const AddItemDialog = ({ open, onOpenChange, tags, onItemAdded }: AddItem
                 <Badge
                   key={tag._id}
                   variant="outline"
-                  className={`cursor-pointer transition-all border`}
+                  className={`cursor-pointer transition-all ${selectedTagIds.includes(tag._id)
-                  style={{
+                      ? 'bg-blue-100 border-blue-300'
-                    backgroundColor: selectedTagIds.includes(tag._id) ? '#3b82f6' : tag.color,
+                      : 'hover:bg-gray-100'
-                    color: '#fff',
+                    }`}
-                  }}
                   onClick={() => toggleTag(tag._id)}
                 >
+                  <div
+                    className="w-3 h-3 rounded-full mr-2"
+                    style={{ backgroundColor: tag.color }}
+                  />
                   {tag.name}
-                  {selectedTagIds.includes(tag._id) && (
-                    <span className="ml-1 font-bold">✓</span>
-                  )}
                 </Badge>
               ))}
             </div>

frontend/src/components/EditItemDialog.tsx

@@ -0,0 +1,171 @@
+
+import { useState, useEffect } from 'react';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Textarea } from '@/components/ui/textarea';
+import { Badge } from '@/components/ui/badge';
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogFooter,
+} from '@/components/ui/dialog';
+import { Label } from '@/components/ui/label';
+import { InventoryItem, Tag, UpdateItemData } from '@/types/inventory';
+import { inventoryService } from '@/services/inventoryService';
+import { useToast } from '@/hooks/use-toast';
+
+interface EditItemDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  item: InventoryItem | null;
+  tags: Tag[];
+  onItemUpdated: (updatedItem: InventoryItem) => void;
+}
+
+export const EditItemDialog = ({
+  open,
+  onOpenChange,
+  item,
+  tags,
+  onItemUpdated,
+}: EditItemDialogProps) => {
+  const [formData, setFormData] = useState({
+    name: '',
+    description: '',
+    quantity: 0,
+    selectedTagIds: [] as string[],
+  });
+  const [isLoading, setIsLoading] = useState(false);
+  const { toast } = useToast();
+
+  useEffect(() => {
+    if (item) {
+      setFormData({
+        name: item.name,
+        description: item.description,
+        quantity: item.quantity,
+        selectedTagIds: item.tags.map(tag => tag._id),
+      });
+    }
+  }, [item]);
+
+  const handleSubmit = async (e: React.FormEvent) => {
+    e.preventDefault();
+    if (!item) return;
+
+    setIsLoading(true);
+    try {
+      const updateData: UpdateItemData = {
+        name: formData.name,
+        description: formData.description,
+        quantity: formData.quantity,
+        tagIds: formData.selectedTagIds,
+      };
+
+      const updatedItem = await inventoryService.updateItem(item._id, updateData);
+      onItemUpdated(updatedItem);
+      onOpenChange(false);
+      toast({
+        title: "Oggetto aggiornato",
+        description: `${updatedItem.name} è stato modificato con successo`,
+      });
+    } catch (error) {
+      toast({
+        title: "Errore",
+        description: "Impossibile aggiornare l'oggetto",
+        variant: "destructive",
+      });
+    } finally {
+      setIsLoading(false);
+    }
+  };
+
+  const toggleTag = (tagId: string) => {
+    setFormData(prev => ({
+      ...prev,
+      selectedTagIds: prev.selectedTagIds.includes(tagId)
+        ? prev.selectedTagIds.filter(id => id !== tagId)
+        : [...prev.selectedTagIds, tagId]
+    }));
+  };
+
+  if (!item) return null;
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-[425px]">
+        <DialogHeader>
+          <DialogTitle>Modifica Oggetto</DialogTitle>
+        </DialogHeader>
+        <form onSubmit={handleSubmit} className="space-y-4">
+          <div className="space-y-2">
+            <Label htmlFor="name">Nome</Label>
+            <Input
+              id="name"
+              value={formData.name}
+              onChange={(e) => setFormData(prev => ({ ...prev, name: e.target.value }))}
+              required
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="description">Descrizione</Label>
+            <Textarea
+              id="description"
+              value={formData.description}
+              onChange={(e) => setFormData(prev => ({ ...prev, description: e.target.value }))}
+              rows={3}
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label htmlFor="quantity">Quantità</Label>
+            <Input
+              id="quantity"
+              type="number"
+              min="0"
+              value={formData.quantity}
+              onChange={(e) => setFormData(prev => ({ ...prev, quantity: parseInt(e.target.value) || 0 }))}
+              required
+            />
+          </div>
+
+          <div className="space-y-2">
+            <Label>Tag</Label>
+            <div className="flex flex-wrap gap-2">
+              {tags.map(tag => (
+                <Badge
+                  key={tag._id}
+                  variant="outline"
+                  className={`cursor-pointer transition-all ${
+                    formData.selectedTagIds.includes(tag._id)
+                      ? 'bg-blue-100 border-blue-300'
+                      : 'hover:bg-gray-100'
+                  }`}
+                  onClick={() => toggleTag(tag._id)}
+                >
+                  <div
+                    className="w-3 h-3 rounded-full mr-2"
+                    style={{ backgroundColor: tag.color }}
+                  />
+                  {tag.name}
+                </Badge>
+              ))}
+            </div>
+          </div>
+
+          <DialogFooter>
+            <Button type="button" variant="outline" onClick={() => onOpenChange(false)}>
+              Annulla
+            </Button>
+            <Button type="submit" disabled={isLoading}>
+              {isLoading ? 'Salvataggio...' : 'Salva Modifiche'}
+            </Button>
+          </DialogFooter>
+        </form>
+      </DialogContent>
+    </Dialog>
+  );
+};

frontend/src/components/InventoryDashboard.tsx

@@ -1,17 +1,18 @@
-
 import { useState, useEffect, useMemo } from 'react';
 import { Button } from '@/components/ui/button';
 import { Input } from '@/components/ui/input';
 import { Badge } from '@/components/ui/badge';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table';
-import { Search, Plus, Tag as TagIcon, User, Trash2 } from 'lucide-react';
+import { Search, Plus, Tag as TagIcon, User, Trash2, Edit } from 'lucide-react';
 import { InventoryItem, Tag } from '@/types/inventory';
 import { inventoryService } from '@/services/inventoryService';
 import { useAuth } from '@/hooks/useAuth';
 import { AddItemDialog } from '@/components/AddItemDialog';
 import { ManageTagsDialog } from '@/components/ManageTagsDialog';
 import { DeleteItemDialog } from '@/components/DeleteItemDialog';
+import { EditItemDialog } from '@/components/EditItemDialog';
+import { QuantityControls } from '@/components/QuantityControls';
 import { useToast } from '@/hooks/use-toast';
 
 export const InventoryDashboard = () => {
@@ -24,6 +25,7 @@ export const InventoryDashboard = () => {
   const [showAddDialog, setShowAddDialog] = useState(false);
   const [showTagsDialog, setShowTagsDialog] = useState(false);
   const [itemToDelete, setItemToDelete] = useState<InventoryItem | null>(null);
+  const [itemToEdit, setItemToEdit] = useState<InventoryItem | null>(null);
   const [isDeletingItem, setIsDeletingItem] = useState(false);
 
   const { user, logout } = useAuth();
@@ -122,6 +124,18 @@ export const InventoryDashboard = () => {
     );
   };
 
+  const handleItemUpdated = (updatedItem: InventoryItem) => {
+    setItems(prev => prev.map(item => 
+      item._id === updatedItem._id ? updatedItem : item
+    ));
+  };
+
+  const handleQuantityUpdate = (updatedItem: InventoryItem) => {
+    setItems(prev => prev.map(item => 
+      item._id === updatedItem._id ? updatedItem : item
+    ));
+  };
+
   const filteredItems = useMemo(() => {
     if (!searchQuery && selectedTagIds.length === 0) return items;
 
@@ -244,20 +258,21 @@ export const InventoryDashboard = () => {
                   {tags.map(tag => {
                     console.log(tag);
                     return <Badge
-                      key={tag._id}
+                    key={tag._id}
-                      variant="outline"
+                    variant="outline"
-                      className={`cursor-pointer transition-all border`}
+                    className={`cursor-pointer transition-all ${
-                      style={{
+                      selectedTagIds.includes(tag._id)
-                        backgroundColor: selectedTagIds.includes(tag._id) ? '#3b82f6' : tag.color,
+                        ? 'bg-blue-100 border-blue-300'
-                        color: '#fff',
+                        : 'hover:bg-gray-100'
-                      }}
+                    }`}
-                      onClick={() => toggleTagFilter(tag._id)}
+                    onClick={() => toggleTagFilter(tag._id)}
-                    >
+                  >
-                      {tag.name}
+                    <div
-                      {selectedTagIds.includes(tag._id) && (
+                      className="w-3 h-3 rounded-full mr-2"
-                        <span className="ml-1 font-bold">✓</span>
+                      style={{ backgroundColor: tag.color }}
-                      )}
+                    />
-                    </Badge>
+                    {tag.name}
+                  </Badge>
                   })}
                 </div>
               </div>
@@ -289,6 +304,7 @@ export const InventoryDashboard = () => {
                   <TableRow className="bg-slate-50">
                     <TableHead className="font-semibold">Nome</TableHead>
                     <TableHead className="font-semibold">Descrizione</TableHead>
+                    <TableHead className="font-semibold">Quantità</TableHead>
                     <TableHead className="font-semibold">Tag</TableHead>
                     <TableHead className="font-semibold">Data Aggiunta</TableHead>
                     <TableHead className="font-semibold">Aggiunto da</TableHead>
@@ -298,7 +314,7 @@ export const InventoryDashboard = () => {
                 <TableBody>
                   {filteredItems.length === 0 ? (
                     <TableRow>
-                      <TableCell colSpan={6} className="text-center py-8 text-gray-500">
+                      <TableCell colSpan={7} className="text-center py-8 text-gray-500">
                         {searchQuery || selectedTagIds.length > 0
                           ? "Nessun oggetto trovato con i filtri applicati"
                           : "Nessun oggetto nell'inventario"
@@ -310,26 +326,49 @@ export const InventoryDashboard = () => {
                       <TableRow key={item._id} className="hover:bg-slate-50 transition-colors">
                         <TableCell className="font-medium">{item.name}</TableCell>
                         <TableCell className="text-gray-600">{item.description}</TableCell>
+                        <TableCell>
+                          <QuantityControls 
+                            item={item} 
+                            onQuantityUpdate={handleQuantityUpdate}
+                          />
+                        </TableCell>
                         <TableCell>
                           <div className="flex flex-wrap gap-1">
                             {item.tags.map(tag => (
-                              <Badge key={tag._id} variant="outline" className={`text-xs text-white`} style={{ backgroundColor: tag.color }}>
+                              <Badge
-                                {tag.name}
+                              key={tag._id}
-                              </Badge>
+                              variant="outline"
+                            >
+                              <div
+                                className="w-3 h-3 rounded-full mr-2"
+                                style={{ backgroundColor: tag.color }}
+                              />
+                              {tag.name}
+                            </Badge>
                             ))}
                           </div>
                         </TableCell>
                         <TableCell className="text-gray-600">{formatDate(item.dateAdded)}</TableCell>
                         <TableCell className="text-gray-600">{item.addedBy}</TableCell>
                         <TableCell>
-                          <Button
+                          <div className="flex gap-1">
-                            variant="ghost"
+                            <Button
-                            size="sm"
+                              variant="ghost"
-                            onClick={() => setItemToDelete(item)}
+                              size="sm"
-                            className="text-red-600 hover:text-red-700 hover:bg-red-50"
+                              onClick={() => setItemToEdit(item)}
-                          >
+                              className="text-blue-600 hover:text-blue-700 hover:bg-blue-50"
-                            <Trash2 className="w-4 h-4" />
+                            >
-                          </Button>
+                              <Edit className="w-4 h-4" />
+                            </Button>
+                            <Button
+                              variant="ghost"
+                              size="sm"
+                              onClick={() => setItemToDelete(item)}
+                              className="text-red-600 hover:text-red-700 hover:bg-red-50"
+                            >
+                              <Trash2 className="w-4 h-4" />
+                            </Button>
+                          </div>
                         </TableCell>
                       </TableRow>
                     ))
@@ -363,6 +402,14 @@ export const InventoryDashboard = () => {
         onConfirm={handleDeleteItem}
         isLoading={isDeletingItem}
       />
+
+      <EditItemDialog
+        open={!!itemToEdit}
+        onOpenChange={() => setItemToEdit(null)}
+        item={itemToEdit}
+        tags={tags}
+        onItemUpdated={handleItemUpdated}
+      />
     </div>
   );
 };

frontend/src/components/ManageTagsDialog.tsx

@@ -167,10 +167,13 @@ export const ManageTagsDialog = ({
                 {tags.map(tag => (
                   <div key={tag._id} className="flex items-center justify-between mb-2 p-2 bg-white rounded border">
                     <Badge
+                      key={tag._id}
                       variant="outline"
-                      style={{ backgroundColor: tag.color }}
-                      className="text-white"
                     >
+                      <div
+                        className="w-3 h-3 rounded-full mr-2"
+                        style={{ backgroundColor: tag.color }}
+                      />
                       {tag.name}
                     </Badge>
                     <Button

frontend/src/components/QuantityControls.tsx

@@ -0,0 +1,65 @@
+
+import { useState } from 'react';
+import { Button } from '@/components/ui/button';
+import { Plus, Minus } from 'lucide-react';
+import { InventoryItem } from '@/types/inventory';
+import { inventoryService } from '@/services/inventoryService';
+import { useToast } from '@/hooks/use-toast';
+
+interface QuantityControlsProps {
+  item: InventoryItem;
+  onQuantityUpdate: (updatedItem: InventoryItem) => void;
+}
+
+export const QuantityControls = ({ item, onQuantityUpdate }: QuantityControlsProps) => {
+  const [isUpdating, setIsUpdating] = useState(false);
+  const { toast } = useToast();
+
+  const updateQuantity = async (newQuantity: number) => {
+    if (newQuantity < 0) return;
+    
+    setIsUpdating(true);
+    try {
+      const updatedItem = await inventoryService.updateItemQuantity(item._id, newQuantity);
+      onQuantityUpdate(updatedItem);
+      toast({
+        title: "Quantità aggiornata",
+        description: `${item.name}: ${newQuantity} pezzi`,
+      });
+    } catch (error) {
+      toast({
+        title: "Errore",
+        description: "Impossibile aggiornare la quantità",
+        variant: "destructive",
+      });
+    } finally {
+      setIsUpdating(false);
+    }
+  };
+
+  return (
+    <div className="flex items-center space-x-2">
+      <Button
+        variant="outline"
+        size="sm"
+        onClick={() => updateQuantity(item.quantity - 1)}
+        disabled={isUpdating || item.quantity <= 0}
+        className="h-8 w-8 p-0"
+      >
+        <Minus className="w-3 h-3" />
+      </Button>
+      <span className="text-sm font-medium min-w-[2rem] text-center">
+        {item.quantity}
+      </span>
+      <Button
+        variant="outline"
+        size="sm"
+        onClick={() => updateQuantity(item.quantity + 1)}
+        disabled={isUpdating}
+        className="h-8 w-8 p-0"
+      >
+        <Plus className="w-3 h-3" />
+      </Button>
+    </div>
+  );
+};

frontend/src/services/inventoryService.ts

@@ -5,6 +5,7 @@ import {
   InventoryItem,
   Tag,
   CreateItemData,
+  UpdateItemData,
 } from '@/types/inventory';
 
 const API_URL = import.meta.env.VITE_API_URL ?? 'http://localhost:6789/api';
@@ -45,6 +46,40 @@ export const inventoryService = {
     return res.json();
   },
 
+  async updateItem(itemId: string, data: UpdateItemData): Promise<InventoryItem> {
+    const res = await fetch(`${API_URL}/items/${itemId}`, {
+      method: 'PUT',
+      headers: {
+        'Content-Type': 'application/json',
+        ...getAuthHeader(),
+      },
+      body: JSON.stringify(data),
+    });
+
+    if (!res.ok) {
+      const msg = (await res.json())?.message ?? 'Errore aggiornamento item';
+      throw new Error(msg);
+    }
+    return res.json();
+  },
+
+  async updateItemQuantity(itemId: string, quantity: number): Promise<InventoryItem> {
+    const res = await fetch(`${API_URL}/items/${itemId}/quantity`, {
+      method: 'PATCH',
+      headers: {
+        'Content-Type': 'application/json',
+        ...getAuthHeader(),
+      },
+      body: JSON.stringify({ quantity }),
+    });
+
+    if (!res.ok) {
+      const msg = (await res.json())?.message ?? 'Errore aggiornamento quantità';
+      throw new Error(msg);
+    }
+    return res.json();
+  },
+
   async deleteItem(itemId: string): Promise<void> {
     const res = await fetch(`${API_URL}/items/${itemId}`, {
       method: 'DELETE',

frontend/src/types/inventory.ts

@@ -9,6 +9,7 @@ export interface InventoryItem {
   _id: string;
   name: string;
   description: string;
+  quantity: number;
   tags: Tag[];
   dateAdded: string;
   addedBy: string;
@@ -17,5 +18,13 @@ export interface InventoryItem {
 export interface CreateItemData {
   name: string;
   description: string;
+  quantity: number;
   tagIds: string[];
 }
+
+export interface UpdateItemData {
+  name?: string;
+  description?: string;
+  quantity?: number;
+  tagIds?: string[];
+}

package-lock.json

@@ -0,0 +1,6 @@
+{
+  "name": "Inventario",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {}
+}