From 45221d916728822dd1638bfd1472b9ed9d3737ae Mon Sep 17 00:00:00 2001
From: Ilya Bogdanov <fumlead@gmail.com>
Date: Fri, 2 Feb 2024 18:55:22 +0400
Subject: [PATCH] A quick fix for incorrectly working dropdowns. (#8933)

Partial fix for #8932

https://github.com/enso-org/enso/assets/6566674/75a878fb-891b-44fc-bdfd-c3cbb90c9f35

This is not a correct fix, as comparing strings is not what we really want, but it should fix most of use cases.
---
 app/gui2/e2e/widgets.spec.ts                  |  2 +-
 .../GraphEditor/widgets/WidgetSelection.vue   | 19 ++++++++++---------
 2 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/app/gui2/e2e/widgets.spec.ts b/app/gui2/e2e/widgets.spec.ts
index 7b73955900..325f220e95 100644
--- a/app/gui2/e2e/widgets.spec.ts
+++ b/app/gui2/e2e/widgets.spec.ts
@@ -14,12 +14,12 @@ class DropDownLocator {
 
   async expectVisibleWithOptions(page: Page, options: string[]): Promise<void> {
     await expect(this.dropDown).toBeVisible()
-    await expect(this.items).toHaveCount(options.length)
     for (const option of options) {
       await expect(
         this.items.filter({ has: page.getByText(option, { exact: true }) }),
       ).toBeVisible()
     }
+    await expect(this.items).toHaveCount(options.length)
   }
 
   async clickOption(page: Page, option: string): Promise<void> {
diff --git a/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue b/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
index 7cf4a21b0f..68ac35ae3c 100644
--- a/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
+++ b/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
@@ -79,21 +79,22 @@ const dynamicTags = computed<Tag[]>(() => {
 const tags = computed(() => (dynamicTags.value.length > 0 ? dynamicTags.value : staticTags.value))
 const tagLabels = computed(() => tags.value.map((tag) => tag.label ?? tag.expression))
 
+const removeSurroundingParens = (expr?: string) => expr?.trim().replaceAll(/(^[(])|([)]$)/g, '')
+
 const selectedIndex = ref<number>()
 const selectedTag = computed(() => {
   if (selectedIndex.value != null) {
     return tags.value[selectedIndex.value]
   } else {
-    const currentExpression = WidgetInput.valueRepr(props.input)?.trim()
+    const currentExpression = removeSurroundingParens(WidgetInput.valueRepr(props.input))
     if (!currentExpression) return undefined
-    return tags.value.find((tag) => {
-      const tagExpression = tag.expression.trim()
-      return (
-        tagExpression === currentExpression ||
-        tagExpression === `(${currentExpression})` ||
-        `(${tagExpression})` === currentExpression
-      )
-    })
+    // We need to find the tag that matches the (beginning of) current expression.
+    // To prevent partial prefix matches, we arrange tags in reverse lexicographical order.
+    const sortedTags = tags.value
+      .map((tag, index) => [removeSurroundingParens(tag.expression), index] as [string, number])
+      .sort(([a], [b]) => (a < b ? 1 : a > b ? -1 : 0))
+    const [_, index] = sortedTags.find(([expr]) => currentExpression.startsWith(expr)) ?? []
+    return index != null ? tags.value[index] : undefined
   }
 })