Add file uploads for photos and family icons

backend/models/FamilyMember.js

@@ -3,7 +3,8 @@ const mongoose = require("mongoose");
 const familyMemberSchema = new mongoose.Schema(
   {
     name: { type: String, required: true },
-    emoji: { type: String, required: true },
+    iconUrl: { type: String, default: "" },
+    emoji: { type: String, default: "" },
     color: { type: String, required: true },
     order: { type: Number, default: 0 },
   },

backend/package.json

@@ -15,6 +15,7 @@
     "cors": "^2.8.5",
     "dotenv": "^16.4.7",
     "express": "^4.19.2",
-    "mongoose": "^8.9.0"
+    "mongoose": "^8.9.0",
+    "multer": "^1.4.5-lts.1"
   }
 }

backend/routes/family.js

@@ -1,8 +1,27 @@
 const express = require("express");
+const path = require("path");
+const fs = require("fs");
+const multer = require("multer");
 const FamilyMember = require("../models/FamilyMember");
 
 const router = express.Router();
 
+const uploadsDir = path.join(__dirname, "..", "uploads", "family");
+fs.mkdirSync(uploadsDir, { recursive: true });
+
+const storage = multer.diskStorage({
+  destination: (req, file, cb) => {
+    cb(null, uploadsDir);
+  },
+  filename: (req, file, cb) => {
+    const timestamp = Date.now();
+    const safeName = file.originalname.replace(/\s+/g, "-");
+    cb(null, `${timestamp}-${safeName}`);
+  },
+});
+
+const upload = multer({ storage });
+
 router.get("/", async (req, res) => {
   try {
     const members = await FamilyMember.find().sort({ order: 1, createdAt: 1 });
@@ -21,6 +40,19 @@ router.post("/", async (req, res) => {
   }
 });
 
+router.post("/upload-icon", upload.single("file"), async (req, res) => {
+  try {
+    if (!req.file) {
+      return res.status(400).json({ message: "File is required" });
+    }
+    const baseUrl = `${req.protocol}://${req.get("host")}`;
+    const url = `${baseUrl}/uploads/family/${req.file.filename}`;
+    res.status(201).json({ url });
+  } catch (error) {
+    res.status(400).json({ message: "Failed to upload icon" });
+  }
+});
+
 router.get("/:id", async (req, res) => {
   try {
     const member = await FamilyMember.findById(req.params.id);

backend/routes/photos.js

@@ -1,8 +1,27 @@
 const express = require("express");
+const path = require("path");
+const fs = require("fs");
+const multer = require("multer");
 const Photo = require("../models/Photo");
 
 const router = express.Router();
 
+const uploadsDir = path.join(__dirname, "..", "uploads");
+fs.mkdirSync(uploadsDir, { recursive: true });
+
+const storage = multer.diskStorage({
+  destination: (req, file, cb) => {
+    cb(null, uploadsDir);
+  },
+  filename: (req, file, cb) => {
+    const timestamp = Date.now();
+    const safeName = file.originalname.replace(/\s+/g, "-");
+    cb(null, `${timestamp}-${safeName}`);
+  },
+});
+
+const upload = multer({ storage });
+
 router.get("/", async (req, res) => {
   try {
     const filter = {};
@@ -25,6 +44,24 @@ router.post("/", async (req, res) => {
   }
 });
 
+router.post("/upload", upload.single("file"), async (req, res) => {
+  try {
+    if (!req.file) {
+      return res.status(400).json({ message: "File is required" });
+    }
+    const baseUrl = `${req.protocol}://${req.get("host")}`;
+    const url = `${baseUrl}/uploads/${req.file.filename}`;
+    const photo = await Photo.create({
+      url,
+      caption: req.body.caption || "",
+      active: req.body.active !== "false",
+    });
+    res.status(201).json(photo);
+  } catch (error) {
+    res.status(400).json({ message: "Failed to upload photo" });
+  }
+});
+
 router.delete("/:id", async (req, res) => {
   try {
     const photo = await Photo.findByIdAndDelete(req.params.id);

backend/server.js

@@ -1,6 +1,7 @@
 const express = require("express");
 const cors = require("cors");
 const dotenv = require("dotenv");
+const path = require("path");
 
 const connectDb = require("./config/db");
 const familyRoutes = require("./routes/family");
@@ -18,6 +19,7 @@ const port = process.env.PORT || 4000;
 
 app.use(cors());
 app.use(express.json({ limit: "2mb" }));
+app.use("/uploads", express.static(path.join(__dirname, "uploads")));
 
 app.get("/health", (req, res) => {
   res.json({ ok: true });