Extract out CPU as a prop

vweb/src/emulator_display.jsx

@@ -1,34 +1,26 @@
-import React, { useCallback, useEffect, useRef } from 'react'
+import React, { useCallback, useEffect, useRef, useMemo } from 'react'
-import { WasmCPU, Display } from '../pkg/vweb.js'
+import { Display } from '../pkg'
 
-export default function({}) {
+export default function({ cpu }) {
     const canvas = useRef(null)
-    const cpu = useRef(new WasmCPU())
     const ctx = useRef(null)
-    const display = useRef(null)
+    const display = useMemo(() => new Display(), [])
     const request = useRef(null)
 
-    const blah = useRef(0)
-
     const drawFrame = useCallback(() => {
-        // for(let n = 0; n < 160 * 120; n++) {
+        display.draw(cpu, ctx.current)
-        //     cpu.current.poke(0x10000 + n, n % 256 /* Math.random() * 256 */)
-        // }
-        display.current.draw(cpu.current, ctx.current)
         request.current = requestAnimationFrame(drawFrame)
-    }, [])
+    }, [display, cpu])
 
     useEffect(() => {
-        cpu.current.poke(16 + 0, 3)
-        cpu.current.poke24(16 + 10, 160) // Set the virtual h / w
-        cpu.current.poke24(16 + 13, 120)
         ctx.current = canvas.current.getContext('2d')
-        display.current = new Display()
         request.current = requestAnimationFrame(drawFrame)
         return () => cancelAnimationFrame(request.current)
-    }, [canvas.current])
+    }, [canvas.current, drawFrame])
 
     return (
-        <canvas ref={canvas} width={640} height={480}></canvas>
+        <div className='display'>
+            <canvas ref={canvas} width={640} height={480}></canvas>
+        </div>
     )
 }