temp-fix: clear json & delete cells, alt+n newCell

scripter/src/components/codemirror.js

@@ -91,23 +91,24 @@ export default function Codespace({ index, data, func, editable }) {
         <CodeMirror value={codes || `// Let start coding\n// (Shift + Enter) to Execute\n`} min-height="200px" theme={githubDark} extensions={[javascript({ jsx: true })]} onChange={(value) => setCodes(value)} />
 
         <ul className="cellButtons">
-            <button disabled={!editable} title="del" onClick={() => deleteFunc(index)} className={`${styles.Button} ${open? "visible":"invisible"}`} >
+            {/*<button disabled={true} title="del" onClick={() => deleteFunc(index)} className={`${styles.Button} ${open? "visible":"invisible"}`} >
               Cell <i className="bi bi-trash-fill" />
-            </button>
-
+            </button>*/}
+
+            <span></span>
+            <span></span>
             <button disabled={!editable} title="ctrl + backspace" onClick={() => clearFunc(index)} className={`${styles.Button} ${open? "visible":"invisible"}`} >
               Clear <i className="bi bi-eraser-fill" />
             </button>
+
+            <button disabled={!editable} onClick={() => setOpen(!open)} className={styles.Button}>
+              Open <i className="bi bi-grid-fill" />
+            </button>
 
             <button disabled={!editable} title="ctrl + S" onClick={saveThisCell.current} className={`${styles.Button} saveCell ${open? "visible":"invisible"}`} >
               Save <i className="bi bi-save2" />
             </button>
 
-            <button disabled={!editable} onClick={() => setOpen(!open)} className={styles.Button}>
-              Open <i className="bi bi-grid-fill" />
-            </button>
-
-            <span></span>
             <RunButton />
         </ul>
 

scripter/src/components/codespace.js

@@ -76,6 +76,15 @@ const CodeSpaceContainer = forwardRef((props, ref) => {
     }
   }, [code]);
 
+  useEffect(() => {
+    document.addEventListener("keydown", (e) => {
+      if (e.altKey && e.keyCode == 78) {
+        e.preventDefault(); 
+        newCell('cell')
+      }
+    })
+  }, [])
+
   if (codeLoading) return <Loading error={null} />;
   if (codeError) return <Loading error={codeError} />;
 
@@ -131,13 +140,13 @@ const CodeSpaceContainer = forwardRef((props, ref) => {
       <div className="container d-flex">
 
       <ul className="mx-auto btn-group cellButtons">
-        <button disabled={!editable}
+        <button title="Alt + N" disabled={!editable}
           onClick={() => newCell("cell")}
           className={`${styles.Button} rounded-0 border-end-0 rounded-start`}
         >
           Add Cell <i className="bi bi-plus-square-fill"></i>
         </button>
-        <button
+        <button title="bug fix"
           disabled={true}
           onClick={() => newCell("web")}
           className={`${styles.Button} rounded-0 border-end-0`}

scripter/src/components/statemanage.js

@@ -10,7 +10,7 @@ export default function SharedDom({file, func, userEmail}) {
   const {id, json, edit: editable} = file
   const {deleteAllCell,updateTheFile} = func
 
-  const [codes, setCodes] = useState('')
+  const [codes, setCodes] = useState("{}")
   const [reableOnly, setReable] = useState(!editable)
 
   function updateCode(){
@@ -53,11 +53,11 @@ export default function SharedDom({file, func, userEmail}) {
 
   function clearJSON(){
     let text = "Are you sure you want to clear all the JSON?"
-    if (confirm(text)) setCodes('')
+    if (confirm(text)) setCodes("{}")
   }
 
   useEffect(() => {
-    let value = JSON.stringify(json, undefined, 4)
+    let value = JSON.stringify(json || {}, undefined, 4)
     setCodes(value)
 
     document.addEventListener('keydown', (e) => {
@@ -83,7 +83,7 @@ export default function SharedDom({file, func, userEmail}) {
                   <button disabled={true} title='Ctrl + F' className={`${styles.Button} rounded-0 rounded-end`}>Fork <i className="bi bi-option"/></button>
                 </div>
                 <div className='btn-group'>
-                  <button disabled={!editable} onClick={deleteAllCell} title='' className={`${styles.Button} rounded-0 border-end-0 rounded-start`}>Delete All Cells <i className="bi bi-trash-fill"/></button>
+                  <button disabled={true} onClick={deleteAllCell} title='bug fix' className={`${styles.Button} rounded-0 border-end-0 rounded-start`}>Delete All Cells <i className="bi bi-trash-fill"/></button>
                   <button disabled={!editable} onClick={clearJSON} title='' className={`${styles.Button} rounded-0 rounded-end`}>Clear JSON <i className="bi bi-eraser-fill"/></button>
                 </div>
             </ul>