chore: initial test

.github/workflows/format-if-needed.yml

@@ -18,10 +18,11 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
       - uses: actions/setup-node@v4
         with:
+          cache: pnpm
           node-version: lts/*
-      - run: corepack enable && pnpm --version
       - run: pnpm install --ignore-scripts
       - run: pnpm format
       - run: git restore .github/workflows CHANGELOG.md
@@ -30,13 +31,14 @@ jobs:
         with:
           app-id: ${{ secrets.ECOSCRIPT_APP_ID }}
           private-key: ${{ secrets.ECOSCRIPT_APP_PRIVATE_KEY }}
-      - uses: peter-evans/create-pull-request@c5a7806660adbe173f04e3e038b0ccdcd758773c # v6
+      - uses: peter-evans/create-pull-request@5e914681df9dc83aa4e4905692ca88beb2f9e91f # v7
         with:
           author: github-actions <41898282+github-actions[bot]@users.noreply.github.com>
           body: I ran `pnpm format` 🧑‍💻
           branch: actions/format
           commit-message: 'chore(format): 🤖 ✨'
           delete-branch: true
           labels: 🤖 bot
+          sign-commits: true
           title: 'chore(format): 🤖 ✨'
           token: ${{ steps.generate-token.outputs.token }}

.github/workflows/main.yml

@@ -22,10 +22,11 @@ jobs:
     name: Lint & Build
     steps:
       - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
       - uses: actions/setup-node@v4
         with:
+          cache: pnpm
           node-version: lts/*
-      - run: corepack enable && pnpm --version
       - run: pnpm install
       - run: pnpm type-check
       - run: pnpm lint
@@ -44,9 +45,10 @@ jobs:
             node-version: current
     steps:
       - uses: actions/checkout@v4
+      - uses: pnpm/action-setup@v4
       - uses: actions/setup-node@v4
         with:
+          cache: pnpm
           node-version: ${{ matrix.node-version }}
-      - run: corepack enable && pnpm --version
       - run: pnpm install
       - run: pnpm test

.github/workflows/release-please.yml

@@ -22,41 +22,41 @@ jobs:
           app-id: ${{ secrets.ECOSCRIPT_APP_ID }}
           private-key: ${{ secrets.ECOSCRIPT_APP_PRIVATE_KEY }}
       # This action will create a release PR when regular conventional commits are pushed to main, it'll also detect if a release PR is merged and npm publish should happen
-      - uses: google-github-actions/release-please-action@v3
+      - uses: googleapis/release-please-action@v4
         id: release
         with:
           release-type: node
           token: ${{ steps.generate-token.outputs.token }}
 
       # Publish to NPM on new releases
       - uses: actions/checkout@v4
-        if: ${{ steps.release.outputs.releases_created }}
-      - uses: pnpm/action-setup@v2
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
+      - uses: pnpm/action-setup@v4
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
       - uses: actions/setup-node@v4
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
         with:
           cache: pnpm
           node-version: lts/*
           registry-url: 'https://registry.npmjs.org'
-      - run: corepack enable && pnpm --version && pnpm install
-        if: ${{ steps.release.outputs.releases_created }}
+      - run: pnpm install
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
       - name: Set publishing config
         run: pnpm config set '//registry.npmjs.org/:_authToken' "${NODE_AUTH_TOKEN}"
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
         env:
           NODE_AUTH_TOKEN: ${{secrets.NPM_PUBLISH_TOKEN}}
       # Release Please has already incremented versions and published tags, so we just
       # need to publish the new version to npm here
       - run: pnpm publish
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
         env:
           NPM_CONFIG_PROVENANCE: true
       # Publish to GitHub Pages
       - run: pnpm build:demo
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
       - uses: peaceiris/actions-gh-pages@4f9cc6602d3f66b9c108549d475ec49e8ef4d45e # v4
-        if: ${{ steps.release.outputs.releases_created }}
+        if: ${{ steps.release.outputs.releases_created == 'true' }}
         with:
           github_token: ${{ steps.generate-token.outputs.token }}
           publish_dir: ./demo/dist

demo/components/AnnotatedMap.tsx

@@ -1,9 +1,8 @@
 import 'leaflet/dist/leaflet.css'
 
-import {useEffect, useState} from 'react'
+import {Suspense, use} from 'react'
 
 import {PortableTextTypeComponent} from '../../src'
-import type {ReducedLeafletApi} from './Leaflet'
 
 export interface Geopoint {
   _type: 'geopoint'
@@ -25,20 +24,10 @@ export interface AnnotatedMapBlock {
   markers?: MapMarker[]
 }
 
-export const AnnotatedMap: PortableTextTypeComponent<AnnotatedMapBlock> = ({value}) => {
-  const [Leaflet, setLeaflet] = useState<ReducedLeafletApi | undefined>(undefined)
+const promise = import('./Leaflet').then((leafletApi) => leafletApi.default)
 
-  useEffect(() => {
-    import('./Leaflet').then((leafletApi) => setLeaflet(leafletApi.default))
-  }, [Leaflet, setLeaflet])
-
-  if (!Leaflet) {
-    return (
-      <div className="annotated-map loading">
-        <div>Loading map…</div>
-      </div>
-    )
-  }
+const AnnotatedMapComponent: PortableTextTypeComponent<AnnotatedMapBlock> = ({value}) => {
+  const Leaflet = use(promise)
 
   return (
     <Leaflet.MapContainer
@@ -59,3 +48,17 @@ export const AnnotatedMap: PortableTextTypeComponent<AnnotatedMapBlock> = ({valu
     </Leaflet.MapContainer>
   )
 }
+
+export const AnnotatedMap: PortableTextTypeComponent<AnnotatedMapBlock> = (props) => {
+  return (
+    <Suspense
+      fallback={
+        <div className="annotated-map loading">
+          <div>Loading map…</div>
+        </div>
+      }
+    >
+      <AnnotatedMapComponent {...props} />
+    </Suspense>
+  )
+}