RetrieveImages.tsx

  "use client";
  import { useEffect, useState } from 'react';
  import { PrismaClient } from '@prisma/client';
  const prisma = new PrismaClient();
  
  function ImageDisplay() {
    const [base64Image, setBase64Image] = useState('');
  
    useEffect(() => {
      async function getImagesFromDB() {
        const sticker = await prisma.sticker_table.findFirst({
          where: { name: "Mario_sticker" },
          select: { file: true }
        });
  
        if (sticker) {
          // Convert the Buffer to a base64-encoded string
          const base64String = sticker.file.toString('base64');
          setBase64Image(`data:image/jpeg;base64,${base64String}`);
        }
      }
  
      getImagesFromDB();
    }, []);
  
    return <img src={base64Image} alt="Mario Sticker" />;
  }
  export default ImageDisplay;