import { useTransition, useResolvedPath, Link } from "remix";
      
      function PendingLink({ to, children }) {
        const transition = useTransition();
        const path = useResolvedPath(to);
        const isPending =
          transition.state === "loading" &&
          transition.location.pathname === path.pathname;
        return (
          <Link
            data-pending={isPending ? "true" : null}
            to={to}
            children={children}
          />
        );
      }
      Javascript language logo
      your recipe card header background

      Pending Link

      Remix JavaScript public recipes

      The code creates a PendingLink element, sets its data-pending attribute to true, and sets its to and children properties to the location of the target and the children of the current document, respectively. The transition property is initialized with the useTransition() function, which sets its state to "loading" and its location to the document's loadedHTML property. If the PendingLink has children, their data-pending attribute is set to true as well.

      Library: remix

      Shortcut: remix.link.pending

      0 Comments

        Add Comment

        Log in to add a comment

        Codiga - All rights reserved 2022.