Adds initial support for uploading table data #87

Open

jsheunis wants to merge 2 commits from tables into main

jsheunis commented

2025-04-16 10:17:19 +00:00

(Migrated from github.com)

Towards addressing https://github.com/psychoinformatics-de/shacl-vue/issues/85 and https://github.com/psychoinformatics-de/shacl-vue/issues/83

This commit adds support for uploading table data (in CSV/TSV) format to allow bulk record creation. It introduces the following:

a new TableLoader components that provides filepicker, drag n drop, and URL downloading capability in order to load a table.
The use of the tabulator package for structuring, rendering, editing tables (with loads of other functionality for future use).
A new DataTable class that handles all aspects of integrating tabulator table data into shacl-vue, mainly for the purpose of saving table rows as records (and, by extension, as RDF).

The TableLoader component is instantiated in two cases:

from the main shacl-vue view where all records of a specific class are shown, the user can hit the button to upload multiple new records
from the FormEditor component when a user is editing a specific existing record, a bulk upload can be done for InstanceSelectEditor properties (i.e. anything that is a related named node or blank node)

In both these cases, the TableLoader component is instantiated and rendered inside a popup dialog. New records are created when the save button is pressed, in both cases. In addition, in the latter case the newly created records will also be linked to their 'parent' record that is being edited.

This commit does not yet include the following:

validation of the table data according to the associated shacl shapes before saving them to the FormData and then to RDF.
validation of table headings according to the shape of the expected class (this is currently only done on Save)
editing of existing records via the bulk upload mechanism; the save operation currently only creates new records and doesn't compare against existing records in the RDF store.
anything else that I can't think of right now.
dealing with inlined objects in a seamless/easy way

A demo:

https://github.com/user-attachments/assets/cac7b509-3cfb-40c3-961e-c7bd58bba5b6

Towards addressing https://github.com/psychoinformatics-de/shacl-vue/issues/85 and https://github.com/psychoinformatics-de/shacl-vue/issues/83 This commit adds support for uploading table data (in CSV/TSV) format to allow bulk record creation. It introduces the following: - a new TableLoader components that provides filepicker, drag n drop, and URL downloading capability in order to load a table. - The use of the tabulator package for structuring, rendering, editing tables (with loads of other functionality for future use). - A new DataTable class that handles all aspects of integrating tabulator table data into shacl-vue, mainly for the purpose of saving table rows as records (and, by extension, as RDF). The TableLoader component is instantiated in two cases: - from the main shacl-vue view where all records of a specific class are shown, the user can hit the button to upload multiple new records - from the FormEditor component when a user is editing a specific existing record, a bulk upload can be done for InstanceSelectEditor properties (i.e. anything that is a related named node or blank node) In both these cases, the TableLoader component is instantiated and rendered inside a popup dialog. New records are created when the save button is pressed, in both cases. In addition, in the latter case the newly created records will also be linked to their 'parent' record that is being edited. This commit does not yet include the following: - validation of the table data according to the associated shacl shapes before saving them to the FormData and then to RDF. - validation of table headings according to the shape of the expected class (this is currently only done on Save) - editing of existing records via the bulk upload mechanism; the save operation currently only creates new records and doesn't compare against existing records in the RDF store. - anything else that I can't think of right now. - dealing with inlined objects in a seamless/easy way A demo: https://github.com/user-attachments/assets/cac7b509-3cfb-40c3-961e-c7bd58bba5b6

This pull request has changes conflicting with the target branch.

package-lock.json
package.json
src/components/FileLoader.vue
src/components/InstancesSelectEditor.vue
src/components/NodeShapeViewer.vue
src/components/PropertyShapeEditor.vue
src/components/ShaclVue.vue

View command line instructions

Checkout

From your project repository, check out a new branch and test the changes.

git fetch -u origin tables:tables

git switch tables

Merge

Merge the changes and update on Forgejo.

Warning: The "Autodetect manual merge" setting is not enabled for this repository, you will have to mark this pull request as manually merged afterwards.

git switch main

git merge --no-ff tables

git switch tables

git rebase main

git switch main

git merge --ff-only tables

git switch tables

git rebase main

git switch main

git merge --no-ff tables

git switch main

git merge --squash tables