How to add spinner for loading to fetch API from MongoDB?

Question

Custom hook .js

import { useEffect, useState } from "react";

const UseHook = () => {
    const [items,setItems]=useState([]);
    useEffect(()=>{
        fetch('https://agile-brushlands-55517.herokuapp.com/inventory')
        .then(res=>res.json())
        .then(data=>setItems(data))
      },[])
      return[items,setItems]
};

export default UseHook;

fetch API

const [items]=UseHook([])
   
return (
  <div className='container'>
    <h1>Inventory Items</h1>
    <div className='row g-4'>
      {           
        items?.slice(0,6).map(item=><Item key={item._id} item={item}></Item>)
      }
    </div>
  </div>
);