From e9c64c29e0fbae3602cc4e0ab03f0d9c3fd928ed Mon Sep 17 00:00:00 2001 From: Danielo Rodriguez Date: Fri, 20 Dec 2024 16:47:36 +0100 Subject: [PATCH 1/2] fix: import forms not working fixes [BUG] Import from JSON doesn't work #358 --- src/core/template/templateParser.ts | 1 - src/store/SettngsStore.ts | 40 ++++++++++++-------- src/views/EditFormView.ts | 58 +++++++++++++++-------------- 3 files changed, 54 insertions(+), 45 deletions(-) diff --git a/src/core/template/templateParser.ts b/src/core/template/templateParser.ts index 43a71f0c..a8dc4c4a 100644 --- a/src/core/template/templateParser.ts +++ b/src/core/template/templateParser.ts @@ -43,7 +43,6 @@ const open = S.fold([S.string("{{"), S.spaces]); const close = P.expected(S.fold([S.spaces, S.string("}}")]), 'closing variable tag: "}}"'); const identifier = S.many1(C.alphanum); const transformation = pipe( - // dam prettier S.fold([S.spaces, S.string("|"), S.spaces]), P.apSecond(identifier), P.map((x) => { diff --git a/src/store/SettngsStore.ts b/src/store/SettngsStore.ts index ad58ca6f..9fb33e0c 100644 --- a/src/store/SettngsStore.ts +++ b/src/store/SettngsStore.ts @@ -1,31 +1,39 @@ -import { A, pipe } from '@std'; -import { FormDefinition, duplicateForm } from 'src/core/formDefinition'; -import { MigrationError } from 'src/core/formDefinitionSchema'; -import { ModalFormSettings, getDefaultSettings } from 'src/core/settings'; -import { writable, derived } from 'svelte/store'; +import { A, pipe } from "@std"; +import { FormDefinition, duplicateForm } from "src/core/formDefinition"; +import { MigrationError } from "src/core/formDefinitionSchema"; +import { ModalFormSettings, getDefaultSettings } from "src/core/settings"; +import { derived, writable } from "svelte/store"; const settings = writable({ ...getDefaultSettings() }); -export const formsStore = derived(settings, ($settings) => pipe( - $settings.formDefinitions, - A.filter((form): form is FormDefinition => !(form instanceof MigrationError)))); -const { subscribe, update, set } = settings +export const formsStore = derived(settings, ($settings) => + pipe( + $settings.formDefinitions, + A.filter((form): form is FormDefinition => !(form instanceof MigrationError)), + ), +); +const { subscribe, update, set } = settings; export const invalidFormsStore = derived(settings, ($settings) => { return pipe( $settings.formDefinitions, - A.filter((form): form is MigrationError => form instanceof MigrationError)); -}) + A.filter((form): form is MigrationError => form instanceof MigrationError), + ); +}); export const settingsStore = { subscribe, set, updateForm(name: string, form: FormDefinition) { + let edited = false; update((s): ModalFormSettings => { const forms = s.formDefinitions.map((f) => { - if (f.name === name) return form; + if (f.name === name) { + edited = true; + return form; + } return f; }); - return { ...s, formDefinitions: forms }; + return { ...s, formDefinitions: edited ? forms : [...s.formDefinitions, form] }; }); }, addNewForm(form: FormDefinition) { @@ -42,7 +50,7 @@ export const settingsStore = { }, duplicateForm(formName: string) { update((s): ModalFormSettings => { - return { ...s, formDefinitions: duplicateForm(formName, s.formDefinitions) } + return { ...s, formDefinitions: duplicateForm(formName, s.formDefinitions) }; }); - } -} + }, +}; diff --git a/src/views/EditFormView.ts b/src/views/EditFormView.ts index a680235b..be1b187f 100644 --- a/src/views/EditFormView.ts +++ b/src/views/EditFormView.ts @@ -3,19 +3,19 @@ import { settingsStore } from "src/store/SettngsStore"; import { log_notice } from "src/utils/Log"; import type { EditableFormDefinition, FormDefinition } from "../core/formDefinition"; import ModalFormPlugin from "../main"; -import FormEditor from './FormBuilder.svelte'; +import FormEditor from "./FormBuilder.svelte"; export const EDIT_FORM_VIEW = "modal-form-edit-form-view"; function parseState(maybeState: unknown): maybeState is EditableFormDefinition { if (maybeState === null) { - return false + return false; } - if (typeof maybeState !== 'object') { - return false + if (typeof maybeState !== "object") { + return false; } - if ('title' in maybeState && 'name' in maybeState && 'fields' in maybeState) { - return true + if ("title" in maybeState && "name" in maybeState && "fields" in maybeState) { + return true; } return false; } @@ -26,12 +26,15 @@ function parseState(maybeState: unknown): maybeState is EditableFormDefinition { * Simple, right? */ export class EditFormView extends ItemView { - formState: EditableFormDefinition = { title: '', name: '', version: '1', fields: [] }; + formState: EditableFormDefinition = { title: "", name: "", version: "1", fields: [] }; originalFormName?: string; formEditor!: FormEditor; - constructor(readonly leaf: WorkspaceLeaf, readonly plugin: ModalFormPlugin) { + constructor( + readonly leaf: WorkspaceLeaf, + readonly plugin: ModalFormPlugin, + ) { super(leaf); - this.icon = 'note-glyph' + this.icon = "note-glyph"; } getViewType() { @@ -43,49 +46,50 @@ export class EditFormView extends ItemView { } async onOpen() { - this.containerEl.empty() + this.containerEl.empty(); this.formEditor = new FormEditor({ target: this.containerEl, props: { definition: this.formState, app: this.app, onChange: () => { - console.log('Save form state', this.formState) - this.app.workspace.requestSaveLayout() + console.log("Save form state", this.formState); + this.app.workspace.requestSaveLayout(); }, onSubmit: (formDefinition: FormDefinition) => { - console.log('Submitting form', { formDefinition }); - if (this.originalFormName && this.originalFormName !== '') { - settingsStore.updateForm(this.originalFormName, formDefinition) + if (this.originalFormName && this.originalFormName !== "") { + console.log("Updating form", { formDefinition }); + settingsStore.updateForm(this.originalFormName, formDefinition); } else { - settingsStore.addNewForm(formDefinition) + console.log("Adding new form", { formDefinition }); + settingsStore.addNewForm(formDefinition); } - this.plugin.closeEditForm() + this.plugin.closeEditForm(); }, onCancel: () => { - this.plugin.closeEditForm() + this.plugin.closeEditForm(); }, onPreview: async (formDefinition: FormDefinition) => { - const result = await this.plugin.api.openForm(formDefinition) - const result_str = JSON.stringify(result, null, 2) - log_notice('Form result', result_str) - console.log(result_str) + const result = await this.plugin.api.openForm(formDefinition); + const result_str = JSON.stringify(result, null, 2); + log_notice("Form result", result_str); + console.log(result_str); }, - } + }, }); } async onClose() { - console.log('onClose of edit form called') + console.log("onClose of edit form called"); this.formEditor.$destroy(); } async setState(state: unknown, result: ViewStateResult): Promise { - console.log('setState of edit form called', state) + console.log("setState of edit form called", state); if (parseState(state)) { this.formState = state; this.originalFormName = state.name; - this.formEditor.$set({ definition: this.formState }) + this.formEditor.$set({ definition: this.formState }); } return super.setState(state, result); } @@ -93,5 +97,3 @@ export class EditFormView extends ItemView { return this.formState; } } - - From 54a1d4bff8baae2e0b10a55d6034b6b58ef44803 Mon Sep 17 00:00:00 2001 From: Danielo Rodriguez Date: Fri, 20 Dec 2024 16:49:10 +0100 Subject: [PATCH 2/2] chore: naming --- src/views/FormImport.ts | 6 +++--- src/views/FormImportView.ts | 4 ++-- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/src/views/FormImport.ts b/src/views/FormImport.ts index 52d49ef2..2f0b4856 100644 --- a/src/views/FormImport.ts +++ b/src/views/FormImport.ts @@ -1,9 +1,9 @@ -import * as J from "fp-ts/Json"; import { O, type Option, ensureError, pipe } from "@std"; import * as E from "fp-ts/Either"; +import * as J from "fp-ts/Json"; +import { FormDefinition } from "src/core/formDefinition"; import { InvalidData, MigrationError, migrateToLatest } from "src/core/formDefinitionSchema"; import { Readable, writable } from "svelte/store"; -import { FormDefinition } from "src/core/formDefinition"; type State = E.Either>; type UiState = { @@ -44,7 +44,7 @@ function matchState(state: State, matchers: Matchers): T { function noop() {} -export function makeFormInputModel({ createForm }: FormImportDeps): FormImportModel { +export function makeFormImportModel({ createForm }: FormImportDeps): FormImportModel { const state = writable(E.of(O.none)); const setErrors = (errors: string[]) => state.set(E.left(errors)); const resetState = () => state.set(E.of(O.none)); diff --git a/src/views/FormImportView.ts b/src/views/FormImportView.ts index bf08b6ef..8e242f72 100644 --- a/src/views/FormImportView.ts +++ b/src/views/FormImportView.ts @@ -1,6 +1,6 @@ import { App, Modal } from "obsidian"; +import { FormImportDeps, makeFormImportModel } from "./FormImport"; import FormImport from "./FormImport.svelte"; -import { FormImportDeps, makeFormInputModel } from "./FormImport"; /** * This class is just the minimum glue code to bind our core logic * with the svelte UI and obsidian API modal. @@ -23,7 +23,7 @@ export class FormImportModal extends Modal { const { contentEl } = this; this._component = new FormImport({ target: contentEl, - props: { model: makeFormInputModel(this.deps) }, + props: { model: makeFormImportModel(this.deps) }, }); } }