CURRENT_USER null, TypeError: Cannot read properties of null

I am facing an issue my user is always showing null in the backend, I don't know why.

I am following an Udemy course my tutor is saying middleware is responsible for user identification. but the problem is I typed the same code as my tutor is typing but his codes are working fine mine not.

I am using Axios from the front end to make request.

This my controller ==>

export const currentUser = async (req, res) => {
    try {
        const user = await User.findById(req._id).select("-password").exec();
        console.log("CURRENT_USER", user); return res.json({ ok: true }); 
    } catch (err) {     
        console.log(err); 
    } 
};

This is my middleware ==>

import { expressjwt } from "express-jwt";
    
export const requireSignIn = expressjwt({ getToken: (req, res) => req.cookies.token, secret: process.env.JWT_SECRET, algorithms: ["HS256"], }) ;

This my front end code where I have been making request ===>

import { useEffect, useState, useContext } from "react";
import axios from "axios"; 
import { useRouter } from "next/router";
import { SyncOutlined } from "@ant-design/icons"; 
import UserNav from "../nav/userNav";
import { Context } from "../../context";

const UserRoutes = ({ children }) => { 
    const { state: { user } } = useContext(Context);
    // state 
    const [ok, setOk] = useState(false); 
    // router 
    const router = useRouter();

    useEffect(() => {
        fetchUser(); 
    }, []);
    
    const fetchUser = async () => { 
        try { 
            const { data } = await axios.get("/api/current-user");
            console.log(data); 
            if (data.ok) setOk(true); 
        } catch (err) { 
            console.log(err); 
            setOk(false);       
            router.push("/login"); 
        } 
    };
    
    return (
        <>
            {!ok ? (
                <SyncOutlined spin className="d-flex justify-content-center display-1 text-primary p-5" />
            ) : ( 
                <div className="UserNavSec">
                    <div className="UserNavCol1">
                        <div className="UserNavCont"><UserNav/></div
                    </div>
                    <div className="UserNavCol2"> {children} </div
                </div>       
            )} 
        </>   
    ); 
};
    
export default UserRoutes;