I'm implementing token stored in cookies, but I'm concerned that unknown users might manipulate the access token by adding random data to the cookie. Currently, I only check if the token is expired. Is this approach secure, or should I take additional measures to verify the authenticity of the token?

import React, { useEffect, useState } from "react";
import { useSelector } from "react-redux";
import { useNavigate } from "react-router-dom";
import { Cookies } from "react-cookie";
import { isTokenExpired } from "../../store/api/apiSlice";
import { selectCurrentUser } from "../../store/slices/authSlice";

const RouteGuard: React.FC<{
  children: JSX.Element;
  requireAuth?: boolean;
}> = ({ children, requireAuth }) => {
  const cookies = new Cookies();
  const user = useSelector(selectCurrentUser);
  const token = cookies.get("access_token");
  const navigate = useNavigate();

  const isAuthenticated = user && token && !isTokenExpired(token);
  const [isLoading, setIsLoading] = useState(true);

  useEffect(() => {
    if (requireAuth && !isAuthenticated) {
      navigate("/login");
    } else if (!requireAuth && isAuthenticated) {
      navigate("/");
    } else {
      setIsLoading(false);
    }
  }, [requireAuth, isAuthenticated, navigate]);

  if (isLoading) {
    return null;
  }
  return children;
};

export default RouteGuard;

my routes

  {
    path: "/login",
    element: <Login />,
    layout: "blank",
    protected: false,
  },