- Published on
useQueue Hook React

useQueue Hook React
useQueue Code and Usage
useQueue is a hook to manage a queue of items.
import { useState } from "react";
const useQueue = (initialItems = []) => {
const [items, setItems] = useState(initialItems);
const enqueue = (item) => {
setItems((prevItems) => [...prevItems, item]);
};
const dequeue = () => {
setItems((prevItems) => prevItems.slice(1));
};
return {
items,
enqueue,
dequeue,
};
};
// Usage
const QueueExample = () => {
const { items, enqueue, dequeue } = useQueue(["item1", "item2"]);
return (
<div>
<ul>
{items.map((item, index) => (
<li key={index}>{item}</li>
))}
</ul>
<button onClick={() => enqueue("new item")}>Enqueue</button>
<button onClick={dequeue}>Dequeue</button>
</div>
);
};