js frontend script for adding a note with template=person to Relation Map "My Family Tree"

[gaschz]

Test Case:
My goal is: I want to create notes with template person programmatically (script) and integrate them in a “Family Tree”. Therefore I created a test case which adds a child note to a active person note.

Expected result:
The new note is created, labeled, linked and shown in the “Family Tree” map.

Implemented code:

api.addButtonToToolbar({
   title: 'New TestRelation',
   icon: 'tag-alt',
   shortcut: 'alt+Y',
   action: async () => {
       // current note
       const sourceNote = api.getActiveContextNote();
           if (sourceNote.hasLabel("person")) {
               var type = "person";
           }
           else {
               return;
           }
       
       // creating notes is backend (server) responsibility so we need to pass
       // the control there
       const newNotes = await api.runOnBackend((sourceId, type) => {
           api.log("Source: " + sourceId + " Type: " + type);
           
           const rootNote = api.getNoteWithLabel('PeopleRoot');
           const resp = api.createTextNote(rootNote.noteId, 'new TestPerson');
           
           const templateNote = api.getNotesWithLabel("personTemplate")[0];
           resp.note.setRelation("template", templateNote.noteId);
           
           // set labels
           api.getNote(sourceId).setRelation("hasChild", resp.note.noteId);
           resp.note.setRelation("isChildOf", sourceId);
           resp.note.setAttribute("label", type);
           
           if (!rootNote) return [resp.note];
           else {
               return [resp.note, rootNote];
           }
       }, [sourceNote.noteId, type]);
       
       // wait until the frontend is fully synced with the changes made on the backend above
       await api.waitUntilSynced();

       // we got an ID of newly created note and we want to immediately display it
       await api.activateNewNote(newNotes[0].noteId);
       if (newNotes[1].noteId) await api.openTabWithNote(newNotes[1].noteId);
   }
});

Comments:
For my test case I reused the “button” example from Task manager implementation. I added first fetching the current note as source note, checking its label to be “person” and after entering backend, creating the new note inside the “My Family Tree” (labeled PeopleRoot) and setting a relation of person template. After this preparation ther are a few relations set: source note hasChild, new note isChildOf source note and a label person to new note. Finally results are returned, synced, notes opened for convenience.

Prerequisites:
"appVersion": "0.54.2", OS: Linux

My Family Tree: #child:person #PeopleRoot #mapType=tree

person template: #label:dateOfBirth=promoted,date,single #label:dateOfDeath=promoted,date,single #relation:isPartnerOf="promoted,inverse=isPartnerOf,multi" #relation:isChildOf="promoted,inverse=hasChild,multi" #relation:hasChild="promoted,inverse=isChildOf,multi" #person #iconClass="bx bx-face" #personTemplate

Result:
The new note TestPerson is created and labeled successfully: It is placed under “My Family Tree”.

New note TestPerson: #person ~template=Person template ~isChildOf=Princess Diana #dateOfBirth=2022-08-14

Source note Princess Diana: #dateOfBirth=1961-07-01 #dateOfDeath=1997-08-31 ~isPartnerOf=Prince Charles #person ~template=Person template ~hasChild=TestPerson

Missing Part:
The “My Family Tree” view doesn't show the new note. Nor can I find it elsewhere, however it is shown in the note map, backlinks etc as expected.

I looked up the docs, sources, read the discussions. What did I miss or what went wrong? How can I create a note as being a member of relation map? How can a relation relationMapLink be created? Please help, I am scratching my head. Thanks.

[zadam]

Hi, there's no API to put a note into a relation map. That step is manual.

[gaschz]

Thanks for your quick response and the heads up.

To be clear for myself: The manual way is by interactively clicking the
button at the GUI.

What would be the right actions to be taken? Creating the note,
updating the database via SQL, setting relations xyz?

Could you give me advice, please what would be the right sequence and the
queries? Or do you envision another way of issuing the "click"
programmatically? Thank you very much.

[zadam]

Relation map has a JSON format which defines which notes are there, what's there position etc. You would have to parse it and add the note reference there. The relation should be added as well (but that's used only for e.g. backlinks etc.)

[gaschz]

Thanks for the hint. The following approach works like a charm:

// get the mapData, transform to object
const relationMapContent = relationMapRootNote.getContent();
if (relationMapContent) {
    try {
        var mapData = JSON.parse(relationMapContent);
    } catch (e) {
        console.log("Could not parse content: ", e);
    }
}

// set the relation e.g. Target hasChild child
api.getNoteWithLabel("uniqueLabelTarget").setRelation("hasChild", childNote.noteId);

// update the mapData, transform to JSON and write back
mapData.notes.push({ noteId: childNote.noteId, x: 300 + Math.random() * 80, y: 250  + Math.random() * 80});
const newContent = JSON.stringify(mapData, null, '\t');
relationMapRootNote.setContent(newContent);

Solved.