aboutsummaryrefslogtreecommitdiff
path: root/examples/hello-next/bun-framework-next/page-loader.ts
blob: fc07578db8758bd43e87ddbe7e307caaa76b9117 (plain) (blame)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
import NextPageLoader from "next/dist/client/page-loader";
import getAssetPathFromRoute from "next/dist/shared/lib/router/utils/get-asset-path-from-route";
// import createRouteLoader from "./route-loader";

export function insertStyleSheet(url: string) {
  if (document.querySelector(`link[href="${url}"]`)) {
    return Promise.resolve();
  }

  return new Promise((resolve, reject) => {
    const link = document.createElement("link");
    link.rel = "stylesheet";

    link.onload = () => resolve();
    link.onerror = () => reject();

    link.href = url;

    // if (headCount) {
    //   document.head.insertBefore(headCount, link);
    // } else {
    document.head.appendChild(link);
    // }
  });
}

export default class PageLoader extends NextPageLoader {
  public routeLoader: RouteLoader;

  constructor(_, __, pages) {
    super(_, __);

    // TODO: assetPrefix?
    // this.routeLoader = {}; //createRouteLoader("");

    // Rewrite the pages object to omit the entry script
    // At this point, the entry point has been loaded so we don't want to do that again.
    for (let name in pages) {
      for (let i = 0; i < pages[name].length; i += 1) {
        const lastDot = pages[name][i].lastIndexOf(".");
        if (lastDot == -1) continue;
        if (
          pages[name][i].substring(lastDot - ".entry".length, lastDot) !==
          ".entry"
        )
          continue;

        pages[name][i] =
          pages[name][i].substring(0, lastDot - ".entry".length) +
          pages[name][i].substring(lastDot);
      }
    }

    this.pages = pages;
    this.pageList = Object.keys(this.pages);
  }

  pageList: string[];
  pages: Record<string, string[]>;

  getPageList() {
    return this.pageList;
  }

  cssQueue = [];

  onImportCSS = (event) => {
    this.cssQueue.push(
      insertStyleSheet(event.detail).then(
        () => {},
        () => {}
      )
    );
  };

  prefetch(route) {
    return Promise.resolve({});
  }

  async loadPage(route: string): Promise<GoodPageCache> {
    const assets =
      this.pages[route] || this.pages[getAssetPathFromRoute(route)];

    var src;
    console.log(getAssetPathFromRoute(route), assets);
    for (let asset of assets) {
      if (!asset.endsWith(".css")) {
        src = asset;
        break;
      }
    }
    console.assert(src, "Invalid or unknown route passed to loadPage");

    document.removeEventListener("onimportcss", this.onImportCSS);
    this.cssQueue.length = 0;
    document.addEventListener("onimportcss", this.onImportCSS, {
      passive: true,
    });

    try {
      const res = await import(src);

      if (this.cssQueue.length > 0) {
        await Promise.all(this.cssQueue);
        this.cssQueue.length = 0;
      }

      document.removeEventListener("onimportcss", this.onImportCSS);

      if (this.cssQueue.length > 0) {
        await Promise.all(this.cssQueue);

        this.cssQueue.length = 0;
      }

      return {
        page: res.default,
        mod: res,
        styleSheets: [],
        __N_SSG: false,
        __N_SSP: false,
      };
    } catch (exception) {
      console.error({ exception });
    }

    // return this.routeLoader.loadRoute(route).then((res) => {
    //   debugger;
    //   if ("component" in res) {
    //     return {
    //       page: res.component,
    //       mod: res.exports,
    //       styleSheets: res.styles.map((o) => ({
    //         href: o.href,
    //         text: o.content,
    //       })),
    //     };
    //   }
    //   throw res.error;
    // });
  }

  // not used in development!
  // prefetch(route: string): Promise<void> {
  //   return this.routeLoader.prefetch(route);
  // }
}