Sanity studio bundle update checker

bundleChecker.js

import {useEffect} from 'react'
import config from 'config:sanity'

const BUNDLE_CHECK_INTERVAL = 15 * 1000

async function getCurrentHash() {
  const basePath = (config.project && config.project.basePath) || '/'
  const html = await fetch(basePath).then((res) => res.text())
  const [, hash] = html.match(/app\.bundle\.js\?(\w+)/) || []
  return hash
}

export default function bundleChecker() {
  let hash = null
  useEffect(() => {
    getCurrentHash().then((newHash) => {
      hash = newHash
    })

    const interval = setInterval(async () => {
      const newHash = await getCurrentHash()
      if (hash && newHash !== hash) {
        window.location.reload()
      }
    }, BUNDLE_CHECK_INTERVAL)

    return () => clearInterval(interval)
  }, [])

  // We're a react component, in theory, so return null to not render anything
  return null
}

sanity.json

{
  "root": true,
  "//": "...",
  "parts": [
    {
      "implements": "part:@sanity/base/absolutes",
      "path": "./bundleChecker.js"
    }
  ]
}