How to return an array from a custom hook?

Question

JavaScript

I am using react. I receive an array from the server and display it as a table with pagination and sorting. I made pagination and sorting in the form of custom hooks, they work as they should. But at the first render, the array returned from the sort function disappears somewhere, I decided so because the table is empty, then when I change the sort, the table is filled in accordance with the sort.

array import in App.js:

const [items, setItems] = useState([]);
 const {setMask, setCurrentColumn, setCurrentCondition, sortedItems} = useSort(items);
 const {setCurrentPage, currentItems, amountOfPages} = usePagination(sortedItems);
 const [isLoaded, setIsLoaded] = useState(false

);

function itself:

export const useSort = (filteredItems) => {

    const [sortedItems, setSortedItems] = useState(filteredItems);
    const [mask, setMask] = useState("");
    const [currentColumn, setCurrentColumn] = useState("Distance");
    const [currentCondition, setCurrentCondition] = useState("greater");

    useEffect(() => {
        SortQuantity(currentCondition, currentColumn);
        SortDistance(currentCondition, currentColumn);
        SortName(currentCondition, currentColumn);

    }, [currentCondition, currentColumn, mask]);

    function SortQuantity (currentCondition, currentColumn) {
        if (currentColumn === "Quantity" && currentCondition === "less") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Quantity < mask)
            )
        } else if (currentColumn === "Quantity" && currentCondition === "greater") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Quantity > mask)
            )
        } else if (currentColumn === "Quantity" && currentCondition === "equal") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Quantity.toString() === mask)
            )
        } else return sortedItems
    }

    function SortDistance (currentCondition, currentColumn) {
        if (currentColumn === "Distance" && currentCondition === "less") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Distance < mask)
            )
        } else if (currentColumn === "Distance" && currentCondition === "greater") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Distance > mask)
            )
        } else if (currentColumn === "Distance" && currentCondition === "equal") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item => item.Distance.toString() === mask)
            )
        } else return sortedItems
    }

    function SortName (currentCondition, currentColumn) {
        if (currentColumn === "Name" && currentCondition === "contains") {
            console.log(mask, currentCondition, currentColumn);
            setSortedItems(
                filteredItems.filter(item =>
                    item.Name.toLowerCase().includes(mask.toLowerCase())
                )
            )
        } else return sortedItems
    }

    return {
        setMask,
        setCurrentColumn,
        setCurrentCondition,
        sortedItems
    }
};