chore(website): remove tracing and use fetch instead

packages/crypto-frontmatter/src/cli.ts

@@ -3,27 +3,51 @@ import { join } from 'node:path';
 
 import { Command, Option, runExit } from 'clipanion';
 
-import { getFrontmatterIndexArray, getInstalledFrontmatterCollection, getNodeModulesPath } from './index';
+import {
+  FrontmatterCollection,
+  getFrontmatterIndexArray,
+  getInstalledFrontmatterCollection,
+  getNodeModulesPath,
+} from './index';
 
 export class MirrorCommand extends Command {
   static override paths = [[`mirror`]];
   private target = Option.String();
+  private include = Option.Array(`--include`, { required: false });
+
+  private includes(type: string): boolean {
+    return this.include?.includes(type) ?? true;
+  }
+
+  private async mirrorFile(collection: FrontmatterCollection, file: string): Promise<void> {
+    const from = getNodeModulesPath(collection.caip2, collection.namespace, file);
+    const to = join(this.target, file);
+    await copyFile(from, to);
+  }
 
   async execute(): Promise<number | void> {
     await mkdir(this.target, { recursive: true });
 
-    const collections = await getInstalledFrontmatterCollection();
-    for (const collection of collections) {
+    for (const collection of await getInstalledFrontmatterCollection()) {
       let count = 0;
-      const indexArray = await getFrontmatterIndexArray(collection.caip2, collection.namespace);
 
-      for (const index of indexArray) {
-        for (const image of index.fields.images) {
-          const from = getNodeModulesPath(collection.caip2, collection.namespace, image.path);
-          const to = join(this.target, image.path);
-          await copyFile(from, to);
+      if (this.includes('index.json')) {
+        await this.mirrorFile(collection, 'index.json');
+        count++;
+      }
+
+      for (const index of await getFrontmatterIndexArray(collection.caip2, collection.namespace)) {
+        if (this.includes('frontmatter.json')) {
+          await this.mirrorFile(collection, index.fileId + '.json');
           count++;
         }
+
+        if (this.includes('images')) {
+          for (const image of index.fields.images) {
+            await this.mirrorFile(collection, image.path);
+            count++;
+          }
+        }
       }
 
       this.context.stdout.write(`Mirrored ${count} files for "${collection.caip2}/${collection.namespace}"\n`);

website/app/[caip2]/[asset]/page.tsx

@@ -1,4 +1,4 @@
-import { FrontmatterContent, getFrontmatterContent as getUsingFs } from 'crypto-frontmatter';
+import { computeFileId, FrontmatterContent } from 'crypto-frontmatter';
 import { Metadata } from 'next';
 import Image from 'next/image';
 import { notFound } from 'next/navigation';
@@ -7,22 +7,20 @@ import type { ReactElement } from 'react';
 import { ContentedProse } from '@/components/contented/ContentedProse';
 import { renderHighlighterHtml } from '@/components/contented/ShikiHighlighter';
 
-async function getFrontmatterContent(params: {
-  caip2: string;
-  asset: string;
-}): Promise<FrontmatterContent | undefined> {
+async function getFrontmatterContent(params: { caip2: string; asset: string }): Promise<FrontmatterContent> {
   const caip19 = `${decodeURIComponent(params.caip2)}/${decodeURIComponent(params.asset)}`;
-  return getUsingFs(caip19);
+  const fileId = computeFileId(caip19);
+  const response = await fetch(`${process.env.BASE_URL}/_crypto-frontmatter/${fileId}.json`);
+  if (!response.ok) {
+    return notFound();
+  }
+  return await response.json();
 }
 
 export async function generateMetadata(props: Parameters<typeof Page>[0]): Promise<Metadata> {
   const frontmatter = await getFrontmatterContent(props.params);
-  if (frontmatter === undefined) {
-    return notFound();
-  }
 
   const title = frontmatter.fields.title ?? frontmatter.fields.symbol;
-
   return {
     title: title,
     description: frontmatter.fields.description,
@@ -45,10 +43,6 @@ export default async function Page(props: {
   };
 }): Promise<ReactElement> {
   const frontmatter = await getFrontmatterContent(props.params);
-  if (frontmatter === undefined) {
-    return notFound();
-  }
-
   const image = frontmatter.fields.images?.find((image) => image.type === 'logo');
 
   return (
@@ -69,7 +63,7 @@ export default async function Page(props: {
 
         <div className="border-mono-800 group/json mt-8 rounded border">
           <header className="bg-mono-950 text-mono-500 relative flex items-center justify-between rounded-t border-b px-4 py-2 text-sm">
-            <div>Frontmatter.json</div>
+            <div>frontmatter.json</div>
             <div>
               <button>
                 <div className="block group-focus-within/json:hidden">▲</div>

website/next.config.mjs

@@ -15,11 +15,6 @@ const nextConfig = {
     BASE_URL: getBaseUrl(),
   },
   output: 'standalone',
-  experimental: {
-    outputFileTracingIncludes: {
-      '/': ['./node_modules/@crypto-frontmatter/*/dist/Frontmatter/*.json'],
-    },
-  },
   trailingSlash: false,
   reactStrictMode: true,
   swcMinify: true,

website/package.json

@@ -7,7 +7,7 @@
     "clean": "rm -rf .next public/_crypto-frontmatter",
     "dev": "next dev",
     "lint": "eslint .",
-    "mirror": "crypto-frontmatter mirror public/_crypto-frontmatter",
+    "mirror": "crypto-frontmatter mirror public/_crypto-frontmatter --include images --include frontmatter.json",
     "start": "next start"
   },
   "lint-staged": {