Make interface display names more human readable (#589)

Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com> Co-authored-by: Garrett Michael Flynn <[email protected]> Co-authored-by: Cody Baker <[email protected]>
NeurodataWithoutBorders · Feb 19, 2024 · 7762b61 · 7762b61
1 parent fc11f3a
commit 7762b61
Show file tree

Hide file tree

Showing 5 changed files with 79 additions and 23 deletions.
diff --git a/pyflask/manageNeuroconv/manage_neuroconv.py b/pyflask/manageNeuroconv/manage_neuroconv.py
@@ -163,19 +163,32 @@ def get_class_ref_in_docstring(input_string):
 
 
 def derive_interface_info(interface):
+
     info = {"keywords": getattr(interface, "keywords", []), "description": ""}
-    if interface.__doc__:
+
+    if hasattr(interface, "associated_suffixes"):
+        info["suffixes"] = interface.associated_suffixes
+
+    if hasattr(interface, "info"):
+        info["description"] = interface.info
+
+    elif interface.__doc__:
         info["description"] = re.sub(
             remove_extra_spaces_pattern, " ", re.sub(doc_pattern, r"<code>\1</code>", interface.__doc__)
         )
 
+    info["name"] = interface.__name__
+
     return info
 
 
 def get_all_converter_info() -> dict:
-    from neuroconv import converters
+    from neuroconv.converters import converter_list
 
-    return {name: derive_interface_info(converter) for name, converter in module_to_dict(converters).items()}
+    return {
+        getattr(converter, "display_name", converter.__name__) or converter.__name__: derive_interface_info(converter)
+        for converter in converter_list
+    }
 
 
 def get_all_interface_info() -> dict:
@@ -201,7 +214,7 @@ def get_all_interface_info() -> dict:
     ]
 
     return {
-        interface.__name__: derive_interface_info(interface)
+        getattr(interface, "display_name", interface.__name__) or interface.__name__: derive_interface_info(interface)
         for interface in interface_list
         if not interface.__name__ in exclude_interfaces_from_selection
     }

diff --git a/pyflask/tests/test_neuroconv.py b/pyflask/tests/test_neuroconv.py
@@ -12,12 +12,14 @@ def test_get_all_interfaces(client):
                 "^.*Interface$": {
                     "type": "object",
                     "properties": {
+                        "name": {"type": "string"},
+                        "suffixes": {"type": "array", "items": {"type": "string"}},
                         "label": {"type": "string"},
                         "description": {"type": "string"},
                         "keywords": {"type": "array", "items": {"type": "string"}},
                     },
                     "additionalProperties": False,
-                    "required": ["keywords"],
+                    "required": ["name", "keywords"],
                 }
             },
         },

diff --git a/src/renderer/src/stories/Search.js b/src/renderer/src/stories/Search.js
@@ -158,6 +158,11 @@ export class Search extends LitElement {
                 z-index: 1;
             }
 
+            .structured-keywords {
+                font-size: 90%;
+                color: dimgrey;
+            }
+
             .option:hover {
                 background: #f2f2f2;
                 cursor: pointer;
@@ -204,8 +209,12 @@ export class Search extends LitElement {
         const options = this.shadowRoot.querySelectorAll(".option");
         this.#options = Array.from(options).map((option) => {
             const keywordString = option.getAttribute("data-keywords");
-            const keywords = keywordString ? JSON.parse(keywordString) : [];
-            return { option, keywords, label: option.querySelector(".label").innerText };
+            const structuredKeywordString = option.getAttribute("data-structured-keywords");
+
+            const keywords = keywordString ? JSON.parse(option.getAttribute("data-keywords")) : [];
+            const structuredKeywords = structuredKeywordString ? JSON.parse(structuredKeywordString) : {};
+
+            return { option, keywords, structuredKeywords, label: option.querySelector(".label").innerText };
         });
 
         this.#initialize();
@@ -256,8 +265,8 @@ export class Search extends LitElement {
         });
 
         // Check if the input value matches any of the keywords
-        this.#options.forEach(({ option, keywords = [] }, i) => {
-            keywords.forEach((keyword) => {
+        this.#options.forEach(({ option, keywords = [], structuredKeywords = {} }, i) => {
+            [...keywords, ...Object.values(structuredKeywords).flat()].forEach((keyword) => {
                 if (keyword.toLowerCase().includes(input.toLowerCase()) && !toShow.includes(i)) toShow.push(i);
             });
         });
@@ -317,13 +326,22 @@ export class Search extends LitElement {
                     listItemElement.classList.add("option");
                     listItemElement.setAttribute("hidden", "");
                     listItemElement.setAttribute("tabindex", -1);
-                    if (option.keywords) listItemElement.setAttribute("data-keywords", JSON.stringify(option.keywords));
+
+                    const { disabled, structuredKeywords, keywords } = option;
+
+                    if (structuredKeywords)
+                        listItemElement.setAttribute(
+                            "data-structured-keywords",
+                            JSON.stringify(option.structuredKeywords)
+                        );
+                    if (keywords) listItemElement.setAttribute("data-keywords", JSON.stringify(option.keywords));
+
                     listItemElement.addEventListener("click", (clickEvent) => {
                         clickEvent.stopPropagation();
                         this.#onSelect(option);
                     });
 
-                    if (option.disabled) listItemElement.setAttribute("disabled", "");
+                    if (disabled) listItemElement.setAttribute("disabled", "");
 
                     const container = document.createElement("div");
 
@@ -346,11 +364,25 @@ export class Search extends LitElement {
 
                     container.appendChild(label);
 
-                    if (option.keywords) {
-                        const keywords = document.createElement("small");
-                        keywords.classList.add("keywords");
-                        keywords.innerText = option.keywords.join(", ");
-                        container.appendChild(keywords);
+                    if (keywords) {
+                        const keywordsElement = document.createElement("small");
+                        keywordsElement.classList.add("keywords");
+                        keywordsElement.innerText = option.keywords.join(", ");
+                        container.appendChild(keywordsElement);
+                    }
+
+                    if (structuredKeywords) {
+                        const div = document.createElement("div");
+                        div.classList.add("structured-keywords");
+
+                        Object.entries(structuredKeywords).forEach(([key, value]) => {
+                            const keywordsElement = document.createElement("small");
+                            const capitalizedKey = key[0].toUpperCase() + key.slice(1);
+                            keywordsElement.innerHTML = `<b>${capitalizedKey}:</b> ${value.join(", ")}`;
+                            div.appendChild(keywordsElement);
+                        });
+
+                        container.appendChild(div);
                     }
 
                     listItemElement.append(container);

diff --git a/src/renderer/src/stories/pages/guided-mode/data/GuidedStructure.js b/src/renderer/src/stories/pages/guided-mode/data/GuidedStructure.js
@@ -115,15 +115,24 @@ export class GuidedStructurePage extends Page {
             .then((res) => res.json())
             .then((json) =>
                 Object.entries(json).map(([key, value]) => {
-                    const category = categories.find(({ test }) => test.test(key))?.value;
+                    const displayName = key.trim();
+
+                    const interfaceName = value.name;
+
+                    const category = categories.find(({ test }) => test.test(interfaceName))?.value;
+
+                    const structuredKeywords = {
+                        suffixes: value.suffixes ?? [],
+                    };
 
                     return {
-                        ...value,
-                        key,
-                        value: key,
+                        ...value, // Contains label and name already (extra metadata)
+                        key: displayName,
+                        value: interfaceName,
+                        structuredKeywords,
                         category,
-                        disabled: !supportedInterfaces.includes(key),
-                    }; // Has label and keywords property already
+                        disabled: !supportedInterfaces.includes(interfaceName),
+                    };
                 })
             )
             .catch((error) => console.error(error));

diff --git a/tests/e2e.test.ts b/tests/e2e.test.ts
@@ -342,7 +342,7 @@ describe('E2E Test', () => {
 
       await toNextPage('inspect')
 
-    }, 30 * 1000) // Wait for conversion to complete
+    }, 30 * 1000) // Wait for conversion preview to complete
 
     test('Review NWB Inspector output', async () => {