Implement controlled list manager and reference datatype #10541

arches/app/datatypes/base.py

@@ -462,3 +462,9 @@ def pre_structure_tile_data(self, tile, nodeid, **kwargs):
         Adds properties to a tile necessary for some clients, but not essential to the tile
         """
         pass
+
+    def validate_node(self, node):
+        """
+        Confirms that a node is properly configured to collect data
+        """
+        return {"success": True}

arches/app/datatypes/datatypes.py

@@ -895,7 +895,7 @@ def add_date_to_doc(query, edtf):
                     if edtf.lower is None and edtf.upper is None:
                         raise Exception(_("Invalid date specified."))
 
-        if not value.get('op'):
+        if not value.get("op"):
             pass
         elif value["op"] == "null" or value["op"] == "not_null":
             self.append_null_search_filters(value, node, query, request)
@@ -1962,7 +1962,7 @@ def get_localized_option_text(self, node, option_id, return_lang=False):
         for option in node.config["options"]:
             if option["id"] == option_id:
                 return get_localized_value(option["text"], return_lang=return_lang)
-        raise Exception(_("No domain option found for option id {0}, in node conifg: {1}".format(option_id, node.config["options"])))
+        raise Exception(_("No domain option found for option id {0}, in node config: {1}".format(option_id, node.config["options"])))
 
     def get_option_id_from_text(self, value):
         # this could be better written with most of the logic in SQL tbh
@@ -2641,3 +2641,103 @@ def get_value_from_jsonld(json_ld_node):
             return
     except IndexError as e:
         return
+
+
+class ReferenceDataType(BaseDataType):
+    def validate(self, value, row_number=None, source="", node=None, nodeid=None, strict=False, **kwargs):
+        errors = []
+        title = _("Invalid Reference Datatype Value")
+        if value is None:
+            return errors
+
+        if type(value) == list and len(value):
+            for reference in value:
+                if "uri" in reference and len(reference["uri"]):
+                    pass
+                else:
+                    errors.append(
+                        {
+                            "type": "ERROR",
+                            "message": _("Reference objects require a 'uri' property and corresponding value"),
+                            "title": title,
+                        }
+                    )
+                if "labels" in reference:
+                    pref_label_languages = []
+                    for label in reference["labels"]:
+                        if not all(key in label for key in ("id", "value", "language_id", "valuetype_id")):
+                            errors.append(
+                                {
+                                    "type": "ERROR",
+                                    "message": _(
+                                        "Reference labels require properties: id(uuid), value(string), language_id(e.g. 'en'), and valuetype_id(e.g. 'prefLabel')"
+                                    ),
+                                    "title": title,
+                                }
+                            )
+                        if label["valuetype_id"] == "prefLabel":
+                            pref_label_languages.append(label["language_id"])
+
+                    if len(set(pref_label_languages)) < len(pref_label_languages):
+                        errors.append(
+                            {
+                                "type": "ERROR",
+                                "message": _("A reference can have only one prefLabel per language"),
+                                "title": title,
+                            }
+                        )
+        else:
+            errors.append({"type": "ERROR", "message": _("Reference value must be a list of reference objects"), "title": title})
+        return errors
+
+    def transform_value_for_tile(self, value, **kwargs):
+        ret = value
+        return ret
+
+    def clean(self, tile, nodeid):
+        super().clean(tile, nodeid)
+        if tile.data[nodeid] == []:
+            tile.data[nodeid] = None
+
+    def transform_export_values(self, value, *args, **kwargs):
+        new_values = value
+        return ",".join(new_values)
+
+    def get_display_value(self, tile, node, **kwargs):
+        labels = []
+        requested_language = kwargs.pop("language", None)
+        current_language = requested_language or get_language()
+        for item in self.get_tile_data(tile)[str(node.nodeid)]:
+            for label in item["labels"]:
+                if label["language_id"] == current_language and label["valuetype_id"] == "prefLabel":
+                    labels.append(label.get("value", ""))
+        return ", ".join(labels)
+
+    def collects_multiple_values(self):
+        return True
+
+    def default_es_mapping(self):
+        mapping = {
+            "properties": {
+                "uri": {"type": "keyword"},
+                "id": {"type": "keyword"},
+                "labels": {
+                    "properties": {},
+                },
+            }
+        }
+        return mapping
+
+    def validate_node(self, node):
+        valid = False
+        message = ""
+        title = ""
+        try:
+            uuid.UUID(node.config["controlledList"])
+            valid = True
+        except (TypeError, KeyError):
+            message = _("A reference datatype node must be configured with a controlled list")
+            title = _("Invalid Node Configuration")
+            logger.error(message)
+
+        return {"success": valid, "message": message, "title": title}

arches/app/media/js/viewmodels/reference-select.js

@@ -0,0 +1,166 @@
+define([
+    'jquery',
+    'knockout',
+    'knockout-mapping',
+    'arches',
+    'viewmodels/widget',
+], function($, ko, koMapping, arches, WidgetViewModel) {
+    var NAME_LOOKUP = {};
+    var ReferenceSelectViewModel = function(params) {
+        var self = this;
+
+        params.configKeys = ['placeholder'];
+        this.multiple = !!ko.unwrap(params.node.config.multiValue);
+        this.displayName = ko.observable('');
+        this.selectionValue = ko.observable([]); // formatted version of this.value that select2 can use
+        this.activeLanguage = arches.activeLanguage;
+
+        WidgetViewModel.apply(this, [params]);
+
+        this.getPrefLabel = function(labels){
+            return koMapping.toJS(labels)?.find(
+                label => label.language_id === arches.activeLanguage && label.valuetype_id === 'prefLabel'
+            )?.value || arches.translations.unlabeledItem;
+        }; 
+
+        this.isLabel = function (value) {
+            return ['prefLabel', 'altLabel'].includes(value.valuetype_id);
+        };
+
+        this.displayValue = ko.computed(function() {
+            const val = self.value();
+            let name = '';
+            if (val) {
+                name = val.map(item=>self.getPrefLabel(item.values)).join(", ");
+            }
+            return val ? name : null;
+        });
+
+        this.valueAndSelectionDiffer = function(value, selection) {
+            if (!(ko.unwrap(value) instanceof Array)) {
+                return true;
+            }
+            const valueUris = ko.unwrap(value).map(val=>ko.unwrap(val.uri));
+            return JSON.stringify(selection) !== JSON.stringify(valueUris);
+        };
+
+        this.selectionValue.subscribe(selection => {
+            if (selection) {
+                if (!(selection instanceof Array)) { selection = [selection]; }
+                if (self.valueAndSelectionDiffer(self.value, selection)) {
+                    const newItem = selection.map(uri => {
+                        return {
+                            "labels": NAME_LOOKUP[uri].values.filter(val => this.isLabel(val)),
+                            "listid": NAME_LOOKUP[uri]["listid"],
+                            "uri": uri
+                        };
+                    });
+                    self.value(newItem);
+                }
+            } else {
+                self.value(null);
+            }
+        });
+
+        this.value.subscribe(val => {
+            if (val?.length) {
+                self.selectionValue(val.map(item=>ko.unwrap(item.uri)));
+            } else {
+                self.selectionValue(null);
+            }
+        });
+
+        this.select2Config = {
+            value: self.selectionValue,
+            clickBubble: true,
+            multiple: this.multiple,
+            closeOnSelect: true,
+            placeholder: self.placeholder,
+            allowClear: true,
+            ajax: {
+                url: arches.urls.controlled_list(ko.unwrap(params.node.config.controlledList)),
+                dataType: 'json',
+                quietMillis: 250,
+                data: function(requestParams) {
+
+                    return {
+                        flat: true
+                    };
+                },
+                processResults: function(data) {
+                    const items = data.items; 
+                    items.forEach(item => {
+                        item["listid"] = item.id;
+                        item.id = item.uri;
+                    });
+                    return {
+                        "results": items,
+                        "pagination": {
+                            "more": false
+                        }
+                    };
+                }
+            },
+            templateResult: function(item) {
+                let indentation = '';
+                for (let i = 0; i < item.depth; i++) {
+                    indentation += '&nbsp;&nbsp;&nbsp;&nbsp;';
+                }
+
+                if (item.uri) {
+                    let text = self.getPrefLabel(item.values) || arches.translations.searching + '...';
+                    NAME_LOOKUP[item.uri] = {"prefLabel": text, "labels": item.values.filter(val => this.isLabel(val)), "listid": item.controlled_list_id};
+                    text = indentation + text;
+                    return text;
+                }
+            },
+            templateSelection: function(item) {
+                if (!item.uri) { // option has a different shape when coming from initSelection vs templateResult
+                    return item.text; 
+                } else {
+                    return NAME_LOOKUP[item.uri]["prefLabel"];
+                }
+            },
+            escapeMarkup: function(m) { return m; },
+            initComplete: false,
+            initSelection: function(el, callback) {
+
+                const setSelectionData = function(data) {
+                    const valueData = koMapping.toJS(self.value());
+                    valueData.forEach(function(value) {
+                        NAME_LOOKUP[value.uri] = {
+                                "prefLabel": self.getPrefLabel(value.values),
+                                "labels": value.values.filter(val => this.isLabel(val)),
+                                "listid": value.listid 
+                            };
+                    });
+
+                    if(!self.select2Config.initComplete){
+                        valueData.forEach(function(data) {
+                            const option = new Option(
+                                self.getPrefLabel(data.values),
+                                data.uri,
+                                true, 
+                                true
+                            );
+                            $(el).append(option);
+                            self.selectionValue().push(data.uri);
+                        });
+                        self.select2Config.initComplete = true;
+                    }
+                    callback(valueData);
+                };
+
+                if (self.value()?.length) {
+                    setSelectionData();
+                } else {
+                    callback([]);
+                }
+
+            }
+        };
+
+    };
+
+    return ReferenceSelectViewModel;
+});

arches/app/media/js/views/components/datatypes/reference.js

@@ -0,0 +1,55 @@
+define([
+    'knockout', 
+    'arches', 
+    'js-cookie',
+    'templates/views/components/datatypes/reference.htm',
+    'views/components/simple-switch',
+], function(ko, arches, Cookies, referenceDatatypeTemplate) {
+
+    const viewModel = function(params) {
+        const self = this;
+        this.search = params.search;
+
+        this.search = params.search;
+        if (this.search) {
+            params.config = ko.observable({
+                controlledList:[],
+                placeholder: arches.translations.selectAnOption,
+                multiValue: true
+            });
+        }
+
+        this.controlledList = params.config.controlledList;
+        this.multiValue = params.config.multiValue;
+        this.controlledLists = ko.observable();
+        this.getControlledLists = async function() {
+            const response = await fetch(arches.urls.controlled_lists, {
+                method: 'GET',
+                credentials: 'include',
+                headers: {
+                    "X-CSRFToken": Cookies.get('csrftoken')
+                },
+            });
+            if (response.ok) {
+                return await response.json(); 
+            } else {
+                console.error('Failed to fetch controlled lists');
+            }
+        };
+
+        this.init = async function() {
+            const lists = await this.getControlledLists();
+            this.controlledLists(lists.controlled_lists);
+        };
+
+        this.init();
+    };
+
+
+    ko.components.register('reference-datatype-config', {
+        viewModel: viewModel,
+        template: referenceDatatypeTemplate,
+    });
+
+    return name;
+});

arches/app/media/js/views/components/plugins/controlled-list-manager.js

@@ -0,0 +1,14 @@
+import ko from 'knockout';
+import ControlledListManager from '@/plugins/ControlledListManager.vue';
+import createVueApp from 'utils/create-vue-application';
+import ControlledListManagerTemplate from 'templates/views/components/plugins/controlled-list-manager.htm';
+
+
+ko.components.register('controlled-list-manager', {
+    viewModel: function() {
+        createVueApp(ControlledListManager).then((vueApp) => {
+            vueApp.mount('#controlled-list-manager-mounting-point');
+        })
+    },
+    template: ControlledListManagerTemplate,
+});

arches/app/media/js/views/components/widgets/reference-select.js

@@ -0,0 +1,15 @@
+define([
+    'knockout',
+    'viewmodels/reference-select',
+    'templates/views/components/widgets/reference-select.htm',
+    'bindings/select2-query',
+], function(ko, ReferenceSelectViewModel, referenceSelectTemplate) {
+    const viewModel = function(params) {
+        ReferenceSelectViewModel.apply(this, [params]);
+    };
+
+    return ko.components.register('reference-select-widget', {
+        viewModel: viewModel,
+        template: referenceSelectTemplate,
+    });
+});