From 5c70d88c31ff962f8a3cafa1b724fc045f117e53 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Fri, 3 May 2024 20:13:32 -0700 Subject: [PATCH 01/16] Remove unused `focusOnMount` --- .../src/features/models/workspace/Editor.svelte | 14 ++++++-------- .../[type=workspace]/[name]/+page.svelte | 2 -- 2 files changed, 6 insertions(+), 10 deletions(-) diff --git a/web-common/src/features/models/workspace/Editor.svelte b/web-common/src/features/models/workspace/Editor.svelte index 405d0688f38..9e453f4fe1e 100644 --- a/web-common/src/features/models/workspace/Editor.svelte +++ b/web-common/src/features/models/workspace/Editor.svelte @@ -47,18 +47,18 @@ lineNumbers, rectangularSelection, } from "@codemirror/view"; - import { createEventDispatcher, onMount } from "svelte"; - import { DuckDBSQL } from "../../../components/editor/presets/duckDBDialect"; - import { editorTheme } from "../../../components/editor/theme"; - import { runtime } from "../../../runtime-client/runtime-store"; - import { useAllSourceColumns } from "../../sources/selectors"; - import { useAllModelColumns } from "../selectors"; import Button from "@rilldata/web-common/components/button/Button.svelte"; import Label from "@rilldata/web-common/components/forms/Label.svelte"; import Switch from "@rilldata/web-common/components/forms/Switch.svelte"; import Check from "@rilldata/web-common/components/icons/Check.svelte"; import UndoIcon from "@rilldata/web-common/components/icons/UndoIcon.svelte"; import { queryClient } from "@rilldata/web-common/lib/svelte-query/globalQueryClient"; + import { createEventDispatcher, onMount } from "svelte"; + import { DuckDBSQL } from "../../../components/editor/presets/duckDBDialect"; + import { editorTheme } from "../../../components/editor/theme"; + import { runtime } from "../../../runtime-client/runtime-store"; + import { useAllSourceColumns } from "../../sources/selectors"; + import { useAllModelColumns } from "../selectors"; const dispatch = createEventDispatcher(); const schema: { [table: string]: string[] } = {}; @@ -66,7 +66,6 @@ export let blob: string; export let latest: string; export let selections: SelectionRange[] = []; - export let focusOnMount = false; export let autoSave = true; export let hasUnsavedChanges: boolean; @@ -230,7 +229,6 @@ }), parent: editorContainerComponent, }); - if (focusOnMount) editor.focus(); }); // REACTIVE FUNCTIONS diff --git a/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte b/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte index 7445b10d173..a0b2c8ef512 100644 --- a/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte +++ b/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte @@ -96,7 +96,6 @@ const { readOnly } = featureFlags; let interceptedUrl: string | null = null; - let focusOnMount = false; let fileNotFound = false; onMount(async () => { @@ -342,7 +341,6 @@ Date: Fri, 3 May 2024 20:30:09 -0700 Subject: [PATCH 02/16] Rename to `ModelEditor` --- .../models/workspace/{Editor.svelte => ModelEditor.svelte} | 0 .../routes/(application)/[type=workspace]/[name]/+page.svelte | 4 ++-- 2 files changed, 2 insertions(+), 2 deletions(-) rename web-common/src/features/models/workspace/{Editor.svelte => ModelEditor.svelte} (100%) diff --git a/web-common/src/features/models/workspace/Editor.svelte b/web-common/src/features/models/workspace/ModelEditor.svelte similarity index 100% rename from web-common/src/features/models/workspace/Editor.svelte rename to web-common/src/features/models/workspace/ModelEditor.svelte diff --git a/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte b/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte index a0b2c8ef512..c955cefef91 100644 --- a/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte +++ b/web-local/src/routes/(application)/[type=workspace]/[name]/+page.svelte @@ -17,7 +17,7 @@ import { handleEntityRename } from "@rilldata/web-common/features/entity-management/ui-actions"; import { featureFlags } from "@rilldata/web-common/features/feature-flags"; import type { QueryHighlightState } from "@rilldata/web-common/features/models/query-highlight-store"; - import Editor from "@rilldata/web-common/features/models/workspace/Editor.svelte"; + import ModelEditor from "@rilldata/web-common/features/models/workspace/ModelEditor.svelte"; import ModelWorkspaceCtAs from "@rilldata/web-common/features/models/workspace/ModelWorkspaceCTAs.svelte"; import { createModelFromSource } from "@rilldata/web-common/features/sources/createModel"; import SourceEditor from "@rilldata/web-common/features/sources/editor/SourceEditor.svelte"; @@ -338,7 +338,7 @@ on:save={debounceSave} /> {:else} - Date: Fri, 3 May 2024 20:36:38 -0700 Subject: [PATCH 03/16] `update` -> `save` --- .../editor/__stories__/YAMLEditor.stories.svelte | 4 ++-- web-common/src/components/editor/dispatch-events/index.ts | 2 +- web-common/src/features/charts/editor/ChartsEditor.svelte | 2 +- .../custom-dashboards/CustomDashboardEditor.svelte | 4 ++-- .../features/generic-yaml-editor/YamlWorkspaceBody.svelte | 4 ++-- .../metrics-views/workspace/editor/MetricsEditor.svelte | 2 +- .../src/features/sources/editor/SourceEditor.svelte | 8 ++++---- .../src/routes/(application)/files/[...file]/+page.svelte | 2 +- 8 files changed, 14 insertions(+), 14 deletions(-) diff --git a/web-common/src/components/editor/__stories__/YAMLEditor.stories.svelte b/web-common/src/components/editor/__stories__/YAMLEditor.stories.svelte index 648890685f0..ee7baec93ae 100644 --- a/web-common/src/components/editor/__stories__/YAMLEditor.stories.svelte +++ b/web-common/src/components/editor/__stories__/YAMLEditor.stories.svelte @@ -2,9 +2,9 @@ import type { EditorView } from "@codemirror/view"; import { Meta, Story, Template } from "@storybook/addon-svelte-csf"; import Button from "../../button/Button.svelte"; + import YAMLEditor from "../YAMLEditor.svelte"; import { setLineStatuses } from "../line-status"; import type { LineStatus } from "../line-status/state"; - import YAMLEditor from "../YAMLEditor.svelte"; let content = `name: this is the name values: @@ -52,7 +52,7 @@ values: key="key" {content} bind:view - on:update={(event) => { + on:save={(event) => { // Often, you want to debounce the update to parent content. // Here, we have no such requirement. content = event.detail; diff --git a/web-common/src/components/editor/dispatch-events/index.ts b/web-common/src/components/editor/dispatch-events/index.ts index 97b1d81170b..029587accfd 100644 --- a/web-common/src/components/editor/dispatch-events/index.ts +++ b/web-common/src/components/editor/dispatch-events/index.ts @@ -21,7 +21,7 @@ export function bindEditorEventsToDispatcher( * The viewUpdate can be used to look at transactions at the parent component level. */ if (whenFocused && !viewUpdate.view.hasFocus) return; - dispatch("update", { + dispatch("save", { content: viewUpdate.view.state.doc.toString(), viewUpdate, } as UpdateDetails); diff --git a/web-common/src/features/charts/editor/ChartsEditor.svelte b/web-common/src/features/charts/editor/ChartsEditor.svelte index 67bdb3c3751..767e468c49c 100644 --- a/web-common/src/features/charts/editor/ChartsEditor.svelte +++ b/web-common/src/features/charts/editor/ChartsEditor.svelte @@ -59,6 +59,6 @@ content={yaml} extensions={[customYAMLwithJSONandSQL]} key={filePath} - on:update={(e) => debounceUpdateChartContent(e.detail.content)} + on:save={(e) => debounceUpdateChartContent(e.detail.content)} /> diff --git a/web-common/src/features/custom-dashboards/CustomDashboardEditor.svelte b/web-common/src/features/custom-dashboards/CustomDashboardEditor.svelte index 7e96d427f7d..c4cc4003851 100644 --- a/web-common/src/features/custom-dashboards/CustomDashboardEditor.svelte +++ b/web-common/src/features/custom-dashboards/CustomDashboardEditor.svelte @@ -2,9 +2,9 @@ import type { EditorView } from "@codemirror/view"; import YAMLEditor from "@rilldata/web-common/components/editor/YAMLEditor.svelte"; import { debounce } from "@rilldata/web-common/lib/create-debouncer"; + import { V1ParseError } from "@rilldata/web-common/runtime-client"; import { createEventDispatcher } from "svelte"; import ChartsEditorContainer from "../charts/editor/ChartsEditorContainer.svelte"; - import { V1ParseError } from "@rilldata/web-common/runtime-client"; const dispatch = createEventDispatcher(); @@ -30,6 +30,6 @@ content={yaml} key={filePath} whenFocused - on:update={(e) => debounceUpdateChartContent(e.detail.content)} + on:save={(e) => debounceUpdateChartContent(e.detail.content)} /> diff --git a/web-common/src/features/generic-yaml-editor/YamlWorkspaceBody.svelte b/web-common/src/features/generic-yaml-editor/YamlWorkspaceBody.svelte index d94631b8850..adfcbb2103b 100644 --- a/web-common/src/features/generic-yaml-editor/YamlWorkspaceBody.svelte +++ b/web-common/src/features/generic-yaml-editor/YamlWorkspaceBody.svelte @@ -1,5 +1,6 @@ -
+ + +
+
+
{ + /** give the editor focus no matter where we click */ + if (!editor.hasFocus) editor.focus(); + }} + on:keydown={() => { + /** no op for now */ + }} + role="textbox" + tabindex="0" + /> +
+ +
+
+ {#if !autoSave} + + + + {/if} +
+
+ + +
+
+
+ + diff --git a/web-common/src/features/editor/getExtensionsForFile.ts b/web-common/src/features/editor/getExtensionsForFile.ts index 718fcd5a3b0..aa794babd6c 100644 --- a/web-common/src/features/editor/getExtensionsForFile.ts +++ b/web-common/src/features/editor/getExtensionsForFile.ts @@ -1,5 +1,5 @@ -import { yaml } from "@rilldata/web-common/components/editor/presets/yaml"; import { markdown } from "@codemirror/lang-markdown"; +import { yaml } from "@rilldata/web-common/components/editor/presets/yaml"; import { extractFileExtension } from "@rilldata/web-common/features/sources/extract-file-name"; export const FileExtensionToEditorExtension = { @@ -8,7 +8,7 @@ export const FileExtensionToEditorExtension = { ".md": [markdown()], }; -export function getExtensionsForFiles(filePath: string) { +export function getExtensionsForFile(filePath: string) { const extension = extractFileExtension(filePath); return FileExtensionToEditorExtension[extension] ?? []; } diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 09c47b5a008..e1131a8a60f 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -4,13 +4,14 @@ import WorkspaceError from "@rilldata/web-common/components/WorkspaceError.svelte"; import Editor from "@rilldata/web-common/features/editor/Editor.svelte"; import FileWorkspaceHeader from "@rilldata/web-common/features/editor/FileWorkspaceHeader.svelte"; - import { getExtensionsForFiles } from "@rilldata/web-common/features/editor/getExtensionsForFile"; + import { getExtensionsForFile } from "@rilldata/web-common/features/editor/getExtensionsForFile"; import { addLeadingSlash } from "@rilldata/web-common/features/entity-management/entity-mappers"; import { fileArtifacts } from "@rilldata/web-common/features/entity-management/file-artifacts"; import { ResourceKind } from "@rilldata/web-common/features/entity-management/resource-selectors"; import { directoryState } from "@rilldata/web-common/features/file-explorer/directory-store"; import { extractFileExtension } from "@rilldata/web-common/features/sources/extract-file-name"; import WorkspaceContainer from "@rilldata/web-common/layout/workspace/WorkspaceContainer.svelte"; + import WorkspaceEditorContainer from "@rilldata/web-common/layout/workspace/WorkspaceEditorContainer.svelte"; import { debounce } from "@rilldata/web-common/lib/create-debouncer"; import { createRuntimeServiceGetFile, @@ -73,14 +74,16 @@ $: blob = $fileQuery.data?.blob ?? blob; $: latest = blob; + $: hasUnsavedChanges = latest !== blob; - function save(content: string) { - if ($fileQuery.data?.blob === content) return; - return $putFile.mutateAsync({ + async function save() { + if (!hasUnsavedChanges) return; + + await $putFile.mutateAsync({ instanceId: $runtime.instanceId, data: { path: filePath, - blob: content, + blob: latest, }, }); } @@ -110,17 +113,19 @@ {:else if isOther} -
-
-
- debounceSave(content)} - /> -
-
+
+ + +
{/if} From 187ccdf29819b97502fffa9e09da539be1c18231 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Fri, 3 May 2024 21:17:55 -0700 Subject: [PATCH 05/16] Remember autosave selection --- .../src/routes/(application)/files/[...file]/+page.svelte | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index e1131a8a60f..306a12c3196 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -12,6 +12,7 @@ import { extractFileExtension } from "@rilldata/web-common/features/sources/extract-file-name"; import WorkspaceContainer from "@rilldata/web-common/layout/workspace/WorkspaceContainer.svelte"; import WorkspaceEditorContainer from "@rilldata/web-common/layout/workspace/WorkspaceEditorContainer.svelte"; + import { workspaces } from "@rilldata/web-common/layout/workspace/workspace-stores"; import { debounce } from "@rilldata/web-common/lib/create-debouncer"; import { createRuntimeServiceGetFile, @@ -76,6 +77,10 @@ $: latest = blob; $: hasUnsavedChanges = latest !== blob; + $: pathname = $page.url.pathname; + $: workspace = workspaces.get(pathname); + $: autoSave = workspace.editor.autoSave; + async function save() { if (!hasUnsavedChanges) return; @@ -120,9 +125,10 @@ From 729bc781c08345488d38738e7bfb9c5e4ccbde14 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Fri, 3 May 2024 21:38:46 -0700 Subject: [PATCH 06/16] Add confirmation before leaving unsaved file --- .../files/[...file]/+page.svelte | 39 +++++++++++++++++-- 1 file changed, 35 insertions(+), 4 deletions(-) diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 306a12c3196..2746fcbcbd7 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -1,5 +1,5 @@ {#if fileTypeUnsupported} @@ -135,3 +158,11 @@
{/if} + +{#if interceptedUrl} + +{/if} From 996e90b67df2e116153d51f74139b2fd19b03173 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 10:02:50 -0700 Subject: [PATCH 07/16] Move debounce logic into `Editor` --- web-common/src/features/editor/Editor.svelte | 18 +++++++++++------- .../(application)/files/[...file]/+page.svelte | 5 +---- 2 files changed, 12 insertions(+), 11 deletions(-) diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index 361c35cfbf5..0f9070ca775 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -10,8 +10,10 @@ import { createEventDispatcher, onMount } from "svelte"; import { bindEditorEventsToDispatcher } from "../../components/editor/dispatch-events"; import { base } from "../../components/editor/presets/base"; + import { debounce } from "../../lib/create-debouncer"; const dispatch = createEventDispatcher(); + const FILE_SAVE_DEBOUNCE_TIME = 400; export let blob: string; // the initial content of the editor export let latest: string; @@ -59,7 +61,7 @@ if (v.docChanged) { latest = v.state.doc.toString(); - if (autoSave) saveContent(); + if (autoSave) debounceSave(); } }), ], @@ -83,17 +85,19 @@ } } - function saveContent() { - dispatch("save"); - } - function handleKeydown(e: KeyboardEvent) { if (e.key === "s" && (e.ctrlKey || e.metaKey)) { e.preventDefault(); - saveContent(); + save(); } } + function save() { + dispatch("save"); + } + + const debounceSave = debounce(save, FILE_SAVE_DEBOUNCE_TIME); + function revertContent() { dispatch("revert"); } @@ -121,7 +125,7 @@
{#if !autoSave} - diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 2746fcbcbd7..501c70702e0 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -14,7 +14,6 @@ import WorkspaceContainer from "@rilldata/web-common/layout/workspace/WorkspaceContainer.svelte"; import WorkspaceEditorContainer from "@rilldata/web-common/layout/workspace/WorkspaceEditorContainer.svelte"; import { workspaces } from "@rilldata/web-common/layout/workspace/workspace-stores"; - import { debounce } from "@rilldata/web-common/lib/create-debouncer"; import { createRuntimeServiceGetFile, createRuntimeServicePutFile, @@ -27,7 +26,6 @@ import DashboardPage from "../../dashboard/[name]/edit/+page.svelte"; const UNSUPPORTED_EXTENSIONS = [".parquet", ".db", ".db.wal"]; - const FILE_SAVE_DEBOUNCE_TIME = 400; let interceptedUrl: string | null = null; @@ -80,7 +78,6 @@ if (e.to) interceptedUrl = e.to.url.href; }); - const debounceSave = debounce(save, FILE_SAVE_DEBOUNCE_TIME); let blob = ""; $: blob = $fileQuery.data?.blob ?? blob; @@ -152,7 +149,7 @@ extensions={getExtensionsForFile(filePath)} bind:latest bind:autoSave={$autoSave} - on:save={debounceSave} + on:save={save} />
From 730776529324929eb65b1a186c9bf9f49a7897a7 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 10:27:11 -0700 Subject: [PATCH 08/16] Hide autosave for `rill.yaml` and `.env` files --- web-common/src/features/editor/Editor.svelte | 6 +++++- web-common/src/features/editor/config.ts | 1 + .../src/routes/(application)/files/[...file]/+page.svelte | 3 +++ 3 files changed, 9 insertions(+), 1 deletion(-) create mode 100644 web-common/src/features/editor/config.ts diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index 0f9070ca775..338dd04ee53 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -20,6 +20,7 @@ export let extensions: Extension[] = []; export let autoSave = true; export let hasUnsavedChanges: boolean; + export let hideAutoSave: boolean; let editor: EditorView; let container: HTMLElement; @@ -140,7 +141,10 @@ {/if}
-
+
diff --git a/web-common/src/features/editor/config.ts b/web-common/src/features/editor/config.ts new file mode 100644 index 00000000000..5a7e696aa25 --- /dev/null +++ b/web-common/src/features/editor/config.ts @@ -0,0 +1 @@ +export const FILES_WITHOUT_AUTOSAVE = ["/rill.yaml", "/.env"]; diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 501c70702e0..678a69b8974 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -4,6 +4,7 @@ import WorkspaceError from "@rilldata/web-common/components/WorkspaceError.svelte"; import Editor from "@rilldata/web-common/features/editor/Editor.svelte"; import FileWorkspaceHeader from "@rilldata/web-common/features/editor/FileWorkspaceHeader.svelte"; + import { FILES_WITHOUT_AUTOSAVE } from "@rilldata/web-common/features/editor/config"; import { getExtensionsForFile } from "@rilldata/web-common/features/editor/getExtensionsForFile"; import { addLeadingSlash } from "@rilldata/web-common/features/entity-management/entity-mappers"; import { fileArtifacts } from "@rilldata/web-common/features/entity-management/file-artifacts"; @@ -87,6 +88,7 @@ $: pathname = $page.url.pathname; $: workspace = workspaces.get(pathname); $: autoSave = workspace.editor.autoSave; + $: hideAutoSave = FILES_WITHOUT_AUTOSAVE.includes(filePath); async function save() { if (!hasUnsavedChanges) return; @@ -147,6 +149,7 @@ {blob} {hasUnsavedChanges} extensions={getExtensionsForFile(filePath)} + {hideAutoSave} bind:latest bind:autoSave={$autoSave} on:save={save} From c60251d38cf9868693102cccdf3057ca353396f3 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 10:28:14 -0700 Subject: [PATCH 09/16] Add unsaved-changes indicator to file header --- web-common/src/features/editor/FileWorkspaceHeader.svelte | 2 ++ .../src/routes/(application)/files/[...file]/+page.svelte | 6 +++++- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/web-common/src/features/editor/FileWorkspaceHeader.svelte b/web-common/src/features/editor/FileWorkspaceHeader.svelte index d5444338f71..6313b229d85 100644 --- a/web-common/src/features/editor/FileWorkspaceHeader.svelte +++ b/web-common/src/features/editor/FileWorkspaceHeader.svelte @@ -8,6 +8,7 @@ import { PROTECTED_FILES } from "../file-explorer/protected-paths"; export let filePath: string; + export let hasUnsavedChanges: boolean; let fileName: string; let folder: string; @@ -39,6 +40,7 @@ diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 678a69b8974..0176c5770d7 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -139,7 +139,11 @@ {:else if isOther} - +
Date: Mon, 6 May 2024 10:29:22 -0700 Subject: [PATCH 10/16] Move debounce constant to `editor/config.ts` --- web-common/src/features/editor/Editor.svelte | 2 +- web-common/src/features/editor/config.ts | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index 338dd04ee53..b90ab9ed15c 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -11,9 +11,9 @@ import { bindEditorEventsToDispatcher } from "../../components/editor/dispatch-events"; import { base } from "../../components/editor/presets/base"; import { debounce } from "../../lib/create-debouncer"; + import { FILE_SAVE_DEBOUNCE_TIME } from "./config"; const dispatch = createEventDispatcher(); - const FILE_SAVE_DEBOUNCE_TIME = 400; export let blob: string; // the initial content of the editor export let latest: string; diff --git a/web-common/src/features/editor/config.ts b/web-common/src/features/editor/config.ts index 5a7e696aa25..506588c4d44 100644 --- a/web-common/src/features/editor/config.ts +++ b/web-common/src/features/editor/config.ts @@ -1 +1,3 @@ export const FILES_WITHOUT_AUTOSAVE = ["/rill.yaml", "/.env"]; + +export const FILE_SAVE_DEBOUNCE_TIME = 400; From 343fc8323b8bd76b0f86ea2bbd318e220e2686b5 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 10:36:51 -0700 Subject: [PATCH 11/16] Fix unit test --- web-common/src/components/editor/YAMLEditor.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-common/src/components/editor/YAMLEditor.spec.ts b/web-common/src/components/editor/YAMLEditor.spec.ts index 4f79688d15e..ca203002147 100644 --- a/web-common/src/components/editor/YAMLEditor.spec.ts +++ b/web-common/src/components/editor/YAMLEditor.spec.ts @@ -38,7 +38,7 @@ describe("YAMLEditor.svelte", () => { expect(getLines(container)).toHaveLength(1); const onUpdate = vi.fn(); - component?.$on("update", onUpdate); + component?.$on("save", onUpdate); const content = "foo: 10\nbar: 20\nfoo: 10\nbar: 20"; From bc3cb727f366752d4afe6e183884e7c0c591e37e Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 11:19:02 -0700 Subject: [PATCH 12/16] Initialize `autosave` to `false` for `rill.yaml` and `.env` --- .../src/layout/workspace/workspace-stores.ts | 17 +++++++++++++---- 1 file changed, 13 insertions(+), 4 deletions(-) diff --git a/web-common/src/layout/workspace/workspace-stores.ts b/web-common/src/layout/workspace/workspace-stores.ts index 74754c4452b..97839f00af2 100644 --- a/web-common/src/layout/workspace/workspace-stores.ts +++ b/web-common/src/layout/workspace/workspace-stores.ts @@ -1,10 +1,10 @@ -import { writable } from "svelte/store"; +import { debounce } from "@rilldata/web-common/lib/create-debouncer"; +import { derived, writable } from "svelte/store"; +import { FILES_WITHOUT_AUTOSAVE } from "../../features/editor/config"; import { DEFAULT_INSPECTOR_WIDTH, DEFAULT_PREVIEW_TABLE_HEIGHT, } from "../config"; -import { derived } from "svelte/store"; -import { debounce } from "@rilldata/web-common/lib/create-debouncer"; type WorkspaceLayout = { inspector: { @@ -28,6 +28,8 @@ class WorkspaceLayoutStore { private autoSave = writable(true); constructor(key: string) { + this.autoSave.set(this.getAutoSaveDefault(key)); + const history = localStorage.getItem(key); if (history) { @@ -40,7 +42,9 @@ class WorkspaceLayoutStore { parsed?.table?.height ?? DEFAULT_PREVIEW_TABLE_HEIGHT, ); this.tableVisible.set(parsed?.table?.visible ?? true); - this.autoSave.set(parsed?.editor?.autoSave ?? true); + this.autoSave.set( + parsed?.editor?.autoSave ?? this.getAutoSaveDefault(key), + ); } const debouncer = debounce( @@ -51,6 +55,11 @@ class WorkspaceLayoutStore { this.subscribe((v) => debouncer(v)); } + private getAutoSaveDefault(key: string): boolean { + const fileName = key.split("/").pop(); + return !FILES_WITHOUT_AUTOSAVE.includes(`/${fileName}`); + } + subscribe = derived( [ this.inspectorVisible, From 43d04efd6355820d5baf32d31babfe4bd772a127 Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 11:19:26 -0700 Subject: [PATCH 13/16] Re-org props --- web-common/src/features/editor/Editor.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index b90ab9ed15c..5fe66ba31fd 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -18,9 +18,9 @@ export let blob: string; // the initial content of the editor export let latest: string; export let extensions: Extension[] = []; - export let autoSave = true; - export let hasUnsavedChanges: boolean; + export let autoSave: boolean; export let hideAutoSave: boolean; + export let hasUnsavedChanges: boolean; let editor: EditorView; let container: HTMLElement; From 3c51f558d2673c7b7dc5e3bf56d21c41df3a1c9c Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 11:28:31 -0700 Subject: [PATCH 14/16] Handle "Revert changes" --- .../src/routes/(application)/files/[...file]/+page.svelte | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/web-local/src/routes/(application)/files/[...file]/+page.svelte b/web-local/src/routes/(application)/files/[...file]/+page.svelte index 0176c5770d7..ea555b9fb0a 100644 --- a/web-local/src/routes/(application)/files/[...file]/+page.svelte +++ b/web-local/src/routes/(application)/files/[...file]/+page.svelte @@ -102,6 +102,10 @@ }); } + function revert() { + latest = blob; + } + // TODO: move this logic into the DirectoryState // TODO: expand all directories in the path, not just the last one function expandDirectory(filePath: string) { @@ -157,6 +161,7 @@ bind:latest bind:autoSave={$autoSave} on:save={save} + on:revert={revert} />
From ad35bd016cb1dbbf44d2e91070e3b5e7ba8f0c8f Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 11:32:04 -0700 Subject: [PATCH 15/16] Remove comment --- web-common/src/features/editor/Editor.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index 5fe66ba31fd..d9c7873553f 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -15,7 +15,7 @@ const dispatch = createEventDispatcher(); - export let blob: string; // the initial content of the editor + export let blob: string; export let latest: string; export let extensions: Extension[] = []; export let autoSave: boolean; From 3640e7f8b8b0c4fa09226b1e376edd85b38d655b Mon Sep 17 00:00:00 2001 From: Eric P Green Date: Mon, 6 May 2024 15:35:15 -0700 Subject: [PATCH 16/16] Review --- web-common/src/features/editor/Editor.svelte | 8 ++++---- web-common/src/layout/workspace/workspace-stores.ts | 12 +----------- .../(application)/files/[...file]/+page.svelte | 4 ++-- 3 files changed, 7 insertions(+), 17 deletions(-) diff --git a/web-common/src/features/editor/Editor.svelte b/web-common/src/features/editor/Editor.svelte index d9c7873553f..99f5ba60e9c 100644 --- a/web-common/src/features/editor/Editor.svelte +++ b/web-common/src/features/editor/Editor.svelte @@ -19,7 +19,7 @@ export let latest: string; export let extensions: Extension[] = []; export let autoSave: boolean; - export let hideAutoSave: boolean; + export let disableAutoSave: boolean; export let hasUnsavedChanges: boolean; let editor: EditorView; @@ -62,7 +62,7 @@ if (v.docChanged) { latest = v.state.doc.toString(); - if (autoSave) debounceSave(); + if (!disableAutoSave && autoSave) debounceSave(); } }), ], @@ -125,7 +125,7 @@