Adding clear-storage helper button

3 hours ago · eef4daf8ec
parent 8c3237e0db
commit eef4daf8ec
3 changed files with 13 additions and 2 deletions
--- a/index.html
+++ b/index.html
@ -23,11 +23,17 @@ canvas {
    width: 100%;
    height: 100%;
 }
+
+#clear-storage {
+    position: absolute;
+    top: 0; right: 0;
+}
    </style>
  </head>

  <body>
    <div id="app"></div>
+    <button id="clear-storage">Clear Storage</button>
    <script type="module" src="/src/main.ts"></script>
  </body>
 </html>
--- a/src/main.ts
+++ b/src/main.ts
@ -6,7 +6,7 @@ import { runApp } from './runtime';
 import { builtins } from './builtins';
 import { CGError } from './error';
 import { createStore, startTracking, stopTracking, buildDependents } from './store';
-import { loadStore } from './persistence';
+import { loadStore, clearStore } from './persistence';

 import stdlibCode from './stdlib.cg?raw';
 import designTokensCode from './design-tokens.cg?raw';
@ -19,6 +19,11 @@ import textInputCode from './textinput-test.cg?raw';
 const canvas = document.createElement('canvas') as HTMLCanvasElement;
 document.body.appendChild(canvas);

+const clearButton = document.getElementById('clear-storage');
+if (clearButton) {
+    clearButton.onclick = () => clearStore();
+}
+
 const cgCode = stdlibCode + '\n' +
    designTokensCode + '\n' +
    uiComponentsCode + '\n' +
--- a/src/persistence.ts
+++ b/src/persistence.ts
@ -25,5 +25,5 @@ export function loadStore(): Record<string, { body: AST, source: string }> | nul
 }

 export function clearStore() {
-    localStorage.remove(STORAGE_KEY);
+    localStorage.removeItem(STORAGE_KEY);
 }