Use Project Detail

1// useProjectDetail — project-detail data, no markup: load a project by slug (null → not-found),
2// then load its media gallery. listProjectItems returns { items, total } (an OBJECT, not a bare
3// array) — iterate `items`; that shape is the bug-prone part. The PDP page only renders what this
4// returns. details[] rows come through untouched: [{ label, text? OR link: { text, url, target } }].
5import { useState, useEffect } from "react";
6import { getProjectBySlug, listProjectItems } from "@/rest/wix-portfolio";
7
8export function useProjectDetail(slug) {
9  const [project, setProject] = useState(null);
10  const [notFound, setNotFound] = useState(false);
11  const [items, setItems] = useState([]);
12
13  useEffect(() => {
14    setNotFound(false);
15    setProject(null);
16    setItems([]);
17    getProjectBySlug(slug).then((p) => {
18      if (!p) return setNotFound(true);
19      setProject(p);
20      listProjectItems(p.id).then(({ items }) => setItems(items));
21    });
22  }, [slug]);
23
24  return { project, notFound, items };
25}