diff --git a/web/boot.ts b/web/boot.ts index 45b744e..a13169e 100644 --- a/web/boot.ts +++ b/web/boot.ts @@ -1,5 +1,5 @@ import { safeRun } from "../common/util.ts"; -import { Editor } from "./editor.tsx"; +import { Editor } from "./editor.ts"; safeRun(async () => { console.log("Booting"); diff --git a/web/client_system.ts b/web/client_system.ts index ddb299b..42b7968 100644 --- a/web/client_system.ts +++ b/web/client_system.ts @@ -10,7 +10,7 @@ import assetSyscalls from "../plugos/syscalls/asset.ts"; import { eventSyscalls } from "../plugos/syscalls/event.ts"; import { storeSyscalls } from "../plugos/syscalls/store.dexie_browser.ts"; import { SysCallMapping, System } from "../plugos/system.ts"; -import type { Editor } from "./editor.tsx"; +import type { Editor } from "./editor.ts"; import { CodeWidgetHook } from "./hooks/code_widget.ts"; import { CommandHook } from "./hooks/command.ts"; import { SlashCommandHook } from "./hooks/slash_command.ts"; @@ -74,7 +74,7 @@ export class ClientSystem { this.commandHook = new CommandHook(); this.commandHook.on({ commandsUpdated: (commandMap) => { - this.editor.viewDispatch({ + this.editor.ui.viewDispatch({ type: "update-commands", commands: commandMap, }); diff --git a/web/cm_plugins/admonition.ts b/web/cm_plugins/admonition.ts index 0a1eb94..e80e4b4 100644 --- a/web/cm_plugins/admonition.ts +++ b/web/cm_plugins/admonition.ts @@ -6,7 +6,7 @@ import { syntaxTree, WidgetType, } from "../deps.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { decoratorStateField, isCursorInRange } from "./util.ts"; type AdmonitionType = "note" | "warning"; diff --git a/web/cm_plugins/clean.ts b/web/cm_plugins/clean.ts index f48b3a2..9aabba5 100644 --- a/web/cm_plugins/clean.ts +++ b/web/cm_plugins/clean.ts @@ -1,6 +1,6 @@ import type { ClickEvent } from "../../plug-api/app_event.ts"; import type { Extension } from "../deps.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; import { blockquotePlugin } from "./block_quote.ts"; import { admonitionPlugin } from "./admonition.ts"; import { directivePlugin } from "./directive.ts"; diff --git a/web/cm_plugins/command_link.ts b/web/cm_plugins/command_link.ts index e63671c..9f2f7dd 100644 --- a/web/cm_plugins/command_link.ts +++ b/web/cm_plugins/command_link.ts @@ -1,7 +1,7 @@ import { commandLinkRegex } from "../../common/markdown_parser/parser.ts"; import { ClickEvent } from "$sb/app_event.ts"; import { Decoration, syntaxTree } from "../deps.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { ButtonWidget, decoratorStateField, diff --git a/web/cm_plugins/editor_paste.ts b/web/cm_plugins/editor_paste.ts index fffdd7a..69f63e6 100644 --- a/web/cm_plugins/editor_paste.ts +++ b/web/cm_plugins/editor_paste.ts @@ -1,6 +1,6 @@ import { EditorView, syntaxTree, ViewPlugin, ViewUpdate } from "../deps.ts"; import { maximumAttachmentSize } from "../../common/types.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; // We use turndown to convert HTML to Markdown import TurndownService from "https://cdn.skypack.dev/turndown@7.1.1"; diff --git a/web/cm_plugins/fenced_code.ts b/web/cm_plugins/fenced_code.ts index c2eb1dc..da58147 100644 --- a/web/cm_plugins/fenced_code.ts +++ b/web/cm_plugins/fenced_code.ts @@ -1,7 +1,7 @@ import { WidgetContent } from "../../plug-api/app_event.ts"; import { panelHtml } from "../components/panel.tsx"; import { Decoration, EditorState, syntaxTree, WidgetType } from "../deps.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; import { CodeWidgetCallback } from "../hooks/code_widget.ts"; import { decoratorStateField, diff --git a/web/cm_plugins/inline_image.ts b/web/cm_plugins/inline_image.ts index 37b08e6..de93f61 100644 --- a/web/cm_plugins/inline_image.ts +++ b/web/cm_plugins/inline_image.ts @@ -8,7 +8,7 @@ import { import { decoratorStateField } from "./util.ts"; import type { Space } from "../space.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; class InlineImageWidget extends WidgetType { constructor( diff --git a/web/cm_plugins/table.ts b/web/cm_plugins/table.ts index 1778cad..2ce78fb 100644 --- a/web/cm_plugins/table.ts +++ b/web/cm_plugins/table.ts @@ -8,7 +8,7 @@ import { import { renderMarkdownToHtml } from "../../plugs/markdown/markdown_render.ts"; import { ParseTree } from "$sb/lib/tree.ts"; import { lezerToParseTree } from "../../common/markdown_parser/parse_tree.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; class TableViewWidget extends WidgetType { constructor( diff --git a/web/cm_plugins/wiki_link.ts b/web/cm_plugins/wiki_link.ts index 97fcfeb..71e9b25 100644 --- a/web/cm_plugins/wiki_link.ts +++ b/web/cm_plugins/wiki_link.ts @@ -1,7 +1,7 @@ import { pageLinkRegex } from "../../common/markdown_parser/parser.ts"; import { ClickEvent } from "../../plug-api/app_event.ts"; import { Decoration, syntaxTree } from "../deps.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { decoratorStateField, invisibleDecoration, diff --git a/web/components/panel.tsx b/web/components/panel.tsx index 7851e2b..4c3fc1c 100644 --- a/web/components/panel.tsx +++ b/web/components/panel.tsx @@ -1,5 +1,5 @@ import { useEffect, useRef } from "../deps.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { PanelConfig } from "../types.ts"; export const panelHtml = ` diff --git a/web/editor.tsx b/web/editor.ts similarity index 71% rename from web/editor.tsx rename to web/editor.ts index 9b6e086..86de844 100644 --- a/web/editor.tsx +++ b/web/editor.ts @@ -54,6 +54,7 @@ import { isValidPageName } from "$sb/lib/page.ts"; import { ClientSystem } from "./client_system.ts"; import { createEditorState } from "./editor_state.ts"; import { OpenPages } from "./open_pages.ts"; +import { MainUI } from "./editor_ui.tsx"; const frontMatterRegex = /^---\n(([^\n]|\n)*?)---\n/; const autoSaveInterval = 1000; @@ -71,8 +72,6 @@ declare global { // TODO: Oh my god, need to refactor this export class Editor { editorView?: EditorView; - viewState: AppViewState = initialViewState; - viewDispatch: (action: Action) => void = () => {}; pageNavigator?: PathPageNavigator; space: Space; @@ -99,6 +98,8 @@ export class Editor { // Event bus used to communicate between components eventHook: EventHook; + + ui: MainUI; openPages: OpenPages; constructor( @@ -184,7 +185,8 @@ export class Editor { }, ); - this.render(parent); + this.ui = new MainUI(this); + this.ui.render(parent); this.editorView = new EditorView({ state: createEditorState(this, "", "", false), @@ -211,19 +213,22 @@ export class Editor { if (ev.touches.length === 2) { ev.stopPropagation(); ev.preventDefault(); - this.viewDispatch({ type: "start-navigate" }); + this.ui.viewDispatch({ type: "start-navigate" }); } // Launch the command palette using a three-finger tap if (ev.touches.length === 3) { ev.stopPropagation(); ev.preventDefault(); - this.viewDispatch({ type: "show-palette", context: this.getContext() }); + this.ui.viewDispatch({ + type: "show-palette", + context: this.getContext(), + }); } }); } get currentPage(): string | undefined { - return this.viewState.currentPage; + return this.ui.viewState.currentPage; } async init() { @@ -239,7 +244,7 @@ export class Editor { } }, pageListUpdated: (pages) => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "pages-listed", pages: pages, }); @@ -338,10 +343,10 @@ export class Editor { // Reset for next sync cycle this.system.plugsUpdated = false; - this.viewDispatch({ type: "sync-change", synced: true }); + this.ui.viewDispatch({ type: "sync-change", synced: true }); }); this.eventHook.addLocalListener("sync:error", (name) => { - this.viewDispatch({ type: "sync-change", synced: false }); + this.ui.viewDispatch({ type: "sync-change", synced: false }); }); this.eventHook.addLocalListener("sync:conflict", (name) => { this.flashNotification( @@ -384,8 +389,8 @@ export class Editor { () => { if (this.currentPage) { if ( - !this.viewState.unsavedChanges || - this.viewState.uiOptions.forcedROMode + !this.ui.viewState.unsavedChanges || + this.ui.viewState.uiOptions.forcedROMode ) { // No unsaved changes, or read-only mode, not gonna save return resolve(); @@ -398,7 +403,7 @@ export class Editor { true, ) .then(async (meta) => { - this.viewDispatch({ type: "page-saved" }); + this.ui.viewDispatch({ type: "page-saved" }); await this.dispatchAppEvent( "editor:pageSaved", this.currentPage, @@ -425,7 +430,7 @@ export class Editor { flashNotification(message: string, type: "info" | "error" = "info") { const id = Math.floor(Math.random() * 1000000); - this.viewDispatch({ + this.ui.viewDispatch({ type: "show-notification", notification: { id, @@ -436,7 +441,7 @@ export class Editor { }); setTimeout( () => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "dismiss-notification", id: id, }); @@ -448,7 +453,7 @@ export class Editor { progressTimeout?: number; showProgress(progressPerc: number) { - this.viewDispatch({ + this.ui.viewDispatch({ type: "set-progress", progressPerc, }); @@ -457,7 +462,7 @@ export class Editor { } this.progressTimeout = setTimeout( () => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "set-progress", }); }, @@ -472,14 +477,14 @@ export class Editor { placeHolder = "", ): Promise { return new Promise((resolve) => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "show-filterbox", label, options, placeHolder, helpText, onSelect: (option: any) => { - this.viewDispatch({ type: "hide-filterbox" }); + this.ui.viewDispatch({ type: "hide-filterbox" }); this.focus(); resolve(option); }, @@ -492,12 +497,12 @@ export class Editor { defaultValue = "", ): Promise { return new Promise((resolve) => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "show-prompt", message, defaultValue, callback: (value: string | undefined) => { - this.viewDispatch({ type: "hide-prompt" }); + this.ui.viewDispatch({ type: "hide-prompt" }); this.focus(); resolve(value); }, @@ -509,11 +514,11 @@ export class Editor { message: string, ): Promise { return new Promise((resolve) => { - this.viewDispatch({ + this.ui.viewDispatch({ type: "show-confirm", message, callback: (value: boolean) => { - this.viewDispatch({ type: "hide-confirm" }); + this.ui.viewDispatch({ type: "hide-confirm" }); this.focus(); resolve(value); }, @@ -547,7 +552,7 @@ export class Editor { this, this.currentPage, editorView.state.sliceDoc(), - this.viewState.currentPageMeta?.perm === "ro", + this.ui.viewState.currentPageMeta?.perm === "ro", ), ); if (editorView.contentDOM) { @@ -658,7 +663,7 @@ export class Editor { } } - this.viewDispatch({ + this.ui.viewDispatch({ type: "page-loading", name: pageName, }); @@ -692,7 +697,7 @@ export class Editor { const stateRestored = this.openPages.restoreState(pageName); this.space.watchPage(pageName); - this.viewDispatch({ + this.ui.viewDispatch({ type: "page-loaded", meta: doc.meta, }); @@ -737,220 +742,8 @@ export class Editor { } } - ViewComponent() { - const [viewState, dispatch] = useReducer(reducer, initialViewState); - this.viewState = viewState; - this.viewDispatch = dispatch; - - // deno-lint-ignore no-this-alias - const editor = this; - - useEffect(() => { - if (viewState.currentPage) { - document.title = viewState.currentPage; - } - }, [viewState.currentPage]); - - useEffect(() => { - if (editor.editorView) { - editor.tweakEditorDOM( - editor.editorView.contentDOM, - ); - } - }, [viewState.uiOptions.forcedROMode]); - - useEffect(() => { - this.rebuildEditorState(); - this.dispatchAppEvent("editor:modeswitch"); - }, [viewState.uiOptions.vimMode]); - - useEffect(() => { - document.documentElement.dataset.theme = viewState.uiOptions.darkMode - ? "dark" - : "light"; - }, [viewState.uiOptions.darkMode]); - - useEffect(() => { - // Need to dispatch a resize event so that the top_bar can pick it up - globalThis.dispatchEvent(new Event("resize")); - }, [viewState.panels]); - - return ( - <> - {viewState.showPageNavigator && ( - { - dispatch({ type: "stop-navigate" }); - setTimeout(() => { - editor.focus(); - }); - if (page) { - safeRun(async () => { - await editor.navigate(page); - }); - } - }} - /> - )} - {viewState.showCommandPalette && ( - { - dispatch({ type: "hide-palette" }); - setTimeout(() => { - editor.focus(); - }); - if (cmd) { - dispatch({ type: "command-run", command: cmd.command.name }); - cmd - .run() - .catch((e: any) => { - console.error("Error running command", e.message); - }) - .then(() => { - // Always be focusing the editor after running a command - editor.focus(); - }); - } - }} - commands={this.getCommandsByContext(viewState)} - vimMode={viewState.uiOptions.vimMode} - darkMode={viewState.uiOptions.darkMode} - completer={this.miniEditorComplete.bind(this)} - recentCommands={viewState.recentCommands} - /> - )} - {viewState.showFilterBox && ( - - )} - {viewState.showPrompt && ( - { - dispatch({ type: "hide-prompt" }); - viewState.promptCallback!(value); - }} - /> - )} - {viewState.showConfirm && ( - { - dispatch({ type: "hide-confirm" }); - viewState.confirmCallback!(value); - }} - /> - )} - { - if (!newName) { - // Always move cursor to the start of the page - editor.editorView?.dispatch({ - selection: { anchor: 0 }, - }); - editor.focus(); - return; - } - console.log("Now renaming page to...", newName); - await editor.system.system.loadedPlugs.get("core")!.invoke( - "renamePage", - [{ page: newName }], - ); - editor.focus(); - }} - actionButtons={[ - { - icon: HomeIcon, - description: `Go home (Alt-h)`, - callback: () => { - editor.navigate(""); - }, - href: "", - }, - { - icon: BookIcon, - description: `Open page (${isMacLike() ? "Cmd-k" : "Ctrl-k"})`, - callback: () => { - dispatch({ type: "start-navigate" }); - this.space.updatePageList(); - }, - }, - { - icon: TerminalIcon, - description: `Run command (${isMacLike() ? "Cmd-/" : "Ctrl-/"})`, - callback: () => { - dispatch({ type: "show-palette", context: this.getContext() }); - }, - }, - ]} - rhs={!!viewState.panels.rhs.mode && ( -
- )} - lhs={!!viewState.panels.lhs.mode && ( -
- )} - /> -
- {!!viewState.panels.lhs.mode && ( - - )} -
- {!!viewState.panels.rhs.mode && ( - - )} -
- {!!viewState.panels.modal.mode && ( -
- -
- )} - {!!viewState.panels.bhs.mode && ( -
- -
- )} - - ); - } - async runCommandByName(name: string, ...args: any[]) { - const cmd = this.viewState.commands.get(name); + const cmd = this.ui.viewState.commands.get(name); if (cmd) { await cmd.run(); } else { @@ -958,12 +751,7 @@ export class Editor { } } - render(container: Element) { - const ViewComponent = this.ViewComponent.bind(this); - preactRender(, container); - } - - private getCommandsByContext( + getCommandsByContext( state: AppViewState, ): Map { const commands = new Map(state.commands); diff --git a/web/editor_state.ts b/web/editor_state.ts index b6ecfd1..660cd70 100644 --- a/web/editor_state.ts +++ b/web/editor_state.ts @@ -49,7 +49,7 @@ import { xmlLanguage, yamlLanguage, } from "../common/deps.ts"; -import { Editor } from "./editor.tsx"; +import { Editor } from "./editor.ts"; import { vim } from "./deps.ts"; import { inlineImagesPlugin } from "./cm_plugins/inline_image.ts"; import { cleanModePlugins } from "./cm_plugins/clean.ts"; @@ -107,11 +107,15 @@ export function createEditorState( doc: text, extensions: [ // Not using CM theming right now, but some extensions depend on the "dark" thing - EditorView.theme({}, { dark: editor.viewState.uiOptions.darkMode }), + EditorView.theme({}, { + dark: editor.ui.viewState.uiOptions.darkMode, + }), // Enable vim mode, or not - [...editor.viewState.uiOptions.vimMode ? [vim({ status: true })] : []], [ - ...readOnly || editor.viewState.uiOptions.forcedROMode + ...editor.ui.viewState.uiOptions.vimMode ? [vim({ status: true })] : [], + ], + [ + ...readOnly || editor.ui.viewState.uiOptions.forcedROMode ? [readonlyMode()] : [], ], @@ -309,7 +313,7 @@ export function createEditorState( key: "Ctrl-k", mac: "Cmd-k", run: (): boolean => { - editor.viewDispatch({ type: "start-navigate" }); + editor.ui.viewDispatch({ type: "start-navigate" }); editor.space.updatePageList(); return true; @@ -319,7 +323,7 @@ export function createEditorState( key: "Ctrl-/", mac: "Cmd-/", run: (): boolean => { - editor.viewDispatch({ + editor.ui.viewDispatch({ type: "show-palette", context: editor.getContext(), }); @@ -330,7 +334,7 @@ export function createEditorState( key: "Ctrl-.", mac: "Cmd-.", run: (): boolean => { - editor.viewDispatch({ + editor.ui.viewDispatch({ type: "show-palette", context: editor.getContext(), }); @@ -415,7 +419,7 @@ export function createEditorState( class { update(update: ViewUpdate): void { if (update.docChanged) { - editor.viewDispatch({ type: "page-changed" }); + editor.ui.viewDispatch({ type: "page-changed" }); editor.debouncedUpdateEvent(); editor.save().catch((e) => console.error("Error saving", e)); } diff --git a/web/editor_ui.tsx b/web/editor_ui.tsx new file mode 100644 index 0000000..cc5fc41 --- /dev/null +++ b/web/editor_ui.tsx @@ -0,0 +1,246 @@ +import { isMacLike, safeRun } from "../common/util.ts"; +import { Confirm, Prompt } from "./components/basic_modals.tsx"; +import { CommandPalette } from "./components/command_palette.tsx"; +import { FilterList } from "./components/filter.tsx"; +import { PageNavigator } from "./components/page_navigator.tsx"; +import { TopBar } from "./components/top_bar.tsx"; +import reducer from "./reducer.ts"; +import { Action, AppViewState, initialViewState } from "./types.ts"; +import { + BookIcon, + HomeIcon, + preactRender, + TerminalIcon, + useEffect, + useReducer, +} from "./deps.ts"; +import type { Editor } from "./editor.ts"; +import { Panel } from "./components/panel.tsx"; +import { h } from "./deps.ts"; + +export class MainUI { + viewState: AppViewState = initialViewState; + viewDispatch: (action: Action) => void = () => {}; + + constructor(private editor: Editor) { + } + + ViewComponent() { + const [viewState, dispatch] = useReducer(reducer, initialViewState); + this.viewState = viewState; + this.viewDispatch = dispatch; + + const editor = this.editor; + + useEffect(() => { + if (viewState.currentPage) { + document.title = viewState.currentPage; + } + }, [viewState.currentPage]); + + useEffect(() => { + if (editor.editorView) { + editor.tweakEditorDOM( + editor.editorView.contentDOM, + ); + } + }, [viewState.uiOptions.forcedROMode]); + + useEffect(() => { + this.editor.rebuildEditorState(); + this.editor.dispatchAppEvent("editor:modeswitch"); + }, [viewState.uiOptions.vimMode]); + + useEffect(() => { + document.documentElement.dataset.theme = viewState.uiOptions.darkMode + ? "dark" + : "light"; + }, [viewState.uiOptions.darkMode]); + + useEffect(() => { + // Need to dispatch a resize event so that the top_bar can pick it up + globalThis.dispatchEvent(new Event("resize")); + }, [viewState.panels]); + + return ( + <> + {viewState.showPageNavigator && ( + { + dispatch({ type: "stop-navigate" }); + setTimeout(() => { + editor.focus(); + }); + if (page) { + safeRun(async () => { + await editor.navigate(page); + }); + } + }} + /> + )} + {viewState.showCommandPalette && ( + { + dispatch({ type: "hide-palette" }); + setTimeout(() => { + editor.focus(); + }); + if (cmd) { + dispatch({ type: "command-run", command: cmd.command.name }); + cmd + .run() + .catch((e: any) => { + console.error("Error running command", e.message); + }) + .then(() => { + // Always be focusing the editor after running a command + editor.focus(); + }); + } + }} + commands={editor.getCommandsByContext(viewState)} + vimMode={viewState.uiOptions.vimMode} + darkMode={viewState.uiOptions.darkMode} + completer={editor.miniEditorComplete.bind(editor)} + recentCommands={viewState.recentCommands} + /> + )} + {viewState.showFilterBox && ( + + )} + {viewState.showPrompt && ( + { + dispatch({ type: "hide-prompt" }); + viewState.promptCallback!(value); + }} + /> + )} + {viewState.showConfirm && ( + { + dispatch({ type: "hide-confirm" }); + viewState.confirmCallback!(value); + }} + /> + )} + { + if (!newName) { + // Always move cursor to the start of the page + editor.editorView?.dispatch({ + selection: { anchor: 0 }, + }); + editor.focus(); + return; + } + console.log("Now renaming page to...", newName); + await editor.system.system.loadedPlugs.get("core")!.invoke( + "renamePage", + [{ page: newName }], + ); + editor.focus(); + }} + actionButtons={[ + { + icon: HomeIcon, + description: `Go home (Alt-h)`, + callback: () => { + editor.navigate(""); + }, + href: "", + }, + { + icon: BookIcon, + description: `Open page (${isMacLike() ? "Cmd-k" : "Ctrl-k"})`, + callback: () => { + dispatch({ type: "start-navigate" }); + editor.space.updatePageList(); + }, + }, + { + icon: TerminalIcon, + description: `Run command (${isMacLike() ? "Cmd-/" : "Ctrl-/"})`, + callback: () => { + dispatch({ + type: "show-palette", + context: editor.getContext(), + }); + }, + }, + ]} + rhs={!!viewState.panels.rhs.mode && ( +
+ )} + lhs={!!viewState.panels.lhs.mode && ( +
+ )} + /> +
+ {!!viewState.panels.lhs.mode && ( + + )} +
+ {!!viewState.panels.rhs.mode && ( + + )} +
+ {!!viewState.panels.modal.mode && ( +
+ +
+ )} + {!!viewState.panels.bhs.mode && ( +
+ +
+ )} + + ); + } + + render(container: Element) { + // const ViewComponent = this.ui.ViewComponent.bind(this.ui); + preactRender(h(this.ViewComponent.bind(this), {}), container); + } +} diff --git a/web/hooks/command.ts b/web/hooks/command.ts index d721674..3d31770 100644 --- a/web/hooks/command.ts +++ b/web/hooks/command.ts @@ -53,12 +53,15 @@ export class CommandHook extends EventEmitter } apply(system: System): void { - this.buildAllCommands(system); system.on({ plugLoaded: () => { this.buildAllCommands(system); }, }); + // On next tick + setTimeout(() => { + this.buildAllCommands(system); + }); } validateManifest(manifest: Manifest): string[] { diff --git a/web/hooks/slash_command.ts b/web/hooks/slash_command.ts index e1798ea..75eb4a1 100644 --- a/web/hooks/slash_command.ts +++ b/web/hooks/slash_command.ts @@ -2,7 +2,7 @@ import { Hook, Manifest } from "../../plugos/types.ts"; import { System } from "../../plugos/system.ts"; import { Completion, CompletionContext, CompletionResult } from "../deps.ts"; import { safeRun } from "../../common/util.ts"; -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { syntaxTree } from "../deps.ts"; export type SlashCommandDef = { diff --git a/web/syscalls/editor.ts b/web/syscalls/editor.ts index 8bba05c..0b17152 100644 --- a/web/syscalls/editor.ts +++ b/web/syscalls/editor.ts @@ -1,4 +1,4 @@ -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { EditorView, foldAll, @@ -81,14 +81,14 @@ export function editorSyscalls(editor: Editor): SysCallMapping { html: string, script: string, ) => { - editor.viewDispatch({ + editor.ui.viewDispatch({ type: "show-panel", id: id as any, config: { html, script, mode }, }); }, "editor.hidePanel": (_ctx, id: string) => { - editor.viewDispatch({ + editor.ui.viewDispatch({ type: "hide-panel", id: id as any, }); @@ -169,10 +169,10 @@ export function editorSyscalls(editor: Editor): SysCallMapping { return editor.confirm(message); }, "editor.getUiOption": (_ctx, key: string): any => { - return (editor.viewState.uiOptions as any)[key]; + return (editor.ui.viewState.uiOptions as any)[key]; }, "editor.setUiOption": (_ctx, key: string, value: any) => { - editor.viewDispatch({ + editor.ui.viewDispatch({ type: "set-ui-option", key, value, diff --git a/web/syscalls/space.ts b/web/syscalls/space.ts index 6bf7eaa..17e85fb 100644 --- a/web/syscalls/space.ts +++ b/web/syscalls/space.ts @@ -1,4 +1,4 @@ -import { Editor } from "../editor.tsx"; +import { Editor } from "../editor.ts"; import { SysCallMapping } from "../../plugos/system.ts"; import { AttachmentMeta, PageMeta } from "../types.ts"; diff --git a/web/syscalls/sync.ts b/web/syscalls/sync.ts index b5541d1..d1e220e 100644 --- a/web/syscalls/sync.ts +++ b/web/syscalls/sync.ts @@ -1,5 +1,5 @@ import { SysCallMapping } from "../../plugos/system.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; export function syncSyscalls(editor: Editor): SysCallMapping { return { diff --git a/web/syscalls/system.ts b/web/syscalls/system.ts index 5c96454..05235c9 100644 --- a/web/syscalls/system.ts +++ b/web/syscalls/system.ts @@ -1,6 +1,6 @@ import type { Plug } from "../../plugos/plug.ts"; import { SysCallMapping, System } from "../../plugos/system.ts"; -import type { Editor } from "../editor.tsx"; +import type { Editor } from "../editor.ts"; import { CommandDef } from "../hooks/command.ts"; export function systemSyscalls(