fix(ci): run Node CI on Node 22 with pnpm and repair the build

.github/workflows/nodejs.yml

@@ -4,23 +4,24 @@ on: [push]
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
-    strategy:
-      matrix:
-        node-version: [8.x, 10.x, 12.x]
-
     steps:
-    - uses: actions/checkout@v3
-    - name: Use Node.js ${{ matrix.node-version }}
-      uses: actions/setup-node@v3
+    - uses: actions/checkout@v7
+
+    - uses: pnpm/action-setup@v6
       with:
-        node-version: ${{ matrix.node-version }}
-    - name: npm install, build, and test
+        version: 9.15.0
+
+    - name: Use Node.js 22.x
+      uses: actions/setup-node@v7
+      with:
+        node-version: 22.x
+        cache: pnpm
+
+    - name: Install and build
       run: |
-        npm install
-        npm run build --if-present
-        npm test
+        pnpm install --frozen-lockfile
+        pnpm build
       env:
         CI: true

components/CommandMenu/index.tsx

@@ -1,7 +1,7 @@
 import React from "react"
 import { useRouter } from "next/router"
 import { Command } from "cmdk"
-import tinykeys from "tinykeys"
+import { tinykeys } from "tinykeys"
 import useOnClickOutside from "use-onclickoutside"
 import { useTheme } from "next-themes"
 import Home from "@ui/Icons/home"

components/PageTitle/index.tsx

@@ -1,4 +1,4 @@
-import { Unbounded } from '@next/font/google'
+import { Unbounded } from 'next/font/google'
 import { styled } from 'stitches.config'
 
 const Title = styled('h1', {
@@ -9,7 +9,7 @@ const Title = styled('h1', {
   transition: 'color 0.25s ease',
 })
 
-const unbounded = Unbounded()
+const unbounded = Unbounded({ subsets: ['latin'] })
 
 type ContainerProps = {
   children: React.ReactNode

lib/bookmarks.ts

@@ -4,6 +4,10 @@ const PER_PAGE = 50
 
 export const fetchBookmarks = async (page = 0): Promise<Bookmark[]> => {
 
+  if (!process.env.RAINDROP_COLLECTION || !process.env.RAINDROP_TOKEN) {
+    return []
+  }
+
   const req = await fetch(
     `https://api.raindrop.io/rest/v1/raindrops/${process.env.RAINDROP_COLLECTION}?sort=-created&search=type:link&perpage=${PER_PAGE}&page=${page}`,
     {

lib/reading.ts

@@ -4,6 +4,10 @@ const PER_PAGE = 50
 
 export const fetchReading = async (page = 0): Promise<Bookmark[]> => {
 
+  if (!process.env.RAINDROP_COLLECTION || !process.env.RAINDROP_TOKEN) {
+    return []
+  }
+
   const req = await fetch(
     `https://api.raindrop.io/rest/v1/raindrops/${process.env.RAINDROP_COLLECTION}?sort=-created&search=type:article&perpage=${PER_PAGE}&page=${page}`,
     {

next.config.js

@@ -35,9 +35,6 @@ module.exports = withPlausibleProxy()(
     },
     experimental: {
       largePageDataBytes: 256 * 100000, // 12800KB by default
-      fontLoaders: [
-      { loader: '@next/font/google', options: { subsets: ['latin'] } }
-    ]
     },
     async redirects() {
       return [

package.json

@@ -20,7 +20,7 @@
   },
   "dependencies": {
     "@acab/reset.css": "^0.11.0",
-    "@calcom/embed-react": "1.5.1",
+    "@calcom/embed-react": "1.5.3",
     "@next/font": "^14.2.15",
     "@notionhq/client": "1.0.4",
     "@plaiceholder/next": "3.0.0",

pages/_app.tsx

@@ -8,11 +8,11 @@ import { SpeedInsights } from "@vercel/speed-insights/next"
 import PlausibleProvider from 'next-plausible'
 import { DefaultSeo } from 'next-seo'
 import SEO from '../next-seo.config'
-import { Albert_Sans } from '@next/font/google'
+import { Albert_Sans } from 'next/font/google'
 import { globalStyles } from '@styles/global'
 import '@styles/reset.css'
 
-const Albert = Albert_Sans()
+const Albert = Albert_Sans({ subsets: ['latin'] })
 
 export default function App({ Component, pageProps }: AppProps) {
   globalStyles()

pages/gear.tsx

@@ -64,6 +64,9 @@ export default function Gear({ list }) {
 
 //notion API
 export async function getStaticProps() {
+  if (!process.env.NOTION_API_KEY) {
+    return { props: { list: [] } }
+  }
   const notion = new Client({ auth: process.env.NOTION_API_KEY })
 
   const response = await notion.databases.query({

pages/newsletters.tsx

@@ -60,6 +60,9 @@ export default function Newsletters({ list }) {
 }
 //notion API
 export async function getStaticProps() {
+  if (!process.env.NOTION_API_KEY) {
+    return { props: { list: [] } }
+  }
   const notion = new Client({ auth: process.env.NOTION_API_KEY })
 
   const response = await notion.databases.query({

pages/podcasts.tsx

@@ -75,6 +75,9 @@ export default function Podcasts({ list }) {
 }
 //notion API
 export async function getStaticProps() {
+  if (!process.env.NOTION_API_KEY) {
+    return { props: { list: [] } }
+  }
   const notion = new Client({ auth: process.env.NOTION_API_KEY })
 
   const response = await notion.databases.query({

pages/stack.tsx

@@ -55,6 +55,9 @@ export default function Stack({ list }) {
 }
 //notion API
 export async function getStaticProps() {
+  if (!process.env.NOTION_API_KEY) {
+    return { props: { list: [] } }
+  }
   const notion = new Client({ auth: process.env.NOTION_API_KEY })
 
   const response = await notion.databases.query({