لماذا احصل على خطأ أثناء محاولة استخدام map على البيانات التي أحصل عليها باستخدام الخطاف في جافاسكربت؟

كود الخطاف:

const useCreations = () => {
  const service = new aboutPisanka();
  const [data, setData] = useState();

  useEffect(() => {
    console.log(123 )
    service.getAllCreations().then((data) => setData(data));
  }, []);

  return data
};

كود العنصر

const data = useCreations();
  console.log(data);
  const cards = data.map((data) => {
    const { heading, text, id, image } = data;
    return (
      <div key={id}>
        <img src={require(image)}/>
        <h1>{heading}</h1>
        <p>{text}</p>
      </div>
    );
  });

كود الوظيفة حيث يتم تخزين البيانات:

getAllCreations = async () => {
    return this._creations;
  };

هل يمكنك مساعدتي؟ شكرا مقدما