refactor settings to nanostores

website/src/docs/MiniRepl.jsx

@@ -4,7 +4,7 @@ import { useEffect, useState } from 'react';
 import { prebake } from '../repl/prebake';
 import { themes, settings } from '../repl/themes.mjs';
 import './MiniRepl.css';
-import useStore from '../useStore.mjs';
+import { useSettings } from '../settings.mjs';
 
 let modules;
 if (typeof window !== 'undefined') {
@@ -28,9 +28,7 @@ if (typeof window !== 'undefined') {
 
 export function MiniRepl({ tune, drawTime, punchcard, canvasHeight = 100 }) {
   const [Repl, setRepl] = useState();
-  const {
-    state: { theme },
-  } = useStore();
+  const { theme } = useSettings();
   useEffect(() => {
     // we have to load this package on the client
     // because codemirror throws an error on the server