Update dependencies + clean up (#922)

* Update dependencies + clean up

* Simpler

* Tweaks

* Fix comment based on AK’s suggestion

Author: benface

.github/workflows/website-integrity.yml

@@ -23,14 +23,8 @@ jobs:
       - name: Set up env
         uses: the-guild-org/shared-config/setup@v1
 
-      - name: Fetch remote docs
-        run: cd website && pnpm fetch-remote-docs
-
-      - name: Fetch API reference
-        run: cd website && pnpm fetch-api-reference
-
-      - name: Fix pages structure
-        run: cd website && pnpm fix-pages-structure
+      - name: Run pre-build scripts
+        run: pnpm prebuild:ci
 
       - name: Build
         run: pnpm build

Dockerfile

@@ -18,9 +18,7 @@ WORKDIR /app
 COPY . ./
 
 RUN pnpm install --frozen-lockfile
-RUN cd website && pnpm fetch-remote-docs
-RUN cd website && pnpm fetch-api-reference
-RUN cd website && pnpm fix-pages-structure
+RUN pnpm prebuild:ci
 RUN pnpm build
 
 FROM nginx:1.16.0-alpine

package.json

@@ -6,6 +6,7 @@
   "scripts": {
     "dev": "turbo run dev",
     "build": "NODE_OPTIONS='--max_old_space_size=8192' turbo run build",
+    "prebuild:ci": "turbo run prebuild:ci",
     "check": "pnpm typecheck && pnpm lint && pnpm prettier:check",
     "check:fix": "pnpm lint:fix; pnpm prettier",
     "lint": "eslint . --ignore-path .gitignore --max-warnings 0",

packages/og-image/package.json

@@ -16,7 +16,7 @@
     "yoga-wasm-web": "^0.3.3"
   },
   "devDependencies": {
-    "@cloudflare/workers-types": "^4.20250430.0",
+    "@cloudflare/workers-types": "^4.20250502.0",
     "@types/react": "^18.3.20",
     "jest-image-snapshot": "^6.4.0",
     "tsx": "^4.19.4",

pnpm-lock.yaml

@@ -10,6 +10,9 @@
       "outputs": ["dist/**"],
       "dependsOn": ["^build"]
     },
+    "prebuild:ci": {
+      "cache": false
+    },
     "typecheck": {
       "dependsOn": ["^build"]
     },

turbo.json

@@ -8,6 +8,7 @@
     "predev": "tsup ./src/i18n.ts --format esm",
     "build": "rm -rf .next && rm -rf out && next build",
     "prebuild": "pnpm predev",
+    "prebuild:ci": "pnpm fetch-remote-docs && pnpm fetch-api-reference && pnpm fix-pages-structure",
     "postbuild": "next-sitemap --config next-sitemap.config.mjs && node scripts/sitemap-ci.js",
     "typecheck": "tsc",
     "fetch-remote-docs": "tsx scripts/fetch-remote-docs.ts",
@@ -19,7 +20,7 @@
     "@docsearch/react": "^3.9.0",
     "@edgeandnode/common": "^7.0.4",
     "@edgeandnode/gds": "^6.5.14",
-    "@edgeandnode/go": "^9.4.14",
+    "@edgeandnode/go": "^10.0.2",
     "@emotion/react": "^11.14.0",
     "@graphprotocol/contracts": "6.2.1",
     "@pinax/graph-networks-registry": "^0.6.7",

website/package.json

@@ -1,10 +1,7 @@
 import { NetworkType } from '@pinax/graph-networks-registry'
-import { useData } from 'nextra/hooks'
-import type { ComponentPropsWithoutRef } from 'react'
 
-import { classNames, ExperimentalLink, Tooltip } from '@edgeandnode/gds'
+import { ButtonOrLink, ExperimentalLink, Tooltip } from '@edgeandnode/gds'
 import {
-  Clock,
   Firehose,
   GraphExplorer,
   GraphNode,
@@ -17,9 +14,9 @@ import { NetworkIcon } from '@edgeandnode/go'
 
 import { Card, Heading, TimeIcon } from '@/components'
 import { useI18n } from '@/i18n'
-import { getSupportedNetworks } from '@/supportedNetworks'
+import { type SupportedNetwork } from '@/supportedNetworks'
 
-export default function HomePage() {
+export default function HomePage({ supportedNetworks }: { supportedNetworks: SupportedNetwork[] }) {
   const { t } = useI18n()
 
   return (
@@ -141,7 +138,38 @@ export default function HomePage() {
               </ExperimentalLink>,
             ])}
           </p>
-          <SupportedNetworks className="mt-8" />
+          <div className="graph-docs-not-markdown mt-8 overflow-clip rounded-8 border border-space-1500">
+            <ul className="grid grid-cols-auto-fill-16 gap-px text-space-500">
+              {supportedNetworks
+                // TODO: Don't filter out testnets that don't have a mainnet
+                .filter((network) => network.networkType === NetworkType.Mainnet)
+                // Filter out networks that are either duplicates (same logo, same or similar short name) or irrelevant in this view
+                .filter(
+                  (network) =>
+                    !network.caip2Id.startsWith('beacon:') &&
+                    !['boba-bnb', 'eos-evm', 'polygon-zkevm', 'solana-accounts'].includes(network.id),
+                )
+                // Filter out networks that don't have a proper monochrome logo
+                .filter((network) => {
+                  return network.id !== 'zora'
+                })
+                .map((network) => (
+                  <li key={network.id} className="-mb-px -mr-px">
+                    <Tooltip content={network.shortName}>
+                      <ButtonOrLink
+                        href={`/supported-networks/${network.id}`}
+                        className={`
+                          flex aspect-square items-center justify-center border-b border-r border-space-1500 -outline-offset-1 transition
+                          hover:bg-space-1600
+                        `}
+                      >
+                        <NetworkIcon network={network} size={6} />
+                      </ButtonOrLink>
+                    </Tooltip>
+                  </li>
+                ))}
+            </ul>
+          </div>
         </section>
 
         <hr />
@@ -247,35 +275,3 @@ export default function HomePage() {
     </>
   )
 }
-
-function SupportedNetworks({ className, ...props }: ComponentPropsWithoutRef<'div'>) {
-  const { supportedNetworks } = useData() as { supportedNetworks: Awaited<ReturnType<typeof getSupportedNetworks>> }
-
-  return (
-    <div
-      className={classNames(['graph-docs-not-markdown overflow-clip rounded-8 border border-space-1500', className])}
-      {...props}
-    >
-      <ul className="grid grid-cols-auto-fill-16 gap-px text-space-500">
-        {supportedNetworks
-          // TODO: Don't filter out testnets that don't have a mainnet
-          .filter((network) => network.networkType === NetworkType.Mainnet)
-          // Filter out networks that are either duplicates (same logo, same or similar short name) or irrelevant in this view
-          .filter(
-            (network) =>
-              !network.caip2Id.startsWith('beacon:') &&
-              !['boba-bnb', 'eos-evm', 'polygon-zkevm', 'solana-accounts'].includes(network.id),
-          )
-          // TODO: Fix Zora mono logo in web3icons
-          .filter((network) => network.id !== 'zora')
-          .map((network) => (
-            <Tooltip key={network.id} content={network.shortName}>
-              <li className="-mb-px -mr-px flex aspect-square items-center justify-center border-b border-r border-space-1500 transition hover:bg-space-1600">
-                <NetworkIcon caip2Id={network.caip2Id as any} size={6} />
-              </li>
-            </Tooltip>
-          ))}
-      </ul>
-    </div>
-  )
-}

website/src/HomePage.tsx

@@ -45,17 +45,17 @@ export const Callout = ({
       className={classNames([
         `flex gap-2 rounded-8 border p-4 ps-3
         data-[variant=important]:border-solar-500/50
-        data-[variant=info]:border-astro-500/50
+        data-[variant=info]:border-galactic-500/50
         data-[variant=important]:bg-solar-500/10
-        data-[variant=info]:bg-astro-500/10
+        data-[variant=info]:bg-galactic-500/10
         --:my-8 --:last:mb-0 -:is-[li>*]:my-4`,
         className,
       ])}
       {...(props as ComponentPropsWithoutRef<'div'>)}
     >
       <div className="flex size-6 shrink-0 items-center justify-center">
         {variant === 'info' ? (
-          <Lightbulb size={4} color="astro-500" alt={!title ? t('global.content.callout.note') : ''} />
+          <Lightbulb size={4} color="galactic-500" alt={!title ? t('global.content.callout.note') : ''} />
         ) : (
           <ExclamationMark size={4} color="solar-500" alt={!title ? t('global.content.callout.important') : ''} />
         )}

website/src/components/Callout.tsx

@@ -1,5 +1,4 @@
 import { translate } from '@edgeandnode/gds'
-import { RemoteContent } from 'nextra/components'
 import { buildDynamicMDX } from 'nextra/remote'
 
 import { supportedLocales, translations } from '@/i18n'
@@ -22,8 +21,7 @@ hideTableOfContents: true
 hideContentHeader: true
 hideContentFooter: true
 unwrapContent: true
----
-<PageNotFound />`
+---`
   const mdx = await buildDynamicMDX(rawMdx, { codeHighlight: false })
   const { pageMap } = await import(`.next/static/chunks/nextra-page-map-${locale}.mjs`)
   return {
@@ -34,4 +32,4 @@ unwrapContent: true
   }
 }
 
-<RemoteContent components={{ PageNotFound }} />
+<PageNotFound />