⌨️ Keyboard shortcut for folding cell

frontend/components/CellInput.js

@@ -628,6 +628,11 @@ export const CellInput = ({
                 return direction === 1 ? moveLineDown(cm) : moveLineUp(cm)
             }
         }
+        const keyMapFold = (/** @type {EditorView} */ cm, new_value) => {
+            set_cm_forced_focus(true)
+            pluto_actions.fold_remote_cells([cell_id], new_value)
+            return true
+        }
 
         const plutoKeyMaps = [
             { key: "Shift-Enter", run: keyMapSubmit },
@@ -645,7 +650,8 @@ export const CellInput = ({
             { key: "Ctrl-Backspace", run: keyMapBackspace },
             { key: "Alt-ArrowUp", run: (x) => keyMapMoveLine(x, -1) },
             { key: "Alt-ArrowDown", run: (x) => keyMapMoveLine(x, 1) },
-
+            { key: "Ctrl-Shift-[", mac: "Cmd-Alt-[", run: (x) => keyMapFold(x, true) },
+            { key: "Ctrl-Shift-]", mac: "Cmd-Alt-]", run: (x) => keyMapFold(x, false) },
             mod_d_command,
         ]
 
@@ -917,6 +923,7 @@ export const CellInput = ({
                     head: cm.state.selection.main.head,
                 },
             })
+        } else if (cm_forced_focus === true) {
         } else {
             let new_selection = {
                 anchor: line_and_ch_to_cm6_position(cm.state.doc, cm_forced_focus[0]),
@@ -1032,7 +1039,7 @@ const InputContextMenu = ({ on_delete, cell_id, run_cell, skip_as_script, runnin
             })
     }
 
-    useEventListener(window, "keydown", (e) => {
+    useEventListener(window, "keydown", (/** @type {KeyboardEvent} */ e) => {
         if (e.key === "Escape") {
             setOpen(false)
         }

frontend/components/Editor.js

@@ -583,7 +583,7 @@ export class Editor extends Component {
             fold_remote_cells: async (cell_ids, new_value) => {
                 await update_notebook((notebook) => {
                     for (let cell_id of cell_ids) {
-                        notebook.cell_inputs[cell_id].code_folded = new_value
+                        notebook.cell_inputs[cell_id].code_folded = new_value ?? !notebook.cell_inputs[cell_id].code_folded
                     }
                 })
             },
@@ -1188,6 +1188,10 @@ patch: ${JSON.stringify(
         this.run_selected = () => {
             return this.actions.set_and_run_multiple(this.state.selected_cells)
         }
+        this.fold_selected = (new_val) => {
+            if (_.isEmpty(this.state.selected_cells)) return
+            return this.actions.fold_remote_cells(this.state.selected_cells, new_val)
+        }
         this.move_selected = (/** @type {KeyboardEvent} */ e, /** @type {1|-1} */ delta) => {
             if (this.state.selected_cells.length > 0) {
                 const current_indices = this.state.selected_cells.map((id) => this.state.notebook.cell_order.indexOf(id))
@@ -1253,6 +1257,8 @@ patch: ${JSON.stringify(
                     // TODO: let user know that the notebook autosaves
                 }
                 e.preventDefault()
+            } else if (["BracketLeft", "BracketRight"].includes(e.code) && (is_mac_keyboard ? e.altKey && e.metaKey : e.ctrlKey && e.shiftKey)) {
+                this.fold_selected(e.code === "BracketLeft")
             } else if (e.key === "Backspace" || e.key === "Delete") {
                 if (this.delete_selected("Delete")) {
                     e.preventDefault()
@@ -1267,29 +1273,32 @@ patch: ${JSON.stringify(
                 // On mac "cmd+shift+?" is used by chrome, so that is why this needs to be ctrl as well on mac
                 // Also pressing "ctrl+shift" on mac causes the key to show up as "/", this madness
                 // I hope we can find a better solution for this later - Dral
+
+                const fold_prefix = is_mac_keyboard ? `⌥${and}⌘` : `Ctrl${and}Shift`
+
                 alert(
-                    `Shortcuts 🎹
-
-    ⇧${and}Enter:   run cell
-    ${ctrl_or_cmd_name}${and}Enter:   run cell and add cell below
-    ${ctrl_or_cmd_name}${and}S:   submit all changes
-    Delete or Backspace:   delete empty cell
-
-    page up or fn${and}↑:   jump to cell above
-    page down or fn${and}↓:   jump to cell below
-    ${alt_or_options_name}${and}↑:   move line/cell up
-    ${alt_or_options_name}${and}↓:   move line/cell down
-
-    
-    Select multiple cells by dragging a selection box from the space between cells.
-    ${ctrl_or_cmd_name}${and}C:   copy selected cells
-    ${ctrl_or_cmd_name}${and}X:   cut selected cells
-    ${ctrl_or_cmd_name}${and}V:   paste selected cells
-    
-    ${control_name}${and}M:   toggle markdown
-    ${ctrl_or_cmd_name}${and}Q:   interrupt notebook
-
-    The notebook file saves every time you run a cell.`
+                    `
+⇧${and}Enter:   run cell
+${ctrl_or_cmd_name}${and}Enter:   run cell and add cell below
+${ctrl_or_cmd_name}${and}S:   submit all changes
+Delete or Backspace:   delete empty cell
+
+PageUp or fn${and}↑:   jump to cell above
+PageDown or fn${and}↓:   jump to cell below
+${alt_or_options_name}${and}↑:   move line/cell up
+${alt_or_options_name}${and}↓:   move line/cell down
+
+${control_name}${and}M:   toggle markdown
+${fold_prefix}${and}[:   hide cell code
+${fold_prefix}${and}]:   show cell code
+${ctrl_or_cmd_name}${and}Q:   interrupt notebook
+
+Select multiple cells by dragging a selection box from the space between cells.
+${ctrl_or_cmd_name}${and}C:   copy selected cells
+${ctrl_or_cmd_name}${and}X:   cut selected cells
+${ctrl_or_cmd_name}${and}V:   paste selected cells
+
+The notebook file saves every time you run a cell.`
                 )
                 e.preventDefault()
             } else if (e.key === "Escape") {

frontend/editor.css

@@ -1887,7 +1887,8 @@ pluto-input > .preview_hidden_code_info {
     pointer-events: none;
 }
 
-body:not(.process_waiting_for_permission) pluto-cell.code_folded pluto-input > .preview_hidden_code_info {
+body:not(.process_waiting_for_permission) pluto-cell.code_folded pluto-input > .preview_hidden_code_info,
+pluto-cell.code_folded:focus-within pluto-input > .preview_hidden_code_info {
     display: block;
 }