merge

enso-org · Oct 30, 2024 · 2277fa5 · 2277fa5
2 parents 3f2847e + 0d731ad
commit 2277fa5
Show file tree

Hide file tree

Showing 46 changed files with 1,590 additions and 182 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -12,6 +12,11 @@
 - [Changed the way of adding new column in Table Input Widget][11388]. The
   "virtual column" is replaced with an explicit (+) button.
 - [New dropdown-based component menu][11398].
+- [Undo/redo buttons in the top bar][11433].
+- [Size of Table Input Widget is preserved and restored after project
+  re-opening][11435]
+- [Added application version to the title bar.][11446]
+- [Added "open grouped components" action to the context menu.][11447]
 
 [11151]: https://github.com/enso-org/enso/pull/11151
 [11271]: https://github.com/enso-org/enso/pull/11271
@@ -20,6 +25,10 @@
 [11383]: https://github.com/enso-org/enso/pull/11383
 [11388]: https://github.com/enso-org/enso/pull/11388
 [11398]: https://github.com/enso-org/enso/pull/11398
+[11398]: https://github.com/enso-org/enso/pull/11433
+[11435]: https://github.com/enso-org/enso/pull/11435
+[11446]: https://github.com/enso-org/enso/pull/11446
+[11447]: https://github.com/enso-org/enso/pull/11447
 
 #### Enso Standard Library
 
@@ -103,6 +112,8 @@
   range.][11135]
 - [Added `format` parameter to `Decimal.parse`.][11205]
 - [Added `format` parameter to `Float.parse`.][11229]
+- [Implemented a cache for HTTP data requests, as well as a per-file response
+  size limit.][11342]
 
 [10614]: https://github.com/enso-org/enso/pull/10614
 [10660]: https://github.com/enso-org/enso/pull/10660
@@ -118,6 +129,7 @@
 [11135]: https://github.com/enso-org/enso/pull/11135
 [11205]: https://github.com/enso-org/enso/pull/11205
 [11229]: https://github.com/enso-org/enso/pull/11229
+[11342]: https://github.com/enso-org/enso/pull/11342
 
 #### Enso Language & Runtime
 

diff --git a/app/common/src/appConfig.js b/app/common/src/appConfig.js
@@ -44,7 +44,7 @@ export async function readEnvironmentFromFile() {
     if (!isProduction || entries.length > 0) {
       Object.assign(process.env, variables)
     }
-    process.env.ENSO_CLOUD_DASHBOARD_VERSION ??= buildInfo.version
+    process.env.ENSO_CLOUD_DASHBOARD_VERSION ??= buildInfo.version ?? '0.0.0-dev'
     process.env.ENSO_CLOUD_DASHBOARD_COMMIT_HASH ??= buildInfo.commit
   } catch (error) {
     process.env.ENSO_CLOUD_DASHBOARD_VERSION ??= buildInfo.version

diff --git a/app/gui/index.html b/app/gui/index.html
@@ -37,7 +37,7 @@
             maximum-scale = 1.0,
             user-scalable = no"
     />
-    <title>Enso Analytics</title>
+    <title>Enso %ENSO_IDE_VERSION%</title>
   </head>
   <body>
     <div id="enso-spotlight" class="enso-spotlight"></div>

diff --git a/app/gui/src/project-view/components/CircularMenu.vue b/app/gui/src/project-view/components/CircularMenu.vue
@@ -12,11 +12,13 @@ const isVisualizationEnabled = defineModel<boolean>('isVisualizationEnabled', {
 const props = defineProps<{
   isRecordingEnabledGlobally: boolean
   isRemovable: boolean
+  isEnterable: boolean
   matchableNodeColors: Set<string>
   documentationUrl: string | undefined
 }>()
 const emit = defineEmits<{
   'update:isVisualizationEnabled': [isVisualizationEnabled: boolean]
+  enterNode: []
   startEditing: []
   startEditingComment: []
   openFullMenu: []
@@ -94,6 +96,14 @@ function readableBinding(binding: keyof (typeof graphBindings)['bindings']) {
             <SvgIcon name="paint_palette" class="rowIcon" />
             <span>Color Component</span>
           </MenuButton>
+          <MenuButton
+            v-if="isEnterable"
+            data-testid="enter-node-button"
+            @click.stop="closeDropdown(), emit('enterNode')"
+          >
+            <SvgIcon name="open" class="rowIcon" />
+            <span>Open Grouped Components</span>
+          </MenuButton>
           <MenuButton data-testid="edit-button" @click.stop="closeDropdown(), emit('startEditing')">
             <SvgIcon name="edit" class="rowIcon" />
             <span>Code Edit</span>

diff --git a/app/gui/src/project-view/components/ComponentDocumentation.vue b/app/gui/src/project-view/components/ComponentDocumentation.vue
@@ -2,12 +2,12 @@
 import DocumentationPanel from '@/components/DocumentationPanel.vue'
 import { injectGraphSelection } from '@/providers/graphSelection'
 import { useGraphStore } from '@/stores/graph'
-import { computed } from 'vue'
+import { computed, watch } from 'vue'
 import type { SuggestionId } from 'ydoc-shared/languageServerTypes/suggestions'
-import { Err, Ok } from 'ydoc-shared/util/data/result'
+import { Err, Ok, unwrapOr } from 'ydoc-shared/util/data/result'
 
-const props = defineProps<{ displayedSuggestionId: SuggestionId | null }>()
-const emit = defineEmits<{ 'update:displayedSuggestionId': [SuggestionId] }>()
+// A displayed component can be overridren by this model, e.g. when the user clicks links in the documenation.
+const overrideDisplayed = defineModel<SuggestionId | null>({ default: null })
 const selection = injectGraphSelection()
 const graphStore = useGraphStore()
 
@@ -19,20 +19,20 @@ function docsForSelection() {
   return Ok(suggestionId)
 }
 
-const displayedId = computed(() =>
-  props.displayedSuggestionId != null ? Ok(props.displayedSuggestionId) : docsForSelection(),
-)
+const docs = computed(() => docsForSelection())
+// When the selection changes, we cancel the displayed suggestion override that can be in place.
+watch(docs, (_) => (overrideDisplayed.value = null))
+
+const displayedId = computed(() => overrideDisplayed.value ?? unwrapOr(docs.value, null))
 </script>
 
 <template>
   <DocumentationPanel
-    v-if="displayedId?.ok"
-    :selectedEntry="displayedId.value"
-    @update:selectedEntry="emit('update:displayedSuggestionId', $event)"
+    v-if="displayedId"
+    :selectedEntry="displayedId"
+    @update:selectedEntry="overrideDisplayed = $event"
   />
-  <div v-else-if="displayedId?.ok === false" class="help-placeholder">
-    {{ displayedId.error.payload }}.
-  </div>
+  <div v-else-if="!displayedId && !docs.ok" class="help-placeholder">{{ docs.error.payload }}.</div>
 </template>
 
 <style scoped>

diff --git a/app/gui/src/project-view/components/ControlButtons.vue b/app/gui/src/project-view/components/ControlButtons.vue
@@ -0,0 +1,42 @@
+<template>
+  <div class="ControlButtons">
+    <div class="control left-end">
+      <slot name="left"></slot>
+    </div>
+    <div class="control right-end">
+      <slot name="right"></slot>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.ControlButtons {
+  user-select: none;
+  display: flex;
+  place-items: center;
+  gap: 1px;
+}
+
+.control {
+  background: var(--color-frame-bg);
+  backdrop-filter: var(--blur-app-bg);
+  padding: 4px 4px;
+  width: 32px;
+}
+
+.left-end {
+  border-radius: var(--radius-full) 0 0 var(--radius-full);
+
+  > * {
+    margin: 0 0 0 auto;
+  }
+}
+
+.right-end {
+  border-radius: 0 var(--radius-full) var(--radius-full) 0;
+
+  > * {
+    margin: 0 auto 0 0;
+  }
+}
+</style>
diff --git a/app/gui/src/project-view/components/DocumentationPanel.vue b/app/gui/src/project-view/components/DocumentationPanel.vue
@@ -21,8 +21,8 @@ import type { QualifiedName } from '@/util/qualifiedName'
 import { qnSegments, qnSlice } from '@/util/qualifiedName'
 import { computed, watch } from 'vue'
 
-const props = defineProps<{ selectedEntry: Opt<SuggestionId>; aiMode?: boolean }>()
-const emit = defineEmits<{ 'update:selectedEntry': [id: SuggestionId] }>()
+const props = defineProps<{ selectedEntry: SuggestionId | null; aiMode?: boolean }>()
+const emit = defineEmits<{ 'update:selectedEntry': [value: SuggestionId | null] }>()
 const db = useSuggestionDbStore()
 
 const documentation = computed<Docs>(() => {

diff --git a/app/gui/src/project-view/components/DocumentationPanel/history.ts b/app/gui/src/project-view/components/DocumentationPanel/history.ts
@@ -8,47 +8,59 @@ export class HistoryStack {
   private index: Ref<number>
   public current: ComputedRef<SuggestionId | undefined>
 
-  /** TODO: Add docs */
+  /**
+   * Initializes the history stack.
+   */
   constructor() {
     this.stack = reactive([])
     this.index = ref(0)
     this.current = computed(() => this.stack[this.index.value] ?? undefined)
   }
 
-  /** TODO: Add docs */
+  /**
+   * Resets the history stack to contain only the current suggestion.
+   * @param current - The current suggestion ID to reset the stack with.
+   */
   public reset(current: SuggestionId) {
     this.stack.length = 0
     this.stack.push(current)
     this.index.value = 0
   }
 
-  /** TODO: Add docs */
+  /**
+   * Adds a new suggestion ID to the history stack, removing any forward history.
+   * @param id - The suggestion ID to record.
+   */
   public record(id: SuggestionId) {
     this.stack.splice(this.index.value + 1)
     this.stack.push(id)
     this.index.value = this.stack.length - 1
   }
 
-  /** TODO: Add docs */
+  /**
+   * Moves the history index forward by one step if possible.
+   */
   public forward() {
     if (this.canGoForward()) {
       this.index.value += 1
     }
   }
 
-  /** TODO: Add docs */
+  /**
+   * Navigates backward in the history if possible.
+   */
   public backward() {
     if (this.canGoBackward()) {
       this.index.value -= 1
     }
   }
 
-  /** TODO: Add docs */
+  /** @returns whether or not it is possible to navigate back in history from current position. */
   public canGoBackward(): boolean {
     return this.index.value > 0
   }
 
-  /** TODO: Add docs */
+  /** @returns whether or not it is possible to navigate forward in history from current position. */
   public canGoForward(): boolean {
     return this.index.value < this.stack.length - 1
   }

diff --git a/app/gui/src/project-view/components/GraphEditor.vue b/app/gui/src/project-view/components/GraphEditor.vue
@@ -726,7 +726,7 @@ const documentationEditorFullscreen = ref(false)
       <div ref="viewportNode" class="viewport" @click="handleClick">
         <GraphNodes
           @nodeOutputPortDoubleClick="handleNodeOutputPortDoubleClick"
-          @nodeDoubleClick="(id) => stackNavigator.enterNode(id)"
+          @enterNode="(id) => stackNavigator.enterNode(id)"
           @createNodes="createNodesFromSource"
           @toggleDocPanel="toggleRightDockHelpPanel"
         />
@@ -786,11 +786,7 @@ const documentationEditorFullscreen = ref(false)
         />
       </template>
       <template #help>
-        <ComponentDocumentation
-          :displayedSuggestionId="displayedDocs"
-          :aiMode="aiMode"
-          @update:displayedSuggestionId="displayedDocs = $event"
-        />
+        <ComponentDocumentation v-model="displayedDocs" :aiMode="aiMode" />
       </template>
     </DockPanel>
   </div>

diff --git a/app/gui/src/project-view/components/GraphEditor/GraphNode.vue b/app/gui/src/project-view/components/GraphEditor/GraphNode.vue
@@ -61,7 +61,7 @@ const emit = defineEmits<{
   replaceSelection: []
   outputPortClick: [event: PointerEvent, portId: AstId]
   outputPortDoubleClick: [event: PointerEvent, portId: AstId]
-  doubleClick: []
+  enterNode: []
   createNodes: [options: NodeCreationOptions[]]
   setNodeColor: [color: string | undefined]
   toggleDocPanel: []
@@ -377,7 +377,7 @@ const handleNodeClick = useDoubleClick(
     }
   },
   () => {
-    if (!significantMove.value) emit('doubleClick')
+    if (!significantMove.value) emit('enterNode')
   },
 ).handleClick
 
@@ -469,6 +469,8 @@ watchEffect(() => {
       :matchableNodeColors="matchableNodeColors"
       :documentationUrl="documentationUrl"
       :isRemovable="props.node.type === 'component'"
+      :isEnterable="graph.nodeCanBeEntered(nodeId)"
+      @enterNode="emit('enterNode')"
       @startEditing="startEditingNode"
       @startEditingComment="editingComment = true"
       @openFullMenu="openFullMenu"

diff --git a/app/gui/src/project-view/components/GraphEditor/GraphNodes.vue b/app/gui/src/project-view/components/GraphEditor/GraphNodes.vue
@@ -17,7 +17,7 @@ import { stackItemsEqual } from 'ydoc-shared/languageServerTypes'
 
 const emit = defineEmits<{
   nodeOutputPortDoubleClick: [portId: AstId]
-  nodeDoubleClick: [nodeId: NodeId]
+  enterNode: [nodeId: NodeId]
   createNodes: [source: NodeId, options: NodeCreationOptions[]]
   toggleDocPanel: []
 }>()
@@ -75,7 +75,7 @@ const graphNodeSelections = shallowRef<HTMLElement>()
       @draggingCancelled="dragging.cancelDrag()"
       @outputPortClick="(event, port) => graphStore.createEdgeFromOutput(port, event)"
       @outputPortDoubleClick="(_event, port) => emit('nodeOutputPortDoubleClick', port)"
-      @doubleClick="emit('nodeDoubleClick', id)"
+      @enterNode="emit('enterNode', id)"
       @createNodes="emit('createNodes', id, $event)"
       @toggleDocPanel="emit('toggleDocPanel')"
       @setNodeColor="graphStore.overrideNodeColor(id, $event)"

diff --git a/app/gui/src/project-view/components/GraphEditor/NodeWidgetTree.vue b/app/gui/src/project-view/components/GraphEditor/NodeWidgetTree.vue
@@ -67,16 +67,23 @@ function handleWidgetUpdates(update: WidgetUpdate) {
   selectNode()
   const edit = update.edit ?? graph.startEdit()
   if (update.portUpdate) {
-    const { value, origin } = update.portUpdate
+    const { origin } = update.portUpdate
     if (Ast.isAstId(origin)) {
-      const ast =
-        value instanceof Ast.Ast ? value
-        : value == null ? Ast.Wildcard.new(edit)
-        : undefined
-      if (ast) {
-        edit.replaceValue(origin, ast)
-      } else if (typeof value === 'string') {
-        edit.tryGet(origin)?.syncToCode(value)
+      if ('value' in update.portUpdate) {
+        const value = update.portUpdate.value
+        const ast =
+          value instanceof Ast.Ast ? value
+          : value == null ? Ast.Wildcard.new(edit)
+          : undefined
+        if (ast) {
+          edit.replaceValue(origin, ast)
+        } else if (typeof value === 'string') {
+          edit.tryGet(origin)?.syncToCode(value)
+        }
+      }
+      if ('metadata' in update.portUpdate) {
+        const { metadataKey, metadata } = update.portUpdate
+        edit.tryGet(origin)?.setWidgetMetadata(metadataKey, metadata)
       }
     } else {
       console.error(`[UPDATE ${origin}] Invalid top-level origin. Expected expression ID.`)

diff --git a/app/gui/src/project-view/components/GraphEditor/widgets/WidgetFunction.vue b/app/gui/src/project-view/components/GraphEditor/widgets/WidgetFunction.vue
@@ -82,6 +82,11 @@ const innerInput = computed(() => {
 function handleArgUpdate(update: WidgetUpdate): boolean {
   const app = application.value
   if (update.portUpdate && app instanceof ArgumentApplication) {
+    if (!('value' in update.portUpdate)) {
+      if (!Ast.isAstId(update.portUpdate.origin))
+        console.error('Tried to set metadata on arg placeholder. This is not implemented yet!')
+      return false
+    }
     const { value, origin } = update.portUpdate
     const edit = update.edit ?? graph.startEdit()
     // Find the updated argument by matching origin port/expression with the appropriate argument.