handle readonly connection in UI

packages/web/src/formview/ChangeSetFormer.ts

@@ -82,6 +82,9 @@ export default class ChangeSetFormer extends Former {
   redo() {
     this.dispatchChangeSet({ type: 'redo' });
   }
+  get editable() {
+    return this.display.editable;
+  }
   get canUndo() {
     return this.changeSetState.canUndo;
   }

packages/web/src/formview/FormView.svelte

@@ -327,6 +327,7 @@
   const [inplaceEditorState, dispatchInsplaceEditor] = createReducer((state, action) => {
     switch (action.type) {
       case 'show': {
+        if (!former.editable) return {};
         const column = getCellColumn(action.cell);
         if (!column) return state;
         if (column.uniquePath.length > 1) return state;