game.js

import { store } from './store.js'

function gameLoop() {
	if (!store.getState().isPaused) {
		// render game elements
	}

	requestAnimationFrame(gameLoop)
}

gameLoop()

GameUI.jsx

import { useStore } from './useStore.js'

export function GameUI() {
	const { 
		isPaused,
		pause,
		play,
	} = useStore(state => ({
		isPaused: state.isPaused,
		pause: state.pause,
		play: state.play,
	}))

	return (
		<div className={'menu'}>
			<button onClick={pause}>
				{'Pause'}
			</button>
		</div>
	)
}

store.js

import create from 'zustand/vanilla'

export const store = create((set, get) => ({
	isPaused: false,
	pause() { 
		set({ isPaused: true })
	},
	play() { 
		set({ isPaused: false })
	},
})

useStore.js

import create from 'zustand'
import { store } from './store.js'

export const useStore = create(store)