hunk.code_window:   return new Promise(resolve => {
       let link = document.createElement("link");
       Object.assign(link, descriptor);
       link.onload = async () => {
         try {
  
hunk.labels: keep keep keep keep keep replace keep
hunk.after_edit:     function removeLink() {
         // TODO: what happens when they click another link fast? will react
         // flip out about this being in the head? Wrapped in try/catch just
         // in case.
  
hunk.file_path: packages/remix-react/linksPreloading.ts
hunk.type: replace
file: import type { LinksFunction, LoaderFunction } from "remix";
  import { useRouteData, Link } from "remix";
  
  import redTextHref from "../styles/redText.css";
  import blueTextHref from "../styles/blueText.css";
  // import guitar from "img:../components/guitar.jpg?width=500&height=500";
  // import notPreloadedGuitar from "img:../components/guitar.jpg?width=600&height=600";
  
  interface User {
    name: string;
    id: string;
  }
  
  export let loader: LoaderFunction = (): User[] => {
    return [
      { name: "Michael Jackson", id: "mjackson" },
      { name: "Ryan Florence", id: "ryanflorence" }
    ];
  };
  
  export let links: LinksFunction = ({ data }: { data: any[] }) => {
    // this blocks on transitions automatically
    let styleLink = { rel: "stylesheet", href: redTextHref };
    let nonMatching = {
      rel: "stylesheet",
      href: blueTextHref,
      media: "(max-width: 10px)"
    };
  
    // block on this image
    // let blocker = block({ rel: "preload", as: "image", href: guitar.src });
  
    // preload gist pages, get data for the first
    let pageLinks = data.map((user, index) => ({
      page: `/gists/${user.id}`,
      data: index === 0
    }));
  
    return [styleLink, nonMatching, ...pageLinks];
  };
  
  export default function LinksPage() {
    let users = useRouteData<User[]>();
    return (
      <div data-test-id="/links">
        <h2>Links Page</h2>
        {users.map(user => (
          <li key={user.id}>
            <Link to={`/gists/${user.id}`}>{user.name}</Link>
          </li>
        ))}
        {/*
        <hr />
        <p>
          <img alt="another guitar..." src={guitar.src} data-test-id="blocked" />
          <br />
          Preloaded and blocked guitar, no layout shift.
        </p>
        <p>
          <img
            alt="another guitar..."
            src={notPreloadedGuitar.src}
            data-test-id="not-blocked"
          />
          <br />
          Not preloaded, not blocked, layout shift!
        </p>
        */}
      </div>
    );
  }
  