409 Conflict when I update document

1

I have react and editor.js that I use to create an entry in my Solid pod. Everything seems to be good, but when I write text too quickly / often, from time to time I get a 409 (Conflict) error and the text in the Solid pod is not saved correctly. I can’t debug why this is happening.

editor

<EditorJs data={{blocks: editorData}}
          defaultBlock={'solidNote'}
          enableReInitialize={true}
          tools={{
              solidNote: {
                  class: SolidNote,
                  inlineToolbar: true
              },
          }}

/>

SolidNote

export default class SolidBase {
    public readonly blockApi: BlockAPI;
    public readonly config: any;
    public readonly coreApi: API;
    public readonly data: { model: Model | null };
    public model: Model | null;
    public element: HTMLDivElement;
    public HYPERCUBE_URL: string | undefined;

    constructor(toolConfig: any) {
        this.data = toolConfig.data;
        this.coreApi = toolConfig.api;
        this.config = toolConfig.config;
        this.blockApi = toolConfig.block;
        this.model = this.data.model;
        this.element = this.createElement()
        getSession().then((session) => {
            // @ts-ignore
            this.HYPERCUBE_URL = HYPERCUBE_ROOT.replace('{podUrl}', new URL(session.webId).origin)
        })
    }

    getInput() {
        return this.element.innerHTML
    }

    removed() {
        this.model!.delete()
    }

    updated() {
        if (this.model!.content != this.getInput()) {
            this.model!.content = this.getInput()
            // @ts-ignore
            this.model.save(this.HYPERCUBE_URL)
                .then(r => console.log('item saved', r))
                .catch(err => console.log(err))
        }
    }

    createElement(): HTMLDivElement {
        throw new Error("Method 'createElement()' must be implemented.");
    }

    render() {
        return this.element
    }
}


export default class SolidNote extends SolidBase{
    private readonly placeholder: string;

    constructor(toolConfig: any) {
        super(toolConfig)
        this.placeholder = '...add your note'

        if (this.data.model === null || this.data.model === undefined) {
            this.model = new Note({
                content: '',
                type: BLOCK_TYPES.note
            });
        }

        this.element = this.createElement()
    }

    createElement(): HTMLDivElement {
        let el = document.createElement('div')
        el.classList.add('ce-paragraph', this.coreApi.styles.block)
        // @ts-ignore
        el.contentEditable = true;
        el.dataset.placeholder = this.coreApi.i18n.t(this.placeholder)
        if (this.model !== undefined) {
            el.innerHTML = this.model!.content;
        }
        return el;
    }
}
2

Hi @dima-dmytruk23, welcome to the Solid forum! I’m not familiar with Editor.js, but I think we’re missing a bit of context here to be able to help you. What does the code look like that’s saving data to the Solid Pod? (i.e. where does this.model or the Model interface come from?) Any Solid-specific libraries you’re using?

3

@Vincent I use soukai-solid as ODM. GitHub - NoelDeMartin/soukai-solid: Solid engine for Soukai ODM

export class Block extends SolidModel {
    static rdfContexts = {
        'hdf': DICTIONARY
    }

    static rdfsClasses = [
        'hdf:Block'
    ]

    static fields = {
        type: FieldType.String,
        content: FieldType.String,
    }

    getContent() {
        return this.getAttribute('content');
    }

    contextRelationship() {
        return this.hasMany(Context, 'relatedTo').usingSameDocument(true);
    }

    async getContext(key: string) {
        let context = await this.relatedContext.resolve()
        for (let item of context) {
            if (key === item.key) {
                return item
            }
        }
    }

    async setContext(key: string, value: string) {
        this.relatedContext.add(new Context({key: key, value: value}))
        return await this.save(HYPERCUBE_ROOT)
    }
}


export default class Note extends Block {
    type: string = 'note';
}
4

Ah got it. Pinging @NoelDeMartin, the author of Soukai, who might have more insights.

5

Thanks for the ping @Vincent :). There is an issue about this in the github repo so I’ll handle it there: 409 Conflict when I update document · Issue #13 · NoelDeMartin/soukai-solid · GitHub

1 Like