From 0d635626aa687ab7fc83da010ef90fb3f0feba0d Mon Sep 17 00:00:00 2001
From: AdRiley <riley.ad@gmail.com>
Date: Fri, 23 Feb 2024 11:12:21 +0000
Subject: [PATCH 01/26] Added unique, deduplicate aliases for distinct (#9152)

Added unique, deduplicate aliases for distinct
---
 distribution/lib/Standard/Base/0.0.0-dev/src/Data/Array.enso   | 3 ++-
 distribution/lib/Standard/Base/0.0.0-dev/src/Data/Vector.enso  | 3 ++-
 .../lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso     | 3 ++-
 distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso  | 3 ++-
 4 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Array.enso b/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Array.enso
index dd3f64bacecc..aec254bbf014 100644
--- a/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Array.enso
+++ b/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Array.enso
@@ -306,7 +306,8 @@ type Array
     to_list : List
     to_list self = Array_Like_Helpers.to_list self
 
-    ## GROUP Selections
+    ## ALIAS unique, deduplicate
+       GROUP Selections
        ICON preparation
        Keeps only unique elements within the array, removing any duplicates.
 
diff --git a/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Vector.enso b/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Vector.enso
index 24f7c648671a..2b1a67fb0e24 100644
--- a/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Vector.enso
+++ b/distribution/lib/Standard/Base/0.0.0-dev/src/Data/Vector.enso
@@ -1047,7 +1047,8 @@ type Vector a
     sort self (order = Sort_Direction.Ascending) on=Nothing by=Nothing on_incomparable=Problem_Behavior.Ignore =
         Array_Like_Helpers.sort self order on by on_incomparable
 
-    ## GROUP Selections
+    ## ALIAS unique, deduplicate
+       GROUP Selections
        ICON preparation
        Keeps only unique elements within the vector, removing any duplicates.
 
diff --git a/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso b/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
index d84b4fe709de..223247fc3026 100644
--- a/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
+++ b/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
@@ -1138,7 +1138,8 @@ type DB_Table
         # If the key is a result of a join, union or a subquery then it has no notion of primary key.
         _ -> Nothing
 
-    ## GROUP Standard.Base.Selections
+    ## ALIAS unique, deduplicate
+       GROUP Standard.Base.Selections
        ICON preparation
        Returns the distinct set of rows within the specified columns from the
        input table.
diff --git a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
index 49b45e491949..fa0b101094ea 100644
--- a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
+++ b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
@@ -823,7 +823,8 @@ type Table
                 self.java_table.orderBy java_columns directions comparator
             Table.Value java_table
 
-    ## GROUP Standard.Base.Selections
+    ## ALIAS unique, deduplicate
+       GROUP Standard.Base.Selections
        ICON preparation
        Returns the distinct set of rows within the specified columns from the
        input table.

From 7ff90aa3f7c63c9809101d05ec3595a3970f0063 Mon Sep 17 00:00:00 2001
From: Dmitry Bushev <bushevdv@gmail.com>
Date: Fri, 23 Feb 2024 11:18:01 +0000
Subject: [PATCH 02/26] Synchronize suggestions loading after the reconnect 2
 (#9142)

related #8689, #9072

Fixes a race between the language server SQL updating logic and the engine `DeserializeLibrarySuggestionsJob`s when the library suggestions may start loading before the database is properly cleaned up after the reconnect.

# Important Notes
As a side effect, arguments are showing slightly (~1 second) faster due to the lower contention between the engine jobs.

#### Before
https://github.com/enso-org/enso/assets/357683/cbda2da4-9080-4b9b-b836-81e54694d468

#### After
https://github.com/enso-org/enso/assets/357683/bf442284-47be-456d-b1dd-2413b6ad8244
---
 .../search/SearchProtocol.scala               |  3 +
 .../search/SuggestionsHandler.scala           | 86 +++++++++++++------
 .../InvalidateModulesIndexHandler.scala       | 18 +++-
 .../InvalidateModulesIndexCommand.java        |  3 +-
 .../instrument/job/BackgroundJob.java         | 11 +++
 .../StartBackgroundProcessingCmd.scala        |  3 +-
 .../DeserializeLibrarySuggestionsJob.scala    |  2 +-
 .../searcher/sql/SqlSuggestionsRepo.scala     |  5 +-
 8 files changed, 94 insertions(+), 37 deletions(-)

diff --git a/engine/language-server/src/main/scala/org/enso/languageserver/search/SearchProtocol.scala b/engine/language-server/src/main/scala/org/enso/languageserver/search/SearchProtocol.scala
index a4c4a737abc3..5d636a34c71a 100644
--- a/engine/language-server/src/main/scala/org/enso/languageserver/search/SearchProtocol.scala
+++ b/engine/language-server/src/main/scala/org/enso/languageserver/search/SearchProtocol.scala
@@ -493,6 +493,9 @@ object SearchProtocol {
     updates: Seq[SuggestionsDatabaseUpdate]
   )
 
+  /** A request to clear the suggestions database. */
+  case object ClearSuggestionsDatabase
+
   /** The request to receive contents of the suggestions database. */
   case object GetSuggestionsDatabase
 
diff --git a/engine/language-server/src/main/scala/org/enso/languageserver/search/SuggestionsHandler.scala b/engine/language-server/src/main/scala/org/enso/languageserver/search/SuggestionsHandler.scala
index 86e58510f5d1..ba5c85eca2ec 100644
--- a/engine/language-server/src/main/scala/org/enso/languageserver/search/SuggestionsHandler.scala
+++ b/engine/language-server/src/main/scala/org/enso/languageserver/search/SuggestionsHandler.scala
@@ -110,6 +110,8 @@ final class SuggestionsHandler(
     )
     context.system.eventStream
       .subscribe(self, classOf[Api.LibraryLoaded])
+    context.system.eventStream
+      .subscribe(self, classOf[Api.BackgroundJobsStartedNotification])
     context.system.eventStream.subscribe(self, classOf[FileDeletedEvent])
     context.system.eventStream
       .subscribe(self, InitializedEvent.SuggestionsRepoInitialized.getClass)
@@ -186,13 +188,29 @@ final class SuggestionsHandler(
 
     case msg: Api.SuggestionsDatabaseSuggestionsLoadedNotification
         if state.isSuggestionLoadingRunning =>
-      state.suggestionLoadingQueue.enqueue(msg)
+      logger.trace(
+        "SuggestionsDatabaseSuggestionsLoadedNotification [shouldStartBackgroundProcessing={}].",
+        state.shouldStartBackgroundProcessing
+      )
+      if (state.shouldStartBackgroundProcessing) {
+        state.suggestionLoadingQueue.clear()
+      } else {
+        state.suggestionLoadingQueue.enqueue(msg)
+      }
 
     case msg: Api.SuggestionsDatabaseSuggestionsLoadedNotification =>
       logger.debug(
         "Starting loading suggestions for library [{}].",
         msg.libraryName
       )
+      context.become(
+        initialized(
+          projectName,
+          graph,
+          clients,
+          state.suggestionLoadingRunning()
+        )
+      )
       applyLoadedSuggestions(msg.suggestions)
         .onComplete {
           case Success(notification) =>
@@ -214,14 +232,6 @@ final class SuggestionsHandler(
             )
             self ! SuggestionsHandler.SuggestionLoadingCompleted
         }
-      context.become(
-        initialized(
-          projectName,
-          graph,
-          clients,
-          state.suggestionLoadingRunning()
-        )
-      )
 
     case msg: Api.SuggestionsDatabaseModuleUpdateNotification
         if state.isSuggestionUpdatesRunning =>
@@ -304,39 +314,65 @@ final class SuggestionsHandler(
         )
       )
 
+    case Api.BackgroundJobsStartedNotification() =>
+      self ! SuggestionLoadingCompleted
+      context.become(
+        initialized(
+          projectName,
+          graph,
+          clients,
+          state.backgroundProcessingStarted()
+        )
+      )
+
     case GetSuggestionsDatabaseVersion =>
       suggestionsRepo.currentVersion
         .map(GetSuggestionsDatabaseVersionResult)
         .pipeTo(sender())
 
-    case GetSuggestionsDatabase =>
-      val responseAction = for {
-        _       <- suggestionsRepo.clean
-        version <- suggestionsRepo.currentVersion
-      } yield GetSuggestionsDatabaseResult(version, Seq())
-
-      responseAction.pipeTo(sender())
-
-      val handlerAction = for {
-        _ <- responseAction
-      } yield SearchProtocol.InvalidateModulesIndex
+    case ClearSuggestionsDatabase =>
+      if (state.isSuggestionLoadingRunning) stash()
+      else {
+        context.become(
+          initialized(
+            projectName,
+            graph,
+            clients,
+            state.suggestionLoadingRunning()
+          )
+        )
+        for {
+          _ <- suggestionsRepo.clean
+        } yield {
+          logger.trace(
+            "ClearSuggestionsDatabase [{}].",
+            state.suggestionLoadingQueue
+          )
+          state.suggestionLoadingQueue.clear()
+          runtimeConnector ! Api.Request(Api.StartBackgroundProcessing())
+        }
+      }
 
+    case GetSuggestionsDatabase =>
       val handler = context.system.actorOf(
         InvalidateModulesIndexHandler.props(
           RuntimeFailureMapper(contentRootManager),
           timeout,
-          runtimeConnector
+          runtimeConnector,
+          self
         )
       )
 
-      handlerAction.pipeTo(handler)
+      handler ! SearchProtocol.InvalidateModulesIndex
+
+      sender() ! GetSuggestionsDatabaseResult(0, Seq())
 
       context.become(
         initialized(
           projectName,
           graph,
           clients,
-          state.backgroundProcessingStarted()
+          state.backgroundProcessingStopped()
         )
       )
 
@@ -419,7 +455,8 @@ final class SuggestionsHandler(
         InvalidateModulesIndexHandler.props(
           runtimeFailureMapper,
           timeout,
-          runtimeConnector
+          runtimeConnector,
+          self
         )
       )
       action.pipeTo(handler)(sender())
@@ -450,6 +487,7 @@ final class SuggestionsHandler(
       )
 
     case SuggestionLoadingCompleted =>
+      unstashAll()
       if (state.suggestionLoadingQueue.nonEmpty) {
         self ! state.suggestionLoadingQueue.dequeue()
       }
diff --git a/engine/language-server/src/main/scala/org/enso/languageserver/search/handler/InvalidateModulesIndexHandler.scala b/engine/language-server/src/main/scala/org/enso/languageserver/search/handler/InvalidateModulesIndexHandler.scala
index 899eb958de27..69e9dd2dacad 100644
--- a/engine/language-server/src/main/scala/org/enso/languageserver/search/handler/InvalidateModulesIndexHandler.scala
+++ b/engine/language-server/src/main/scala/org/enso/languageserver/search/handler/InvalidateModulesIndexHandler.scala
@@ -17,11 +17,13 @@ import scala.concurrent.duration.FiniteDuration
   * @param runtimeFailureMapper mapper for runtime failures
   * @param timeout request timeout
   * @param runtime reference to the runtime connector
+  * @param suggestionsHandler reference to the suggestions handler
   */
 final class InvalidateModulesIndexHandler(
   runtimeFailureMapper: RuntimeFailureMapper,
   timeout: FiniteDuration,
-  runtime: ActorRef
+  runtime: ActorRef,
+  suggestionsHandler: ActorRef
 ) extends Actor
     with LazyLogging
     with UnhandledLogging {
@@ -50,6 +52,7 @@ final class InvalidateModulesIndexHandler(
       context.stop(self)
 
     case Api.Response(_, Api.InvalidateModulesIndexResponse()) =>
+      suggestionsHandler ! SearchProtocol.ClearSuggestionsDatabase
       replyTo ! SearchProtocol.InvalidateSuggestionsDatabaseResult
       cancellable.cancel()
       context.stop(self)
@@ -67,14 +70,21 @@ object InvalidateModulesIndexHandler {
     *
     * @param runtimeFailureMapper mapper for runtime failures
     * @param timeout request timeout
-    * @param runtime reference to the runtime conector
+    * @param runtime reference to the runtime connector
+    * @param suggestionsHandler reference to the suggestions handler
     */
   def props(
     runtimeFailureMapper: RuntimeFailureMapper,
     timeout: FiniteDuration,
-    runtime: ActorRef
+    runtime: ActorRef,
+    suggestionsHandler: ActorRef
   ): Props =
     Props(
-      new InvalidateModulesIndexHandler(runtimeFailureMapper, timeout, runtime)
+      new InvalidateModulesIndexHandler(
+        runtimeFailureMapper,
+        timeout,
+        runtime,
+        suggestionsHandler
+      )
     )
 }
diff --git a/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/command/InvalidateModulesIndexCommand.java b/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/command/InvalidateModulesIndexCommand.java
index 7edaa2710840..3e61838cacd7 100644
--- a/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/command/InvalidateModulesIndexCommand.java
+++ b/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/command/InvalidateModulesIndexCommand.java
@@ -5,7 +5,6 @@
 import java.util.logging.Level;
 import org.enso.interpreter.instrument.execution.RuntimeContext;
 import org.enso.interpreter.instrument.job.DeserializeLibrarySuggestionsJob;
-import org.enso.interpreter.instrument.job.StartBackgroundProcessingJob;
 import org.enso.interpreter.runtime.EnsoContext;
 import org.enso.polyglot.runtime.Runtime$Api$InvalidateModulesIndexResponse;
 import scala.Option;
@@ -33,6 +32,7 @@ public Future<BoxedUnit> executeAsynchronously(RuntimeContext ctx, ExecutionCont
           TruffleLogger logger = ctx.executionService().getLogger();
           long writeCompilationLockTimestamp = ctx.locking().acquireWriteCompilationLock();
           try {
+            ctx.jobControlPlane().stopBackgroundJobs();
             ctx.jobControlPlane().abortBackgroundJobs(DeserializeLibrarySuggestionsJob.class);
 
             EnsoContext context = ctx.executionService().getContext();
@@ -48,7 +48,6 @@ public Future<BoxedUnit> executeAsynchronously(RuntimeContext ctx, ExecutionCont
                       return BoxedUnit.UNIT;
                     });
 
-            StartBackgroundProcessingJob.startBackgroundJobs(ctx);
             reply(new Runtime$Api$InvalidateModulesIndexResponse(), ctx);
           } finally {
             ctx.locking().releaseWriteCompilationLock();
diff --git a/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/job/BackgroundJob.java b/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/job/BackgroundJob.java
index 3ecac0f03651..23bf01a84d45 100644
--- a/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/job/BackgroundJob.java
+++ b/engine/runtime-instrument-common/src/main/java/org/enso/interpreter/instrument/job/BackgroundJob.java
@@ -22,6 +22,17 @@ public BackgroundJob(int priority) {
     this.priority = priority;
   }
 
+  /**
+   * Create a background job with priority.
+   *
+   * @param priority the job priority. Lower number indicates higher priority.
+   * @param mayInterruptIfRunning the flag indicating if the running job may be interrupted.
+   */
+  public BackgroundJob(int priority, boolean mayInterruptIfRunning) {
+    super(List$.MODULE$.empty(), true, mayInterruptIfRunning);
+    this.priority = priority;
+  }
+
   /**
    * @return the job priority.
    */
diff --git a/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/command/StartBackgroundProcessingCmd.scala b/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/command/StartBackgroundProcessingCmd.scala
index 5194accc483a..bde3651c8e37 100644
--- a/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/command/StartBackgroundProcessingCmd.scala
+++ b/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/command/StartBackgroundProcessingCmd.scala
@@ -19,8 +19,7 @@ final class StartBackgroundProcessingCmd(
     ctx: RuntimeContext,
     ec: ExecutionContext
   ): Future[Unit] = {
-    StartBackgroundProcessingJob.startBackgroundJobs()
-    Future.successful(())
+    Future(StartBackgroundProcessingJob.startBackgroundJobs())
   }
 
 }
diff --git a/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/job/DeserializeLibrarySuggestionsJob.scala b/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/job/DeserializeLibrarySuggestionsJob.scala
index 7f9277f19bdb..2e1bbe71763e 100644
--- a/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/job/DeserializeLibrarySuggestionsJob.scala
+++ b/engine/runtime-instrument-common/src/main/scala/org/enso/interpreter/instrument/job/DeserializeLibrarySuggestionsJob.scala
@@ -14,7 +14,7 @@ import scala.jdk.CollectionConverters._
   */
 final class DeserializeLibrarySuggestionsJob(
   val libraryName: LibraryName
-) extends BackgroundJob[Unit](DeserializeLibrarySuggestionsJob.Priority)
+) extends BackgroundJob[Unit](DeserializeLibrarySuggestionsJob.Priority, true)
     with UniqueJob[Unit] {
 
   /** @inheritdoc */
diff --git a/lib/scala/searcher/src/main/scala/org/enso/searcher/sql/SqlSuggestionsRepo.scala b/lib/scala/searcher/src/main/scala/org/enso/searcher/sql/SqlSuggestionsRepo.scala
index 62d9faae1882..457e8b7ad2c1 100644
--- a/lib/scala/searcher/src/main/scala/org/enso/searcher/sql/SqlSuggestionsRepo.scala
+++ b/lib/scala/searcher/src/main/scala/org/enso/searcher/sql/SqlSuggestionsRepo.scala
@@ -175,10 +175,7 @@ final class SqlSuggestionsRepo(val db: SqlDatabase)(implicit
 
   /** The query to clean the repo. */
   private def cleanQuery: DBIO[Unit] = {
-    for {
-      _ <- Suggestions.delete
-      _ <- SuggestionsVersion.delete
-    } yield ()
+    DBIO.seq(Suggestions.delete, SuggestionsVersion.delete)
   }
 
   /** The query to get all suggestions.

From a900fb5c4394150d0d727b8d87c6b9eac0239450 Mon Sep 17 00:00:00 2001
From: Michael Mauderer <michael.mauderer@enso.org>
Date: Fri, 23 Feb 2024 11:19:35 +0000
Subject: [PATCH 03/26] Add docs to highlight order of processing dirty nodes
 in `readFunctionAst`. (#9141)

---
 app/gui2/src/stores/graph/graphDatabase.ts | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/app/gui2/src/stores/graph/graphDatabase.ts b/app/gui2/src/stores/graph/graphDatabase.ts
index 339efe4c2e83..e060cd0a2de5 100644
--- a/app/gui2/src/stores/graph/graphDatabase.ts
+++ b/app/gui2/src/stores/graph/graphDatabase.ts
@@ -325,6 +325,10 @@ export class GraphDb {
     }
   }
 
+  /**
+   * Note that the `dirtyNodes` are visited and updated in the order that they appear in the module AST, irrespective of
+   * the iteration order of the `dirtyNodes` set.
+   **/
   readFunctionAst(
     functionAst_: Ast.Function,
     rawFunction: RawAst.Tree.Function,
@@ -333,6 +337,8 @@ export class GraphDb {
     dirtyNodes: Set<AstId>,
   ) {
     const functionChanged = functionAst_.id !== this.currentFunction
+    // Note: `subtrees` returns a set that has the iteration order of all `Ast.ID`s in the order they appear in the
+    // module AST. This is important to ensure that nodes are updated in the correct order.
     const knownDirtySubtrees = functionChanged ? null : subtrees(functionAst_.module, dirtyNodes)
     const subtreeDirty = (id: AstId) => !knownDirtySubtrees || knownDirtySubtrees.has(id)
     this.currentFunction = functionAst_.id

From e7a922161822c84c5554ede4ff029d97b19d0e69 Mon Sep 17 00:00:00 2001
From: Adam Obuchowicz <adam.obuchowicz@enso.org>
Date: Fri, 23 Feb 2024 13:10:45 +0100
Subject: [PATCH 04/26] Fix escaping `\` (#9155)

Fixes #9151

In one of my previous PRs I merged two `escape` implementations having exactly the same documentation. However, one of it missed escaping `\` character.

# Important Notes
One test even expected that `\` are _not_ escaped, but I doubt it should, given the above bug report?
---
 .../src/util/ast/__tests__/abstract.test.ts     | 17 -----------------
 app/gui2/src/util/ast/__tests__/text.ts         |  5 ++++-
 app/gui2/src/util/ast/text.ts                   |  5 +++--
 3 files changed, 7 insertions(+), 20 deletions(-)

diff --git a/app/gui2/src/util/ast/__tests__/abstract.test.ts b/app/gui2/src/util/ast/__tests__/abstract.test.ts
index 517e8d851aa8..72b0b44d9d5f 100644
--- a/app/gui2/src/util/ast/__tests__/abstract.test.ts
+++ b/app/gui2/src/util/ast/__tests__/abstract.test.ts
@@ -508,23 +508,6 @@ test('Construct app', () => {
   expect(namedApp.code()).toBe('func name=arg')
 })
 
-test.each([
-  ['Hello, World!', 'Hello, World!'],
-  ['Hello\t\tWorld!', 'Hello\\t\\tWorld!'],
-  ['He\nllo, W\rorld!', 'He\\nllo, W\\rorld!'],
-  ['Hello,\vWorld!', 'Hello,\\vWorld!'],
-  ['Hello, \\World!', 'Hello, \\World!'],
-  ['Hello, `World!`', 'Hello, ``World!``'],
-  ["'Hello, World!'", "\\'Hello, World!\\'"],
-  ['"Hello, World!"', '\\"Hello, World!\\"'],
-  ['Hello, \fWorld!', 'Hello, \\fWorld!'],
-  ['Hello, \bWorld!', 'Hello, \\bWorld!'],
-])('Text literals escaping and unescaping', (original, expectedEscaped) => {
-  const escaped = escape(original)
-  expect(escaped).toBe(expectedEscaped)
-  expect(unescape(escaped)).toBe(original)
-})
-
 test('Automatic parenthesis', () => {
   const block = Ast.parseBlock('main = func arg1 arg2')
   let arg1: Ast.MutableAst | undefined
diff --git a/app/gui2/src/util/ast/__tests__/text.ts b/app/gui2/src/util/ast/__tests__/text.ts
index 0a67ac6bb5f9..84211b7b176f 100644
--- a/app/gui2/src/util/ast/__tests__/text.ts
+++ b/app/gui2/src/util/ast/__tests__/text.ts
@@ -1,4 +1,5 @@
 import * as astText from '@/util/ast/text'
+import { unescape } from 'querystring'
 import { expect, test } from 'vitest'
 
 test.each([
@@ -6,5 +7,7 @@ test.each([
   { string: '\t\r\n\v"\'`', escaped: '\\t\\r\\n\\v\\"\\\'``' },
   { string: '`foo` `bar` `baz`', escaped: '``foo`` ``bar`` ``baz``' },
 ])('`escape`', ({ string, escaped }) => {
-  expect(astText.escape(string)).toBe(escaped)
+  const result = astText.escape(string)
+  expect(result).toBe(escaped)
+  expect(unescape(escaped)).toBe(string)
 })
diff --git a/app/gui2/src/util/ast/text.ts b/app/gui2/src/util/ast/text.ts
index 92ccaf65bec6..87bbce35a02c 100644
--- a/app/gui2/src/util/ast/text.ts
+++ b/app/gui2/src/util/ast/text.ts
@@ -7,6 +7,7 @@ const mapping: Record<string, string> = {
   '\r': '\\r',
   '\t': '\\t',
   '\v': '\\v',
+  '\\': '\\\\',
   '"': '\\"',
   "'": "\\'",
   '`': '``',
@@ -17,10 +18,10 @@ const reverseMapping = swapKeysAndValues(mapping)
 /** Escape a string so it can be safely spliced into an interpolated (`''`) Enso string.
  * NOT USABLE to insert into raw strings. Does not include quotes. */
 export function escape(string: string) {
-  return string.replace(/[\0\b\f\n\r\t\v"'`]/g, (match) => mapping[match]!)
+  return string.replace(/[\0\b\f\n\r\t\v\\"'`]/g, (match) => mapping[match]!)
 }
 
 /** The reverse of `escape`: transform the string into human-readable form, not suitable for interpolation. */
 export function unescape(string: string) {
-  return string.replace(/\\[0bfnrtv"']|``/g, (match) => reverseMapping[match]!)
+  return string.replace(/\\[0bfnrtv\\"']|``/g, (match) => reverseMapping[match]!)
 }

From bdebe904b329d0f60521c96dbedc7b7de07f3e70 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Fri, 23 Feb 2024 23:41:58 +1000
Subject: [PATCH 05/26] Make `alt` key keep dropdown open (#9157)

- Fix #9083

# Important Notes
None
---
 .../src/components/GraphEditor/widgets/WidgetSelection.vue  | 6 +++---
 app/gui2/src/components/widgets/DropdownWidget.vue          | 6 +++---
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue b/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
index dafa63eae389..7c60187801f0 100644
--- a/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
+++ b/app/gui2/src/components/GraphEditor/widgets/WidgetSelection.vue
@@ -124,9 +124,9 @@ function toggleDropdownWidget() {
   showDropdownWidget.value = !showDropdownWidget.value
 }
 
-function onClick(index: number) {
+function onClick(index: number, keepOpen: boolean) {
   selectedIndex.value = index
-  showDropdownWidget.value = false
+  showDropdownWidget.value = keepOpen
 }
 
 // When the selected index changes, we update the expression content.
@@ -181,7 +181,7 @@ export const widgetDefinition = defineWidget(WidgetInput.isAstOrPlaceholder, {
       :color="'var(--node-color-primary)'"
       :values="tagLabels"
       :selectedValue="selectedLabel"
-      @click="onClick($event)"
+      @click="onClick"
     />
   </div>
 </template>
diff --git a/app/gui2/src/components/widgets/DropdownWidget.vue b/app/gui2/src/components/widgets/DropdownWidget.vue
index 950504abbb93..e2be7d6b0444 100644
--- a/app/gui2/src/components/widgets/DropdownWidget.vue
+++ b/app/gui2/src/components/widgets/DropdownWidget.vue
@@ -10,7 +10,7 @@ enum SortDirection {
 }
 
 const props = defineProps<{ color: string; selectedValue: string | undefined; values: string[] }>()
-const emit = defineEmits<{ click: [index: number] }>()
+const emit = defineEmits<{ click: [index: number, keepOpen: boolean] }>()
 
 const sortDirection = ref<SortDirection>(SortDirection.none)
 
@@ -51,11 +51,11 @@ const NEXT_SORT_DIRECTION: Record<SortDirection, SortDirection> = {
     <ul class="list" :style="{ background: color }" @wheel.stop>
       <template v-for="[value, index] in sortedValuesAndIndices" :key="value">
         <li v-if="value === selectedValue">
-          <div class="selected-item button" @click.stop="emit('click', index)">
+          <div class="selected-item button" @click.stop="emit('click', index, $event.altKey)">
             <span v-text="value"></span>
           </div>
         </li>
-        <li v-else class="selectable-item button" @click.stop="emit('click', index)">
+        <li v-else class="selectable-item button" @click.stop="emit('click', index, $event.altKey)">
           <span v-text="value"></span>
         </li>
       </template>

From d650798898f2c3c6d3c528b98af9b2da23434b18 Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Fri, 23 Feb 2024 05:47:11 -0800
Subject: [PATCH 06/26] Display alias when searching by alias (#9148)

* Display alias when searching by alias

* Fix tests
---
 app/gui2/src/components/ComponentBrowser.vue  | 10 ++----
 .../__tests__/component.test.ts               | 31 ++++---------------
 .../components/ComponentBrowser/component.ts  | 20 ++++++++++--
 3 files changed, 25 insertions(+), 36 deletions(-)

diff --git a/app/gui2/src/components/ComponentBrowser.vue b/app/gui2/src/components/ComponentBrowser.vue
index 6e2f4ef4aa20..60c3668d368f 100644
--- a/app/gui2/src/components/ComponentBrowser.vue
+++ b/app/gui2/src/components/ComponentBrowser.vue
@@ -419,10 +419,7 @@ const handler = componentBrowserBindings.handler({
                   :style="{ color: componentColor(item.component) }"
                 />
                 <span>
-                  <span
-                    v-if="!item.component.matchedRanges || item.component.matchedAlias"
-                    v-text="item.component.label"
-                  ></span>
+                  <span v-if="!item.component.matchedRanges" v-text="item.component.label"></span>
                   <span
                     v-for="range in allRanges(
                       item.component.matchedRanges,
@@ -450,10 +447,7 @@ const handler = componentBrowserBindings.handler({
               >
                 <SvgIcon :name="item.component.icon" />
                 <span>
-                  <span
-                    v-if="!item.component.matchedRanges || item.component.matchedAlias"
-                    v-text="item.component.label"
-                  ></span>
+                  <span v-if="!item.component.matchedRanges" v-text="item.component.label"></span>
                   <span
                     v-for="range in allRanges(
                       item.component.matchedRanges,
diff --git a/app/gui2/src/components/ComponentBrowser/__tests__/component.test.ts b/app/gui2/src/components/ComponentBrowser/__tests__/component.test.ts
index b393b946e721..4dc58a2d7d10 100644
--- a/app/gui2/src/components/ComponentBrowser/__tests__/component.test.ts
+++ b/app/gui2/src/components/ComponentBrowser/__tests__/component.test.ts
@@ -89,7 +89,7 @@ test('Suggestions are ordered properly', () => {
 
 test('Matched ranges are correct', () => {
   function replaceMatches(component: Component) {
-    if (!component.matchedRanges || component.matchedAlias) return component.label
+    if (!component.matchedRanges) return component.label
     const parts: string[] = []
     for (const range of allRanges(component.matchedRanges, component.label.length)) {
       const text = component.label.slice(range.start, range.end)
@@ -98,16 +98,6 @@ test('Matched ranges are correct', () => {
     return parts.join('')
   }
 
-  function replaceAliasMatches(component: Component) {
-    if (!component.matchedRanges || !component.matchedAlias) return
-    const parts: string[] = []
-    for (const range of allRanges(component.matchedRanges, component.matchedAlias.length)) {
-      const text = component.matchedAlias.slice(range.start, range.end)
-      parts.push(range.isMatch ? `<${text}>` : text)
-    }
-    return parts.join('')
-  }
-
   const pattern = 'foo_bar'
   const filtering = new Filtering({ pattern })
   const matchedSorted = [
@@ -117,34 +107,29 @@ test('Matched ranges are correct', () => {
     {
       name: 'bar',
       aliases: ['foo_bar', 'foo'],
-      highlighted: 'Project.bar',
-      highlightedAlias: '<foo><_bar>',
+      highlighted: '<foo><_bar> (Project.bar)',
     }, // exact alias match
     {
       name: 'bar',
       aliases: ['foo', 'foo_xyz_barabc'],
-      highlighted: 'Project.bar',
-      highlightedAlias: '<foo>_xyz<_bar>abc',
+      highlighted: '<foo>_xyz<_bar>abc (Project.bar)',
     }, // alias first word exact match
     {
       name: 'bar',
       aliases: ['foo', 'fooabc_barabc'],
-      highlighted: 'Project.bar',
-      highlightedAlias: '<foo>abc<_bar>abc',
+      highlighted: '<foo>abc<_bar>abc (Project.bar)',
     }, // alias first word match
     { name: 'xyz_foo_abc_bar_xyz', highlighted: 'Project.xyz_<foo>_abc<_bar>_xyz' }, // exact word match
     { name: 'xyz_fooabc_abc_barabc_xyz', highlighted: 'Project.xyz_<foo>abc_abc<_bar>abc_xyz' }, // non-exact word match
     {
       name: 'bar',
       aliases: ['xyz_foo_abc_bar_xyz'],
-      highlighted: 'Project.bar',
-      highlightedAlias: 'xyz_<foo>_abc<_bar>_xyz',
+      highlighted: 'xyz_<foo>_abc<_bar>_xyz (Project.bar)',
     }, // alias word exact match
     {
       name: 'bar',
       aliases: ['xyz_fooabc_abc_barabc_xyz'],
-      highlighted: 'Project.bar',
-      highlightedAlias: 'xyz_<foo>abc_abc<_bar>abc_xyz',
+      highlighted: 'xyz_<foo>abc_abc<_bar>abc_xyz (Project.bar)',
     }, // alias word start match
   ]
   const entries = Array.from(matchedSorted, ({ name, aliases }, id) => {
@@ -159,9 +144,5 @@ test('Matched ranges are correct', () => {
       replaceMatches(makeComponent(entries[i]!, filtering)),
       `replaceMatches(${JSON.stringify(matchedSorted[i])})`,
     ).toEqual(matchedSorted[i]!.highlighted)
-    expect(
-      replaceAliasMatches(makeComponent(entries[i]!, filtering)),
-      `replaceAliasMatches(${JSON.stringify(matchedSorted[i])})`,
-    ).toEqual(matchedSorted[i]!.highlightedAlias)
   }
 })
diff --git a/app/gui2/src/components/ComponentBrowser/component.ts b/app/gui2/src/components/ComponentBrowser/component.ts
index 9c5d68d63b1d..ed3a113625fe 100644
--- a/app/gui2/src/components/ComponentBrowser/component.ts
+++ b/app/gui2/src/components/ComponentBrowser/component.ts
@@ -12,12 +12,17 @@ import { displayedIconOf } from '@/util/getIconName'
 import type { Icon } from '@/util/iconName'
 import { qnIsTopElement, qnLastSegmentIndex } from '@/util/qualifiedName'
 
-interface ComponentLabel {
+interface ComponentLabelInfo {
   label: string
   matchedAlias?: string | undefined
   matchedRanges?: Range[] | undefined
 }
 
+interface ComponentLabel {
+  label: string
+  matchedRanges?: Range[] | undefined
+}
+
 export interface Component extends ComponentLabel {
   suggestionId: SuggestionId
   icon: Icon
@@ -28,7 +33,7 @@ export function labelOfEntry(
   entry: SuggestionEntry,
   filtering: Filtering,
   match: MatchResult,
-): ComponentLabel {
+): ComponentLabelInfo {
   const isTopModule = entry.kind == SuggestionKind.Module && qnIsTopElement(entry.definedIn)
   if (filtering.isMainView() && isTopModule) return { label: entry.definedIn }
   else if (entry.memberOf && entry.selfType == null) {
@@ -69,6 +74,15 @@ export function labelOfEntry(
       : { label: entry.name, matchedAlias: match.matchedAlias }
 }
 
+function formatLabel(labelInfo: ComponentLabelInfo): ComponentLabel {
+  return {
+    label: labelInfo.matchedAlias
+      ? `${labelInfo.matchedAlias} (${labelInfo.label})`
+      : labelInfo.label,
+    matchedRanges: labelInfo.matchedRanges,
+  }
+}
+
 export interface MatchedSuggestion {
   id: SuggestionId
   entry: SuggestionEntry
@@ -99,7 +113,7 @@ export function makeComponent(
   filtering: Filtering,
 ): Component {
   return {
-    ...labelOfEntry(entry, filtering, match),
+    ...formatLabel(labelOfEntry(entry, filtering, match)),
     suggestionId: id,
     icon: displayedIconOf(entry),
     group: entry.groupIndex,

From 990ba2fc64c7b24d2fa93f5ddc1efda61ba66870 Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Fri, 23 Feb 2024 05:47:57 -0800
Subject: [PATCH 07/26] Fix flickering when resizing visualization (#9147)

---
 app/gui2/src/components/GraphEditor/GraphNode.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/gui2/src/components/GraphEditor/GraphNode.vue b/app/gui2/src/components/GraphEditor/GraphNode.vue
index 356718b4977a..28ce54f15643 100644
--- a/app/gui2/src/components/GraphEditor/GraphNode.vue
+++ b/app/gui2/src/components/GraphEditor/GraphNode.vue
@@ -578,7 +578,7 @@ function openFullMenu() {
   caret-shape: bar;
   height: var(--node-height);
   border-radius: var(--node-border-radius);
-  display: flex;
+  display: inline-flex;
   flex-direction: row;
   align-items: center;
   white-space: nowrap;

From bc99941736fb58ddc9d2f0fc5c138231aafd22cc Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Fri, 23 Feb 2024 05:48:33 -0800
Subject: [PATCH 08/26] Move project name (#9132)

Closes #8672.

Before:
![image](https://github.com/enso-org/enso/assets/1047859/9d95178f-24c1-4e82-bf90-a37c3d1ca450)

After:
![image](https://github.com/enso-org/enso/assets/1047859/84e6dae9-e309-46c5-9be8-6b82dcb9ddc4)

# Important Notes
- The execution context controls are no longer aligned nicely, but we are about to make major changes to their display anyway: #8673
---
 app/gui2/e2e/collapsingAndEntering.spec.ts | 10 +++---
 app/gui2/src/components/GraphEditor.vue    |  1 -
 app/gui2/src/components/ProjectTitle.vue   | 40 ----------------------
 app/gui2/src/components/TopBar.vue         | 10 +++---
 app/gui2/src/composables/stackNavigator.ts | 17 ++++++---
 app/gui2/src/stores/project/index.ts       | 11 ++++--
 6 files changed, 30 insertions(+), 59 deletions(-)
 delete mode 100644 app/gui2/src/components/ProjectTitle.vue

diff --git a/app/gui2/e2e/collapsingAndEntering.spec.ts b/app/gui2/e2e/collapsingAndEntering.spec.ts
index aba9ac26e297..052cd3e1d5a0 100644
--- a/app/gui2/e2e/collapsingAndEntering.spec.ts
+++ b/app/gui2/e2e/collapsingAndEntering.spec.ts
@@ -11,16 +11,16 @@ test('Entering nodes', async ({ page }) => {
   await actions.goToGraph(page)
   await mockCollapsedFunctionInfo(page, 'final', 'func1')
   await expectInsideMain(page)
-  await expect(locate.navBreadcrumb(page)).toHaveText(['main'])
+  await expect(locate.navBreadcrumb(page)).toHaveText(['Mock Project'])
 
   await locate.graphNodeByBinding(page, 'final').dblclick()
   await mockCollapsedFunctionInfo(page, 'f2', 'func2')
   await expectInsideFunc1(page)
-  await expect(locate.navBreadcrumb(page)).toHaveText(['main', 'func1'])
+  await expect(locate.navBreadcrumb(page)).toHaveText(['Mock Project', 'func1'])
 
   await locate.graphNodeByBinding(page, 'f2').dblclick()
   await expectInsideFunc2(page)
-  await expect(locate.navBreadcrumb(page)).toHaveText(['main', 'func1', 'func2'])
+  await expect(locate.navBreadcrumb(page)).toHaveText(['Mock Project', 'func1', 'func2'])
 })
 
 test('Leaving entered nodes', async ({ page }) => {
@@ -42,7 +42,7 @@ test('Using breadcrumbs to navigate', async ({ page }) => {
   await page.mouse.dblclick(100, 100)
   await expectInsideMain(page)
   // Breadcrumbs still have all the crumbs, but the last two are dimmed.
-  await expect(locate.navBreadcrumb(page)).toHaveText(['main', 'func1', 'func2'])
+  await expect(locate.navBreadcrumb(page)).toHaveText(['Mock Project', 'func1', 'func2'])
   await expect(locate.navBreadcrumb(page, (f) => f.class('inactive'))).toHaveText([
     'func1',
     'func2',
@@ -51,7 +51,7 @@ test('Using breadcrumbs to navigate', async ({ page }) => {
   await locate.navBreadcrumb(page).filter({ hasText: 'func2' }).click()
   await expectInsideFunc2(page)
 
-  await locate.navBreadcrumb(page).filter({ hasText: 'main' }).click()
+  await locate.navBreadcrumb(page).filter({ hasText: 'Mock Project' }).click()
   await expectInsideMain(page)
 
   await locate.navBreadcrumb(page).filter({ hasText: 'func1' }).click()
diff --git a/app/gui2/src/components/GraphEditor.vue b/app/gui2/src/components/GraphEditor.vue
index 1496e43e5af9..3e0b86815258 100644
--- a/app/gui2/src/components/GraphEditor.vue
+++ b/app/gui2/src/components/GraphEditor.vue
@@ -658,7 +658,6 @@ function handleEdgeDrop(source: AstId, position: Vec2) {
     />
     <TopBar
       v-model:mode="projectStore.executionMode"
-      :title="projectStore.displayName"
       :modes="EXECUTION_MODES"
       :breadcrumbs="stackNavigator.breadcrumbLabels.value"
       :allowNavigationLeft="stackNavigator.allowNavigationLeft.value"
diff --git a/app/gui2/src/components/ProjectTitle.vue b/app/gui2/src/components/ProjectTitle.vue
deleted file mode 100644
index 4f0c8bb9a55a..000000000000
--- a/app/gui2/src/components/ProjectTitle.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<script setup lang="ts">
-import ExecutionModeSelector from '@/components/ExecutionModeSelector.vue'
-
-const props = defineProps<{ title: string; modes: string[]; mode: string }>()
-const emit = defineEmits<{ execute: []; 'update:mode': [mode: string] }>()
-</script>
-
-<template>
-  <div class="ProjectTitle" @pointerdown.stop @pointerup.stop @click.stop>
-    <span class="title" v-text="props.title"></span>
-    <ExecutionModeSelector
-      :modes="props.modes"
-      :modelValue="props.mode"
-      @execute="emit('execute')"
-      @update:modelValue="emit('update:mode', $event)"
-    />
-  </div>
-</template>
-
-<style scoped>
-.ProjectTitle {
-  user-select: none;
-  display: flex;
-  align-items: center;
-  background: var(--color-frame-bg);
-  border-radius: var(--radius-full);
-  backdrop-filter: var(--blur-app-bg);
-  gap: 8px;
-  padding-left: 10px;
-  padding-right: 4px;
-  padding-top: 4px;
-  padding-bottom: 4px;
-
-  > .title {
-    display: inline-block;
-    height: 24px;
-    padding: 1px 0px;
-  }
-}
-</style>
diff --git a/app/gui2/src/components/TopBar.vue b/app/gui2/src/components/TopBar.vue
index 64583e29872e..70ae9973a696 100644
--- a/app/gui2/src/components/TopBar.vue
+++ b/app/gui2/src/components/TopBar.vue
@@ -1,13 +1,12 @@
 <script setup lang="ts">
+import ExecutionModeSelector from '@/components/ExecutionModeSelector.vue'
 import ExtendedMenu from '@/components/ExtendedMenu.vue'
 import NavBar from '@/components/NavBar.vue'
 import type { BreadcrumbItem } from '@/components/NavBreadcrumbs.vue'
-import ProjectTitle from '@/components/ProjectTitle.vue'
 import { injectGuiConfig } from '@/providers/guiConfig'
 import { computed } from 'vue'
 
 const props = defineProps<{
-  title: string
   breadcrumbs: BreadcrumbItem[]
   modes: string[]
   mode: string
@@ -40,11 +39,10 @@ const barStyle = computed(() => {
 
 <template>
   <div class="TopBar" :style="barStyle">
-    <ProjectTitle
-      :title="props.title"
+    <ExecutionModeSelector
       :modes="props.modes"
-      :mode="props.mode"
-      @update:mode="emit('update:mode', $event)"
+      :modelValue="props.mode"
+      @update:modelValue="emit('update:mode', $event)"
       @execute="emit('execute')"
     />
     <NavBar
diff --git a/app/gui2/src/composables/stackNavigator.ts b/app/gui2/src/composables/stackNavigator.ts
index dcfb306e4d5d..0c589f600f01 100644
--- a/app/gui2/src/composables/stackNavigator.ts
+++ b/app/gui2/src/composables/stackNavigator.ts
@@ -3,7 +3,7 @@ import { useGraphStore } from '@/stores/graph'
 import { useProjectStore } from '@/stores/project'
 import type { AstId } from '@/util/ast/abstract.ts'
 import { qnLastSegment, tryQualifiedName } from '@/util/qualifiedName'
-import type { StackItem } from 'shared/languageServerTypes.ts'
+import { methodPointerEquals, type StackItem } from 'shared/languageServerTypes'
 import { computed, onMounted, ref } from 'vue'
 
 export function useStackNavigator() {
@@ -15,7 +15,7 @@ export function useStackNavigator() {
   const breadcrumbLabels = computed(() => {
     const activeStackLength = projectStore.executionContext.desiredStack.length
     return breadcrumbs.value.map((item, index) => {
-      const label = stackItemToLabel(item)
+      const label = stackItemToLabel(item, index === 0)
       const isActive = index < activeStackLength
       return { label, active: isActive } satisfies BreadcrumbItem
     })
@@ -29,8 +29,17 @@ export function useStackNavigator() {
     return projectStore.executionContext.desiredStack.length < breadcrumbs.value.length
   })
 
-  function stackItemToLabel(item: StackItem): string {
-    return graphStore.db.stackItemToMethodName(item) ?? 'unknown'
+  function isProjectEntryPoint(item: StackItem) {
+    return (
+      item.type === 'ExplicitCall' &&
+      methodPointerEquals(item.methodPointer, projectStore.entryPoint)
+    )
+  }
+
+  function stackItemToLabel(item: StackItem, isStackRoot: boolean): string {
+    if (isStackRoot && isProjectEntryPoint(item)) return projectStore.displayName
+    const methodName = graphStore.db.stackItemToMethodName(item)
+    return methodName ?? 'unknown'
   }
 
   function handleBreadcrumbClick(index: number) {
diff --git a/app/gui2/src/stores/project/index.ts b/app/gui2/src/stores/project/index.ts
index 32a6fa91830c..7c8cfca24488 100644
--- a/app/gui2/src/stores/project/index.ts
+++ b/app/gui2/src/stores/project/index.ts
@@ -32,6 +32,7 @@ import type {
   ExplicitCall,
   ExpressionId,
   ExpressionUpdate,
+  MethodPointer,
   StackItem,
   VisualizationConfiguration,
 } from 'shared/languageServerTypes'
@@ -548,12 +549,15 @@ export const useProjectStore = defineStore('project', () => {
     return mod
   })
 
-  function createExecutionContextForMain(): ExecutionContext {
+  const entryPoint = computed<MethodPointer>(() => {
     const projectName = fullName.value
     const mainModule = `${projectName}.Main`
-    const entryPoint = { module: mainModule, definedOnType: mainModule, name: 'main' }
+    return { module: mainModule, definedOnType: mainModule, name: 'main' }
+  })
+
+  function createExecutionContextForMain(): ExecutionContext {
     return new ExecutionContext(lsRpcConnection, {
-      methodPointer: entryPoint,
+      methodPointer: entryPoint.value,
       positionalArgumentsExpressions: [],
     })
   }
@@ -693,6 +697,7 @@ export const useProjectStore = defineStore('project', () => {
     diagnostics,
     module,
     modulePath,
+    entryPoint,
     projectModel,
     contentRoots,
     awareness: markRaw(awareness),

From 8c286da21b7e0b97c27c97306a4142e3255e7148 Mon Sep 17 00:00:00 2001
From: Adam Obuchowicz <adam.obuchowicz@enso.org>
Date: Fri, 23 Feb 2024 15:54:34 +0100
Subject: [PATCH 09/26] Proper fix for editing node (#9153)

The replacement for https://github.com/enso-org/enso/pull/9144

We try to match bindings using "buttons" field, but it in fact does not contain the just-released buttons.

# Important Notes
I added tests for editing node. Also, I decided that the cursor position should be at the end of line when starting editing by clicking at "edit" icon.
---
 app/gui2/e2e/componentBrowser.spec.ts         | 33 +++++++++++++++++++
 app/gui2/e2e/locate.ts                        | 21 +++++++++---
 app/gui2/src/components/CircularMenu.vue      |  7 +++-
 .../src/components/GraphEditor/GraphNode.vue  |  4 +--
 app/gui2/src/util/shortcuts.ts                | 29 ++++++++++++----
 5 files changed, 81 insertions(+), 13 deletions(-)

diff --git a/app/gui2/e2e/componentBrowser.spec.ts b/app/gui2/e2e/componentBrowser.spec.ts
index ccebe783e672..ae7093605599 100644
--- a/app/gui2/e2e/componentBrowser.spec.ts
+++ b/app/gui2/e2e/componentBrowser.spec.ts
@@ -148,3 +148,36 @@ test('Filtering list', async ({ page }) => {
   const highlighted = locate.componentBrowserEntry(page).locator('.component-label-segment.match')
   await expect(highlighted).toHaveText(['re', '_te'])
 })
+
+test('Editing existing nodes', async ({ page }) => {
+  await actions.goToGraph(page)
+  const node = locate.graphNodeByBinding(page, 'data')
+  const ADDED_PATH = '"/home/enso/Input.txt"'
+
+  // Start node editing
+  await locate.graphNodeIcon(node).click({ modifiers: ['Control'] })
+  await expect(locate.componentBrowser(page)).toBeVisible()
+  const input = locate.componentBrowserInput(page).locator('input')
+  await expect(input).toHaveValue('Data.read')
+
+  // Add argument and accept
+  await page.keyboard.press('End')
+  await input.pressSequentially(` ${ADDED_PATH}`)
+  await expect(input).toHaveValue(`Data.read ${ADDED_PATH}`)
+  await page.keyboard.press('Enter')
+  await expect(locate.componentBrowser(page)).not.toBeVisible()
+  await expect(node.locator('.WidgetToken')).toHaveText(['Data', '.', 'read'])
+  await expect(node.locator('.WidgetText input')).toHaveValue(ADDED_PATH)
+
+  // Edit again, using "edit" button
+  await locate.graphNodeIcon(node).click()
+  await node.getByTestId('edit-button').click()
+  await expect(locate.componentBrowser(page)).toBeVisible()
+  await expect(input).toHaveValue(`Data.read ${ADDED_PATH}`)
+  for (let i = 0; i < ADDED_PATH.length; ++i) await page.keyboard.press('Backspace')
+  await expect(input).toHaveValue('Data.read ')
+  await page.keyboard.press('Enter')
+  await expect(locate.componentBrowser(page)).not.toBeVisible()
+  await expect(node.locator('.WidgetToken')).toHaveText(['Data', '.', 'read'])
+  await expect(node.locator('.WidgetText')).not.toBeVisible()
+})
diff --git a/app/gui2/e2e/locate.ts b/app/gui2/e2e/locate.ts
index 190c0303e8c6..1dee7549ab66 100644
--- a/app/gui2/e2e/locate.ts
+++ b/app/gui2/e2e/locate.ts
@@ -113,6 +113,23 @@ export function exitFullscreenButton(page: Locator | Page) {
 
 export const toggleFullscreenButton = or(enterFullscreenButton, exitFullscreenButton)
 
+// === Nodes ===
+
+declare const nodeLocatorBrand: unique symbol
+type Node = Locator & { [nodeLocatorBrand]: never }
+
+export function graphNode(page: Page | Locator): Node {
+  return page.locator('.GraphNode') as Node
+}
+export function graphNodeByBinding(page: Locator | Page, binding: string): Node {
+  return graphNode(page).filter({
+    has: page.locator('.binding').and(page.getByText(binding)),
+  }) as Node
+}
+export function graphNodeIcon(node: Node) {
+  return node.locator('.icon')
+}
+
 // === Data locators ===
 
 type SanitizeClassName<T extends string> = T extends `${infer A}.${infer B}`
@@ -128,10 +145,6 @@ function componentLocator<T extends string>(className: SanitizeClassName<T>) {
 }
 
 export const graphEditor = componentLocator('GraphEditor')
-export const graphNode = componentLocator('GraphNode')
-export function graphNodeByBinding(page: Locator | Page, binding: string) {
-  return graphNode(page).filter({ has: page.locator('.binding').and(page.getByText(binding)) })
-}
 // @ts-expect-error
 export const anyVisualization = componentLocator('GraphVisualization > *')
 export const circularMenu = componentLocator('CircularMenu')
diff --git a/app/gui2/src/components/CircularMenu.vue b/app/gui2/src/components/CircularMenu.vue
index b5dcb5f9124a..b34d3ae9d781 100644
--- a/app/gui2/src/components/CircularMenu.vue
+++ b/app/gui2/src/components/CircularMenu.vue
@@ -31,7 +31,12 @@ const emit = defineEmits<{
       :modelValue="props.isVisualizationVisible"
       @update:modelValue="emit('update:isVisualizationVisible', $event)"
     />
-    <SvgIcon name="edit" class="icon-container button slot6" @click.stop="emit('startEditing')" />
+    <SvgIcon
+      name="edit"
+      class="icon-container button slot6"
+      data-testid="edit-button"
+      @click.stop="emit('startEditing')"
+    />
     <ToggleIcon
       :icon="props.isOutputContextEnabledGlobally ? 'no_auto_replay' : 'auto_replay'"
       class="icon-container button slot7"
diff --git a/app/gui2/src/components/GraphEditor/GraphNode.vue b/app/gui2/src/components/GraphEditor/GraphNode.vue
index 28ce54f15643..cfb7bc847940 100644
--- a/app/gui2/src/components/GraphEditor/GraphNode.vue
+++ b/app/gui2/src/components/GraphEditor/GraphNode.vue
@@ -172,7 +172,7 @@ const dragPointer = usePointer((pos, event, type) => {
         startEvent != null &&
         pos.absolute.distanceSquared(startPos) <= MAXIMUM_CLICK_DISTANCE_SQ
       ) {
-        nodeSelection?.handleSelectionOf(startEvent, new Set([nodeId.value]))
+        nodeSelection?.handleSelectionOf(event, new Set([nodeId.value]))
         handleNodeClick(event)
         menuVisible.value = MenuState.Partial
       }
@@ -256,7 +256,7 @@ const nodeEditHandler = nodeEditBindings.handler({
 })
 
 function startEditingNode(position: Vec2 | undefined) {
-  let sourceOffset = 0
+  let sourceOffset = props.node.rootSpan.code().length
   if (position != null) {
     let domNode, domOffset
     if ((document as any).caretPositionFromPoint) {
diff --git a/app/gui2/src/util/shortcuts.ts b/app/gui2/src/util/shortcuts.ts
index 393835625eb2..198f72a651f0 100644
--- a/app/gui2/src/util/shortcuts.ts
+++ b/app/gui2/src/util/shortcuts.ts
@@ -47,7 +47,7 @@ function modifierFlagsForEvent(event: EventWithModifiers): ModifierFlags {
     (event.metaKey ? RAW_MODIFIER_FLAG.Meta : 0)) as ModifierFlags
 }
 
-/** These values MUST match the flags on `MouseEvent#button`.
+/** These values MUST match the flags on `MouseEvent#buttons`.
  * See https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons */
 const POINTER_BUTTON_FLAG = {
   PointerMain: 1 << 0,
@@ -57,6 +57,27 @@ const POINTER_BUTTON_FLAG = {
   PointerForward: 1 << 4,
 } satisfies Record<Pointer, number> as Record<Pointer, PointerButtonFlags>
 
+/**
+ * Mapping from the MouseEvent's `button` field to PointerButtonFlags.
+ *
+ * No, it is not as simple as (1 << event.button) as PointerButtonFlags; compare
+ * https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons with
+ * https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/button
+ */
+const flagsOfButtonField = [
+  POINTER_BUTTON_FLAG.PointerMain,
+  POINTER_BUTTON_FLAG.PointerAux,
+  POINTER_BUTTON_FLAG.PointerSecondary,
+  POINTER_BUTTON_FLAG.PointerBack,
+  POINTER_BUTTON_FLAG.PointerForward,
+]
+
+function buttonFlagsForEvent(event: MouseEvent): PointerButtonFlags {
+  // event.buttons keeps information about buttons being pressed, but in case of `click` or
+  // `pointerup` events we also want to know what buttons were just released.
+  return (event.buttons | (flagsOfButtonField[event.button] ?? 0)) as PointerButtonFlags
+}
+
 // ==========================
 // === Autocomplete types ===
 // ==========================
@@ -333,11 +354,7 @@ export function defineKeybinds<
       const keybinds =
         event instanceof KeyboardEvent
           ? keyboardShortcuts[event.key.toLowerCase() as Key_]?.[eventModifierFlags]
-          : mouseShortcuts[
-              (event.type === 'click' // `click` events don't have 'buttons' field initialized.
-                ? POINTER_BUTTON_FLAG.PointerMain
-                : event.buttons) as PointerButtonFlags
-            ]?.[eventModifierFlags]
+          : mouseShortcuts[buttonFlagsForEvent(event)]?.[eventModifierFlags]
       let handle = handlers[DefaultHandler]
       if (keybinds != null) {
         for (const bindingName in handlers) {

From 9c872c653e2882b999a773fb8b9940655173ec6c Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Fri, 23 Feb 2024 07:48:10 -0800
Subject: [PATCH 10/26] Checkbox shows argument name if not already shown
 (#9146)

Fixes #9002. This is not a great solution; doing this properly would require some refactoring of widget selection. Proposal:  #9145.
---
 .../src/components/ComponentBrowser/input.ts  |  2 +-
 .../widgets/WidgetArgumentName.vue            |  9 +++-
 .../GraphEditor/widgets/WidgetCheckbox.vue    | 48 ++++++++++++++-----
 3 files changed, 45 insertions(+), 14 deletions(-)

diff --git a/app/gui2/src/components/ComponentBrowser/input.ts b/app/gui2/src/components/ComponentBrowser/input.ts
index 20bfa1e2ee27..5996d0dc6ec2 100644
--- a/app/gui2/src/components/ComponentBrowser/input.ts
+++ b/app/gui2/src/components/ComponentBrowser/input.ts
@@ -23,7 +23,7 @@ import {
 } from '@/util/qualifiedName'
 import { equalFlat } from 'lib0/array'
 import { sourceRangeKey, type SourceRange } from 'shared/yjsModel'
-import { computed, nextTick, ref, watch, type ComputedRef } from 'vue'
+import { computed, nextTick, ref, type ComputedRef } from 'vue'
 
 /** Information how the component browser is used, needed for proper input initializing. */
 export type Usage =
diff --git a/app/gui2/src/components/GraphEditor/widgets/WidgetArgumentName.vue b/app/gui2/src/components/GraphEditor/widgets/WidgetArgumentName.vue
index 86170bee1412..d9c4146dcff2 100644
--- a/app/gui2/src/components/GraphEditor/widgets/WidgetArgumentName.vue
+++ b/app/gui2/src/components/GraphEditor/widgets/WidgetArgumentName.vue
@@ -21,6 +21,11 @@ const showArgumentValue = computed(() => {
 
 const placeholder = computed(() => props.input instanceof ArgumentPlaceholder)
 const primary = computed(() => props.nesting < 2)
+
+const innerInput = computed(() => ({
+  ...props.input,
+  [ArgumentNameShownKey]: true,
+}))
 </script>
 
 <script lang="ts">
@@ -40,13 +45,15 @@ export const widgetDefinition = defineWidget(hasKnownArgumentName, {
     return isPlaceholder || isTopArg ? Score.Perfect : Score.Mismatch
   },
 })
+
+export const ArgumentNameShownKey: unique symbol = Symbol('ArgumentNameShownKey')
 </script>
 
 <template>
   <div class="WidgetArgumentName" :class="{ placeholder, primary }">
     <template v-if="showArgumentValue">
       <span class="name">{{ props.input[ArgumentInfoKey].info.name }}</span
-      ><NodeWidget :input="props.input" allowEmpty />
+      ><NodeWidget :input="innerInput" allowEmpty />
     </template>
     <template v-else>{{ props.input[ArgumentInfoKey].info.name }}</template>
   </div>
diff --git a/app/gui2/src/components/GraphEditor/widgets/WidgetCheckbox.vue b/app/gui2/src/components/GraphEditor/widgets/WidgetCheckbox.vue
index 91eb9e079a71..9f9ba8126af4 100644
--- a/app/gui2/src/components/GraphEditor/widgets/WidgetCheckbox.vue
+++ b/app/gui2/src/components/GraphEditor/widgets/WidgetCheckbox.vue
@@ -1,14 +1,16 @@
 <script setup lang="ts">
+import { ArgumentNameShownKey } from '@/components/GraphEditor/widgets/WidgetArgumentName.vue'
 import CheckboxWidget from '@/components/widgets/CheckboxWidget.vue'
 import { Score, WidgetInput, defineWidget, widgetProps } from '@/providers/widgetRegistry'
 import { useGraphStore } from '@/stores/graph'
 import { requiredImportsByFQN } from '@/stores/graph/imports'
-import { SuggestionDb, useSuggestionDbStore } from '@/stores/suggestionDatabase'
+import { useSuggestionDbStore } from '@/stores/suggestionDatabase'
 import { assert } from '@/util/assert'
 import { Ast } from '@/util/ast'
-import type { TokenId } from '@/util/ast/abstract.ts'
+import type { TokenId } from '@/util/ast/abstract'
+import { ArgumentInfoKey } from '@/util/callTree'
 import { asNot } from '@/util/data/types.ts'
-import { type Identifier, type QualifiedName } from '@/util/qualifiedName.ts'
+import { type Identifier, type QualifiedName } from '@/util/qualifiedName'
 import { computed } from 'vue'
 
 const props = defineProps(widgetProps(widgetDefinition))
@@ -55,6 +57,12 @@ const value = computed({
     }
   },
 })
+
+const primary = computed(() => props.nesting < 2)
+const argumentName = computed(() => {
+  if (ArgumentNameShownKey in props.input) return
+  return props.input[ArgumentInfoKey]?.info?.name
+})
 </script>
 
 <script lang="ts">
@@ -90,13 +98,29 @@ export const widgetDefinition = defineWidget(WidgetInput.isAstOrPlaceholder, {
 </script>
 
 <template>
-  <!-- See comment in GraphNode next to dragPointer definition about stopping pointerdown and pointerup -->
-  <CheckboxWidget
-    v-model="value"
-    class="WidgetCheckbox"
-    contenteditable="false"
-    @beforeinput.stop
-    @pointerdown.stop
-    @pointerup.stop
-  />
+  <div class="CheckboxContainer" :class="{ primary }">
+    <span v-if="argumentName" class="name" v-text="argumentName" />
+    <!-- See comment in GraphNode next to dragPointer definition about stopping pointerdown and pointerup -->
+    <CheckboxWidget
+      v-model="value"
+      class="WidgetCheckbox"
+      contenteditable="false"
+      @beforeinput.stop
+      @pointerdown.stop
+      @pointerup.stop
+    />
+  </div>
 </template>
+
+<style scoped>
+.CheckboxContainer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.name {
+  color: rgb(255 255 255 / 0.5);
+  margin-right: 8px;
+}
+</style>

From 880562a503b3055bdb697d3e837de45245b7526e Mon Sep 17 00:00:00 2001
From: James Dunkerley <jdunkerley@users.noreply.github.com>
Date: Fri, 23 Feb 2024 17:25:17 +0000
Subject: [PATCH 11/26] Add comment, warning, error icons. (#9169)

Add some state icons.
![image](https://github.com/enso-org/enso/assets/4699705/ab4060f5-7814-4a0d-a0af-bb775235ff98)
---
 app/gui2/src/assets/icons.svg | 30 ++++++++++++++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/app/gui2/src/assets/icons.svg b/app/gui2/src/assets/icons.svg
index 8bbd0d7d56f9..03a7486e5ab9 100644
--- a/app/gui2/src/assets/icons.svg
+++ b/app/gui2/src/assets/icons.svg
@@ -152,6 +152,10 @@
     <path opacity="0.9" fill-rule="evenodd" clip-rule="evenodd" d="M5.5 5.5V4.5C5.5 3.94772 5.05228 3.5 4.5 3.5C3.94772 3.5 3.5 3.94772 3.5 4.5C3.5 5.05228 3.94772 5.5 4.5 5.5H5.5ZM5.5 7H4.5C3.11929 7 2 5.88071 2 4.5C2 3.11929 3.11929 2 4.5 2C5.88071 2 7 3.11929 7 4.5V5.5H9V4.5C9 3.11929 10.1193 2 11.5 2C12.8807 2 14 3.11929 14 4.5C14 5.88071 12.8807 7 11.5 7H10.5V9H11.5C12.8807 9 14 10.1193 14 11.5C14 12.8807 12.8807 14 11.5 14C10.1193 14 9 12.8807 9 11.5V10.5H7V11.5C7 12.8807 5.88071 14 4.5 14C3.11929 14 2 12.8807 2 11.5C2 10.1193 3.11929 9 4.5 9H5.5V7ZM5.5 10.5H4.5C3.94772 10.5 3.5 10.9477 3.5 11.5C3.5 12.0523 3.94772 12.5 4.5 12.5C5.05228 12.5 5.5 12.0523 5.5 11.5V10.5ZM7 9V8.5V7.5V7H7.5H8.5H9V7.5V8.5V9H8.5H7.5H7ZM10.5 10.5V11.5C10.5 12.0523 10.9477 12.5 11.5 12.5C12.0523 12.5 12.5 12.0523 12.5 11.5C12.5 10.9477 12.0523 10.5 11.5 10.5H10.5ZM10.5 5.5H11.5C12.0523 5.5 12.5 5.05228 12.5 4.5C12.5 3.94772 12.0523 3.5 11.5 3.5C10.9477 3.5 10.5 3.94772 10.5 4.5V5.5Z" fill="currentColor"></path>
   </symbol>
 
+  <symbol id="comment" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M1.33334 6C1.33334 3.79086 3.1242 2 5.33334 2H10.6667C12.8758 2 14.6667 3.79086 14.6667 6V10C14.6667 12.2091 12.8758 14 10.6667 14H2.00001C1.63182 14 1.33334 13.7015 1.33334 13.3333V6ZM6.00001 6C5.63182 6 5.33334 6.29848 5.33334 6.66667C5.33334 7.03486 5.63182 7.33333 6.00001 7.33333H10C10.3682 7.33333 10.6667 7.03486 10.6667 6.66667C10.6667 6.29848 10.3682 6 10 6H6.00001ZM6.00001 8.66667C5.63182 8.66667 5.33334 8.96514 5.33334 9.33333C5.33334 9.70152 5.63182 10 6.00001 10H8.00001C8.3682 10 8.66668 9.70152 8.66668 9.33333C8.66668 8.96514 8.3682 8.66667 8.00001 8.66667H6.00001Z" fill="currentColor"></path>
+  </symbol>
+
   <symbol id="compass" viewBox="0 0 16 16" width="16" height="16" fill="none">
     <g opacity="0.3">
       <path d="M6.32655 4.46256 2.90912 2.90918 4.46248 6.32658 5.8182 5.81818 6.32655 4.46256ZM4.46256 9.67344 2.90912 13.091 6.32663 11.5376 5.8182 10.1818 4.46256 9.67344ZM9.67339 11.5376 13.0909 13.091 11.5375 9.67343 10.1818 10.1818 9.67339 11.5376ZM11.5376 6.32659 13.0909 2.90918 9.67346 4.46257 10.1818 5.81818 11.5376 6.32659Z" fill="currentColor"></path>
@@ -248,6 +252,10 @@
     </g>
   </symbol>
 
+  <symbol id="error" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path d="M10.2167 2H5.78999C5.61666 2 5.44333 2.07333 5.32333 2.19333L2.19666 5.32C2.07666 5.44 2.00333 5.61333 2.00333 5.78667V10.2067C2.00333 10.3867 2.07666 10.5533 2.19666 10.68L5.31666 13.8C5.44333 13.9267 5.61666 14 5.78999 14H10.21C10.39 14 10.5567 13.9267 10.6833 13.8067L13.8033 10.6867C13.93 10.56 13.9967 10.3933 13.9967 10.2133V5.78667C13.9967 5.60667 13.9233 5.44 13.8033 5.31333L10.6833 2.19333C10.5633 2.07333 10.39 2 10.2167 2ZM8.00333 11.5333C7.52333 11.5333 7.13666 11.1467 7.13666 10.6667C7.13666 10.1867 7.52333 9.8 8.00333 9.8C8.48333 9.8 8.86999 10.1867 8.86999 10.6667C8.86999 11.1467 8.48333 11.5333 8.00333 11.5333ZM8.00333 8.66667C7.63666 8.66667 7.33666 8.36667 7.33666 8V5.33333C7.33666 4.96667 7.63666 4.66667 8.00333 4.66667C8.36999 4.66667 8.66999 4.96667 8.66999 5.33333V8C8.66999 8.36667 8.36999 8.66667 8.00333 8.66667Z" fill="currentColor"></path>
+  </symbol>
+
   <symbol id="exclamation" viewBox="0 0 16 16" width="16" height="16" fill="none">
     <path d="M8.5 1H7.5C6.94772 1 6.5 1.44772 6.5 2V10C6.5 10.5523 6.94772 11 7.5 11H8.5C9.05228 11 9.5 10.5523 9.5 10V2C9.5 1.44772 9.05228 1 8.5 1ZM8.5 12H7.5C6.94772 12 6.5 12.4477 6.5 13V14C6.5 14.5523 6.94772 15 7.5 15H8.5C9.05228 15 9.5 14.5523 9.5 14V13C9.5 12.4477 9.05228 12 8.5 12Z" fill="currentColor"></path>
   </symbol>
@@ -367,6 +375,24 @@
     <path fill-rule="evenodd" clip-rule="evenodd" d="M0.494585 6.61468C0.770727 7.09298 1.38232 7.25685 1.86061 6.98071L8.01169 3.42938L14.1317 6.96279C14.61 7.23893 15.2216 7.07505 15.4978 6.59676C15.7739 6.11847 15.61 5.50688 15.1317 5.23074L8.01741 1.12328L8.01455 1.11833L8.01169 1.11998L8.00887 1.11835L8.00604 1.12324L0.86061 5.24866C0.382318 5.5248 0.218442 6.13639 0.494585 6.61468Z" fill="currentColor"></path>
   </symbol>
 
+  <symbol id="icon/lock" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <g clip-path="url(#clip0_104_190)">
+      <circle cx="8" cy="4" r="3" stroke="currentColor" stroke-width="2"></circle>
+    </g>
+    <rect x="4" y="4" width="2" height="2" fill="currentColor"></rect>
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M4 6C2.89543 6 2 6.89543 2 8V13C2 14.1046 2.89543 15 4 15H12C13.1046 15 14 14.1046 14 13V8C14 6.89543 13.1046 6 12 6H4ZM8 9C7.44772 9 7 9.44772 7 10V11C7 11.5523 7.44772 12 8 12C8.55228 12 9 11.5523 9 11V10C9 9.44772 8.55228 9 8 9Z" fill="currentColor"></path>
+    <defs>
+      <clipPath id="clip0_104_190">
+        <rect width="12" height="4" fill="white" transform="translate(2)"></rect>
+      </clipPath>
+    </defs>
+  </symbol>
+
+  <symbol id="icon/skip" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path d="M2.5547 3.03647L8.75192 7.16795C9.34566 7.56377 9.34566 8.43623 8.75192 8.83205L2.5547 12.9635C1.89015 13.4066 1 12.9302 1 12.1315L1 3.86852C1 3.06982 1.89015 2.59343 2.5547 3.03647Z" fill="currentColor"></path>
+    <rect x="12" y="2" width="2" height="12" rx="1" fill="currentColor"></rect>
+  </symbol>
+
   <symbol id="image" viewBox="0 0 16 16" width="16" height="16" fill="none">
     <path fill-rule="evenodd" clip-rule="evenodd" d="M2.00002 2C1.44774 2 1.00002 2.44772 1.00002 3V13C1.00002 13.5523 1.44774 14 2.00002 14H14C14.5523 14 15 13.5523 15 13V3C15 2.44772 14.5523 2 14 2H2.00002ZM13 4H3.00002V12H13V4Z" fill="currentColor"></path>
     <path d="M10.5 8C11.3284 8 12 7.32843 12 6.5 12 5.67157 11.3284 5 10.5 5 9.67159 5 9.00002 5.67157 9.00002 6.5 9.00002 7.32843 9.67159 8 10.5 8ZM4.00002 11.0237V8.02372C6.00002 5.52371 7.00002 6.00001 8.50002 7.50004L12 11.0237H4.00002Z" fill="currentColor"></path>
@@ -893,6 +919,10 @@
     <path fill-rule="evenodd" clip-rule="evenodd" d="M8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16ZM7 7V3H9V7H13V9H9V13H7V9H3V7H7Z" fill="currentColor"></path>
   </symbol>
 
+  <symbol id="warning" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path fill-rule="evenodd" clip-rule="evenodd" d="M8 1.33334C8.23527 1.33334 8.45312 1.45735 8.57324 1.65965L14.9066 12.3263C15.0289 12.5324 15.0313 12.7882 14.9127 12.9965C14.7942 13.2047 14.573 13.3333 14.3333 13.3333H1.66667C1.42703 13.3333 1.20584 13.2047 1.08729 12.9965C0.968745 12.7882 0.971089 12.5324 1.09343 12.3263L7.42676 1.65965C7.54688 1.45735 7.76473 1.33334 8 1.33334ZM8 6.00001C8.36819 6.00001 8.66667 6.29849 8.66667 6.66668V8.00001C8.66667 8.3682 8.36819 8.66668 8 8.66668C7.63181 8.66668 7.33333 8.3682 7.33333 8.00001V6.66668C7.33333 6.29849 7.63181 6.00001 8 6.00001ZM7.16667 10C7.16667 9.53977 7.53976 9.16668 8 9.16668C8.46024 9.16668 8.83333 9.53977 8.83333 10C8.83333 10.4602 8.46024 10.8333 8 10.8333C7.53976 10.8333 7.16667 10.4602 7.16667 10Z" fill="currentColor"></path>
+  </symbol>
+
   <symbol id="workflow_play" viewBox="0 0 16 16" width="16" height="16" fill="none">
     <path opacity="0.75" d="M4.48492 3.22332L11.5227 7.12545C12.2095 7.50624 12.2095 8.49379 11.5227 8.87458L4.48491 12.7767C3.8184 13.1462 3.00001 12.6642 3.00001 11.9021L3.00001 4.09789C3.00001 3.33578 3.8184 2.85377 4.48492 3.22332Z" fill="currentColor"></path>
   </symbol>

From 6aa213757b8b79fd805772d0cd033cac27c2acbe Mon Sep 17 00:00:00 2001
From: Dmitry Bushev <bushevdv@gmail.com>
Date: Fri, 23 Feb 2024 18:19:06 +0000
Subject: [PATCH 12/26] Unexpected warning when running a standalone script
 (#9114)

close #9109

Fixes the issue when the runner displays unexpected log messages
```
> .\built-distribution\enso-engine-0.0.0-dev-windows-amd64\enso-0.0.0-dev\bin\enso --run .\test.enso
[WARN] [2024-02-20T12:04:21+01:00] [enso.org.enso.interpreter.runtime.SerializationPool] Serialization of module `test` failed: Unable to write cache data for test.`
42
```
---
 .../org/enso/interpreter/runtime/TruffleCompilerContext.java  | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/engine/runtime/src/main/java/org/enso/interpreter/runtime/TruffleCompilerContext.java b/engine/runtime/src/main/java/org/enso/interpreter/runtime/TruffleCompilerContext.java
index 3dd92ff87306..b44f17a6d20f 100644
--- a/engine/runtime/src/main/java/org/enso/interpreter/runtime/TruffleCompilerContext.java
+++ b/engine/runtime/src/main/java/org/enso/interpreter/runtime/TruffleCompilerContext.java
@@ -385,8 +385,8 @@ private Callable<Boolean> doSerializeModule(
         return saved != null;
       } catch (Throwable e) {
         logSerializationManager(
-            e instanceof IOException ? Level.WARNING : Level.SEVERE,
-            "Serialization of module `" + name + "` failed: " + e.getMessage() + "`",
+            e instanceof IOException ? Level.FINE : Level.SEVERE,
+            "Serialization of module `" + name + "` failed: " + e.getMessage(),
             e);
         throw e;
       } finally {

From 245ec7afe8b6313a03e1be3dd83340a453f8dda8 Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Fri, 23 Feb 2024 12:10:43 -0800
Subject: [PATCH 13/26] Replace execution context controls with record mode
 controls (#9133)

Closes #8673. Stacked on #9132.

Before:
![image](https://github.com/enso-org/enso/assets/1047859/1b1ca9f4-eda9-45fd-bec1-cd7e255112fa)
![image](https://github.com/enso-org/enso/assets/1047859/b8cf6de1-d75c-48d0-ac0d-9e6e0c659dd4)

After:
![image](https://github.com/enso-org/enso/assets/1047859/91d13862-96e7-4175-a61e-40aecd6d62b0)
![image](https://github.com/enso-org/enso/assets/1047859/ef20511f-00f2-4042-b4d4-97728817500b)

# Important Notes
- The model has been refactored from execution-modes (live/design) to record-mode (on/off) up to the point of the project store, where it's translated (since the backend still uses the live/design concepts).
---
 app/gui2/scripts/generateIconMetadata.js      |   4 +-
 app/gui2/src/assets/icons.svg                 |   8 +
 .../src/components/ExecutionModeSelector.vue  | 143 ------------------
 app/gui2/src/components/GraphEditor.vue       |  10 +-
 app/gui2/src/components/RecordControl.vue     |  61 ++++++++
 app/gui2/src/components/TopBar.vue            |  18 +--
 app/gui2/src/stores/project/index.ts          |  10 ++
 app/gui2/stories/TopBar.story.vue             |  13 +-
 8 files changed, 98 insertions(+), 169 deletions(-)
 delete mode 100644 app/gui2/src/components/ExecutionModeSelector.vue
 create mode 100644 app/gui2/src/components/RecordControl.vue

diff --git a/app/gui2/scripts/generateIconMetadata.js b/app/gui2/scripts/generateIconMetadata.js
index 06e5f056e679..ab755ef1c2cb 100644
--- a/app/gui2/scripts/generateIconMetadata.js
+++ b/app/gui2/scripts/generateIconMetadata.js
@@ -11,8 +11,8 @@ console.info('Writing icon name type to "./src/util/iconName.ts"...')
 await fs.writeFile(
   './src/util/iconName.ts',
   `\
-// Generated by \`scripts/generateIcons.js\`.
-// Please run \`npm run generate\` to regenerate this file whenever \`icons.svg\` is changed.
+// Generated by \`scripts/generateIconMetadata.js\`.
+// Please run \`npm run generate-metadata\` to regenerate this file whenever \`icons.svg\` is changed.
 import iconNames from '@/util/iconList.json'
 
 export type Icon =
diff --git a/app/gui2/src/assets/icons.svg b/app/gui2/src/assets/icons.svg
index 03a7486e5ab9..848cee9ef98b 100644
--- a/app/gui2/src/assets/icons.svg
+++ b/app/gui2/src/assets/icons.svg
@@ -676,6 +676,14 @@
     <path fill-rule="evenodd" clip-rule="evenodd" d="M0 8C0 6.14915 0.641755 4.35557 1.81592 2.92485C2.99008 1.49413 4.624 0.514797 6.43928 0.153715C8.25456 -0.207366 10.1389 0.0721462 11.7712 0.944627C13.4035 1.81711 14.6827 3.22857 15.391 4.93853C16.0993 6.64848 16.1928 8.55113 15.6555 10.3223C15.1183 12.0934 13.9835 13.6235 12.4446 14.6518C10.9056 15.68 9.05779 16.1429 7.21586 15.9615C5.37394 15.7801 3.65189 14.9656 2.34315 13.6569L3.76867 12.2313C4.74761 13.2103 6.0357 13.8195 7.41347 13.9552C8.79123 14.0909 10.1734 13.7447 11.3245 12.9755C12.4756 12.2064 13.3245 11.0619 13.7263 9.73706C14.1282 8.41224 14.0583 6.98907 13.5285 5.71002C12.9987 4.43097 12.0418 3.3752 10.8208 2.72258C9.59988 2.06996 8.19041 1.86089 6.83258 2.13098C5.47475 2.40107 4.25258 3.13361 3.37431 4.20379C2.49603 5.27397 2.016 6.61557 2.016 8H4L1 12L-2 8H0ZM8 4C7.44772 4 7 4.44771 7 5V8C7 8.37712 7.20876 8.70549 7.51702 8.87584L9.77767 10.181C10.256 10.4572 10.8675 10.2933 11.1437 9.815C11.4198 9.33671 11.256 8.72512 10.7777 8.44897L9 7.42264V5C9 4.44771 8.55228 4 8 4Z" fill="currentColor"></path>
   </symbol>
 
+  <symbol id="record" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path d="M8 15C11.866 15 15 11.866 15 8C15 4.13401 11.866 1 8 1C4.13401 1 1 4.13401 1 8C1 11.866 4.13401 15 8 15Z" fill="currentColor"></path>
+  </symbol>
+
+  <symbol id="record_once" viewBox="0 0 16 16" width="16" height="16" fill="none">
+    <path d="M1.33333 2H.66667C.29848 2 0 2.38376 0 2.85714V13.1429C0 13.6162.29848 14 .66667 14H1.33333C1.70152 14 2 13.6162 2 13.1429V2.85714C2 2.38376 1.70152 2 1.33333 2ZM8 13C10.7614 13 13 10.7614 13 8 13 5.23858 10.7614 3 8 3 5.23858 3 3 5.23858 3 8 3 10.7614 5.23858 13 8 13ZM15.3333 2H14.6667C14.2985 2 14 2.38376 14 2.85714V13.1429C14 13.6162 14.2985 14 14.6667 14H15.3333C15.7015 14 16 13.6162 16 13.1429V2.85714C16 2.38376 15.7015 2 15.3333 2Z" fill="currentColor"></path>
+  </symbol>
+
   <symbol id="right_side_panel" viewBox="0 0 16 16" width="16" height="16" fill="none">
     <path opacity="0.3" d="M0 3C0 1.34315 1.34315 0 3 0H8V16H3C1.34315 16 0 14.6569 0 13V3Z" fill="currentColor"></path>
     <path fill-rule="evenodd" clip-rule="evenodd" d="M13 0H9V16H13C14.6569 16 16 14.6569 16 13V3C16 1.34315 14.6569 0 13 0ZM14 4H11V5H14V4ZM14 6H11V7H14V6ZM11 8H14V9H11V8Z" fill="currentColor"></path>
diff --git a/app/gui2/src/components/ExecutionModeSelector.vue b/app/gui2/src/components/ExecutionModeSelector.vue
deleted file mode 100644
index 9573bb73adc6..000000000000
--- a/app/gui2/src/components/ExecutionModeSelector.vue
+++ /dev/null
@@ -1,143 +0,0 @@
-<script setup lang="ts">
-import SvgIcon from '@/components/SvgIcon.vue'
-import { useEvent } from '@/composables/events'
-import { ref } from 'vue'
-
-const props = defineProps<{ modes: string[]; modelValue: string }>()
-const emit = defineEmits<{ execute: []; 'update:modelValue': [mode: string] }>()
-
-const isDropdownOpen = ref(false)
-
-const executionModeSelectorNode = ref<HTMLElement>()
-
-function onDocumentClick(event: MouseEvent) {
-  if (
-    event.target instanceof Node &&
-    executionModeSelectorNode.value?.contains(event.target) === false
-  ) {
-    isDropdownOpen.value = false
-  }
-}
-
-useEvent(document, 'pointerdown', onDocumentClick)
-</script>
-
-<template>
-  <div ref="executionModeSelectorNode" class="ExecutionModeSelector">
-    <div class="execution-mode-button">
-      <div class="execution-mode button" @click.stop="isDropdownOpen = !isDropdownOpen">
-        <span v-text="props.modelValue"></span>
-      </div>
-      <div class="divider"></div>
-      <SvgIcon
-        name="workflow_play"
-        class="play button"
-        draggable="false"
-        @click.stop="
-          () => {
-            isDropdownOpen = false
-            emit('execute')
-          }
-        "
-      />
-    </div>
-    <Transition name="dropdown">
-      <div v-if="isDropdownOpen" class="execution-mode-dropdown">
-        <template v-for="otherMode in props.modes" :key="otherMode">
-          <span
-            v-if="modelValue !== otherMode"
-            class="button"
-            @click.stop="emit('update:modelValue', otherMode), (isDropdownOpen = false)"
-            v-text="otherMode"
-          ></span>
-        </template>
-      </div>
-    </Transition>
-  </div>
-</template>
-
-<style scoped>
-span {
-  display: inline-block;
-  height: 24px;
-  padding: 1px 0px;
-  vertical-align: middle;
-  overflow: clip;
-}
-
-.ExecutionModeSelector {
-  position: relative;
-  color: white;
-}
-
-.execution-mode-button {
-  display: flex;
-  align-items: center;
-  height: 24px;
-  border-radius: var(--radius-full);
-  background: #64b526;
-
-  > .execution-mode {
-    font-weight: 600;
-    padding: 0 8px;
-  }
-
-  > .divider {
-    align-self: stretch;
-    width: 1px;
-    background-color: rgba(0, 0, 0, 0.12);
-  }
-
-  > .play {
-    box-sizing: content-box;
-    padding: 0 8px;
-    color: rgba(255, 255, 255, 0.75);
-  }
-}
-
-.execution-mode-dropdown {
-  display: flex;
-  flex-flow: column;
-  position: absolute;
-  background: #64b526;
-  border-radius: 10px;
-  width: 100%;
-  top: 100%;
-  margin-top: 4px;
-  padding: 4px;
-
-  > span {
-    border-radius: 6px;
-    padding-left: 4px;
-    padding-right: 4px;
-    width: 100%;
-  }
-
-  *:hover {
-    background: var(--color-dim);
-  }
-}
-
-.dropdown-enter-active,
-.dropdown-leave-active {
-  transition: all 0.1s;
-
-  > span {
-    transition: all 0.1s;
-  }
-}
-
-.dropdown-enter-from,
-.dropdown-leave-to {
-  max-height: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-  overflow: hidden;
-
-  > span {
-    padding-top: 0;
-    padding-bottom: 0;
-    max-height: 0;
-  }
-}
-</style>
diff --git a/app/gui2/src/components/GraphEditor.vue b/app/gui2/src/components/GraphEditor.vue
index 3e0b86815258..789926de7f96 100644
--- a/app/gui2/src/components/GraphEditor.vue
+++ b/app/gui2/src/components/GraphEditor.vue
@@ -38,7 +38,6 @@ import { computed, onMounted, onScopeDispose, onUnmounted, ref, watch } from 'vu
 import { ProjectManagerEvents } from '../../../ide-desktop/lib/dashboard/src/utilities/ProjectManager'
 import { type Usage } from './ComponentBrowser/input'
 
-const EXECUTION_MODES = ['design', 'live']
 // Assumed size of a newly created node. This is used to place the component browser.
 const DEFAULT_NODE_SIZE = new Vec2(0, 24)
 const gapBetweenNodes = 48.0
@@ -334,8 +333,8 @@ const codeEditorHandler = codeEditorBindings.handler({
   },
 })
 
-/** Track play button presses. */
-function onPlayButtonPress() {
+/** Handle record-once button presses. */
+function onRecordOnceButtonPress() {
   projectStore.lsRpcConnection.then(async () => {
     const modeValue = projectStore.executionMode
     if (modeValue == undefined) {
@@ -657,8 +656,7 @@ function handleEdgeDrop(source: AstId, position: Vec2) {
       @canceled="onComponentBrowserCancel"
     />
     <TopBar
-      v-model:mode="projectStore.executionMode"
-      :modes="EXECUTION_MODES"
+      v-model:recordMode="projectStore.recordMode"
       :breadcrumbs="stackNavigator.breadcrumbLabels.value"
       :allowNavigationLeft="stackNavigator.allowNavigationLeft.value"
       :allowNavigationRight="stackNavigator.allowNavigationRight.value"
@@ -666,7 +664,7 @@ function handleEdgeDrop(source: AstId, position: Vec2) {
       @breadcrumbClick="stackNavigator.handleBreadcrumbClick"
       @back="stackNavigator.exitNode"
       @forward="stackNavigator.enterNextNodeFromHistory"
-      @execute="onPlayButtonPress()"
+      @recordOnce="onRecordOnceButtonPress()"
       @fitToAllClicked="zoomToSelected"
       @zoomIn="graphNavigator.scale *= 1.1"
       @zoomOut="graphNavigator.scale *= 0.9"
diff --git a/app/gui2/src/components/RecordControl.vue b/app/gui2/src/components/RecordControl.vue
new file mode 100644
index 000000000000..c1ce4ff89d0b
--- /dev/null
+++ b/app/gui2/src/components/RecordControl.vue
@@ -0,0 +1,61 @@
+<script setup lang="ts">
+import SvgIcon from '@/components/SvgIcon.vue'
+import ToggleIcon from '@/components/ToggleIcon.vue'
+
+const props = defineProps<{ recordMode: boolean }>()
+const emit = defineEmits<{ recordOnce: []; 'update:recordMode': [enabled: boolean] }>()
+</script>
+
+<template>
+  <div class="RecordControl" @pointerdown.stop @pointerup.stop @click.stop>
+    <div class="control left-end">
+      <ToggleIcon
+        icon="record"
+        class="button"
+        :alt="`${props.recordMode ? 'Enable' : 'Disable'} record mode`"
+        :modelValue="props.recordMode"
+        @update:modelValue="emit('update:recordMode', $event)"
+      />
+    </div>
+    <div class="control right-end">
+      <SvgIcon
+        alt="Record once"
+        class="button"
+        name="record_once"
+        draggable="false"
+        @click.stop="() => emit('recordOnce')"
+      />
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.RecordControl {
+  user-select: none;
+  display: flex;
+  place-items: center;
+  backdrop-filter: var(--blur-app-bg);
+  gap: 1px;
+}
+
+.control {
+  background: var(--color-frame-bg);
+  padding: 8px 8px;
+}
+
+.left-end {
+  border-radius: var(--radius-full) 0 0 var(--radius-full);
+}
+
+.right-end {
+  border-radius: 0 var(--radius-full) var(--radius-full) 0;
+}
+
+.toggledOn {
+  color: #ba4c40;
+}
+
+.button:active {
+  color: #ba4c40;
+}
+</style>
diff --git a/app/gui2/src/components/TopBar.vue b/app/gui2/src/components/TopBar.vue
index 70ae9973a696..772f6dd090f0 100644
--- a/app/gui2/src/components/TopBar.vue
+++ b/app/gui2/src/components/TopBar.vue
@@ -1,25 +1,24 @@
 <script setup lang="ts">
-import ExecutionModeSelector from '@/components/ExecutionModeSelector.vue'
 import ExtendedMenu from '@/components/ExtendedMenu.vue'
 import NavBar from '@/components/NavBar.vue'
 import type { BreadcrumbItem } from '@/components/NavBreadcrumbs.vue'
+import RecordControl from '@/components/RecordControl.vue'
 import { injectGuiConfig } from '@/providers/guiConfig'
 import { computed } from 'vue'
 
 const props = defineProps<{
   breadcrumbs: BreadcrumbItem[]
-  modes: string[]
-  mode: string
+  recordMode: boolean
   allowNavigationLeft: boolean
   allowNavigationRight: boolean
   zoomLevel: number
 }>()
 const emit = defineEmits<{
-  execute: []
+  recordOnce: []
   back: []
   forward: []
   breadcrumbClick: [index: number]
-  'update:mode': [mode: string]
+  'update:recordMode': [enabled: boolean]
   fitToAllClicked: []
   zoomIn: []
   zoomOut: []
@@ -39,11 +38,10 @@ const barStyle = computed(() => {
 
 <template>
   <div class="TopBar" :style="barStyle">
-    <ExecutionModeSelector
-      :modes="props.modes"
-      :modelValue="props.mode"
-      @update:modelValue="emit('update:mode', $event)"
-      @execute="emit('execute')"
+    <RecordControl
+      :recordMode="props.recordMode"
+      @update:recordMode="emit('update:recordMode', $event)"
+      @recordOnce="emit('recordOnce')"
     />
     <NavBar
       :breadcrumbs="props.breadcrumbs"
diff --git a/app/gui2/src/stores/project/index.ts b/app/gui2/src/stores/project/index.ts
index 7c8cfca24488..65476ae89392 100644
--- a/app/gui2/src/stores/project/index.ts
+++ b/app/gui2/src/stores/project/index.ts
@@ -685,6 +685,15 @@ export const useProjectStore = defineStore('project', () => {
     yDocsProvider = undefined
   }
 
+  const recordMode = computed({
+    get() {
+      return executionMode.value === 'live'
+    },
+    set(value) {
+      executionMode.value = value ? 'live' : 'design'
+    },
+  })
+
   return {
     setObservedFileName(name: string) {
       observedFileName.value = name
@@ -708,6 +717,7 @@ export const useProjectStore = defineStore('project', () => {
     isOutputContextEnabled,
     stopCapturingUndo,
     executionMode,
+    recordMode,
     dataflowErrors,
     executeExpression,
     disposeYDocsProvider,
diff --git a/app/gui2/stories/TopBar.story.vue b/app/gui2/stories/TopBar.story.vue
index c5acfaa8848c..5418110066f7 100644
--- a/app/gui2/stories/TopBar.story.vue
+++ b/app/gui2/stories/TopBar.story.vue
@@ -5,8 +5,7 @@ import { ref } from 'vue'
 import TopBar from '@/components/TopBar.vue'
 
 const title = ref('Mock Project')
-const modes = ref(['design', 'live'])
-const mode = ref('live')
+const recordMode = ref(true)
 const breadcrumbs = ref(['main', 'ad_analytics'])
 </script>
 
@@ -15,21 +14,19 @@ const breadcrumbs = ref(['main', 'ad_analytics'])
     <div style="height: 48px">
       <TopBar
         :title="title"
-        :mode="mode"
-        :modes="modes"
+        :recordMode="recordMode"
         :breadcrumbs="breadcrumbs"
         @back="logEvent('back', [])"
         @forward="logEvent('forward', [])"
-        @execute="logEvent('execute', [])"
+        @recordOnce="logEvent('recordOnce', [])"
         @breadcrumbClick="logEvent('breadcrumbClick', [$event])"
-        @update:mode="logEvent('update:mode', [$event]), (mode = $event)"
+        @update:recordMode="logEvent('update:recordMode', [$event]), (recordMode = $event)"
       />
     </div>
 
     <template #controls>
       <HstText v-model="title" title="title" />
-      <HstSelect v-model="mode" title="mode" :options="modes" />
-      <HstJson v-model="modes" title="modes" />
+      <HstJson v-model="recordMode" title="recordMode" />
       <HstJson v-model="breadcrumbs" title="breadcrumbs" />
     </template>
   </Story>

From 4420a403a904b3c395cc3bbb54cc2ef0f386c45b Mon Sep 17 00:00:00 2001
From: AdRiley <riley.ad@gmail.com>
Date: Sat, 24 Feb 2024 21:31:54 +0000
Subject: [PATCH 14/26] Add ability to choose dimensions and metrics to google
 analytics report (#9156)

* Metrics and Dimensions from Vector

* Add dropdowns

* Small cleanup

* Updated list from Cass
---
 .../Google_Api/0.0.0-dev/src/Main.enso        | 41 ++++++++++++++-----
 1 file changed, 30 insertions(+), 11 deletions(-)

diff --git a/distribution/lib/Standard/Google_Api/0.0.0-dev/src/Main.enso b/distribution/lib/Standard/Google_Api/0.0.0-dev/src/Main.enso
index 40e9a228fa1b..21b3ba87a5b7 100644
--- a/distribution/lib/Standard/Google_Api/0.0.0-dev/src/Main.enso
+++ b/distribution/lib/Standard/Google_Api/0.0.0-dev/src/Main.enso
@@ -1,6 +1,8 @@
 from Standard.Base import all
 import Standard.Base.Data.Array_Proxy.Array_Proxy
-
+import Standard.Base.Metadata.Display
+from Standard.Base.Metadata import make_single_choice, Widget
+from Standard.Base.Metadata.Widget import Single_Choice, Vector_Editor
 from Standard.Table import Table
 
 polyglot java import com.google.api.client.googleapis.auth.oauth2.GoogleCredential
@@ -68,29 +70,46 @@ initialize secret_file =
     json_factory = GsonFactory.getDefaultInstance
     Google_Api_Client.Value credential json_factory http_transport
 
+## PRIVATE
+make_dimensions_vector_selector : Widget
+make_dimensions_vector_selector =
+    item_editor = make_single_choice ['country', 'date', 'isConversionEvent', 'language', 'userAgeBracket', 'userGender']
+    Vector_Editor item_editor=item_editor item_default=item_editor.values.first.value display=Display.Always
+
+## PRIVATE
+make_metrics_vector_selector : Widget
+make_metrics_vector_selector =
+    item_editor = make_single_choice ['activeUsers', 'bounceRate', 'conversions', 'newUsers', 'sessionsPerUser', 'userConversionRate']
+    Vector_Editor item_editor=item_editor item_default=item_editor.values.first.value display=Display.Always
+
 
 ## PLACEHOLDER, performs google analytics call
-   This method calls the google reporting v4 api. Presently it specifically returns activeUsers by City
+   This method calls the google reporting v4 api. 
    Arguments:
    - property_id: The Google Analytics property_id that is being queried
    - start_date: The beginning date of the query. Default is 2020-03-31
    - end_date: The end date being queried. Defaults to today.
-run_analytics_report : Text -> Date -> Date -> Table
-run_analytics_report property_id:Text start_date:Date=(Date.new 2020 3 31) end_date:Date=Date.today -> Table =
+@dimensions make_dimensions_vector_selector
+@metrics make_metrics_vector_selector
+run_analytics_report : Text -> Date -> Date -> (Vector Text) -> (Vector Text) -> Table
+run_analytics_report property_id:Text start_date:Date=(Date.new 2020 3 31) end_date:Date=Date.today dimensions:Vector=['userType'] metrics:Vector=['users'] -> Table =
     analytics_data = BetaAnalyticsDataClient.create
-    request = RunReportRequest.newBuilder
+    request_builder = RunReportRequest.newBuilder
         . setProperty ("properties/"+property_id)
-        . addDimensions (Dimension.newBuilder.setName "city")
-        . addMetrics (Metric.newBuilder.setName "activeUsers")
         . addDateRanges (DateRange.newBuilder.setStartDate start_date.to_text . setEndDate end_date.to_text)
-        . build
+    dimensions.distinct.each dimension->
+        request_builder.addDimensions (Dimension.newBuilder.setName dimension)
+    metrics.distinct.each metric->
+        request_builder.addMetrics (Metric.newBuilder.setName metric)
+
+    request = request_builder.build
     response = analytics_data.runReport request
 
     dimension_count = response.getDimensionHeadersCount
-    dimensions = 0.up_to dimension_count . map i-> response.getDimensionHeaders i . getName
+    dimension_headers = 0.up_to dimension_count . map i-> response.getDimensionHeaders i . getName
     metric_count = response.getMetricHeadersCount
-    metrics = 0.up_to metric_count . map i-> response.getMetricHeaders i . getName
-    headers = dimensions + metrics
+    metric_headers = 0.up_to metric_count . map i-> response.getMetricHeaders i . getName
+    headers = dimension_headers + metric_headers
 
     row_count = response.getRowCount
     row_proxy = Array_Proxy.new row_count i->

From 92624126bacaa355614774f5c239ad74a0888310 Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Mon, 26 Feb 2024 03:38:43 -0500
Subject: [PATCH 15/26] Fix minor visual glitch in record-control background
 (#9170)

Before:
![image](https://github.com/enso-org/enso/assets/1047859/dcf083b2-c169-42a9-a120-4aa730f05962)

After:
![image](https://github.com/enso-org/enso/assets/1047859/7d9b774a-1ccd-4225-9a2d-a313e40e0c4f)
---
 app/gui2/src/components/RecordControl.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/gui2/src/components/RecordControl.vue b/app/gui2/src/components/RecordControl.vue
index c1ce4ff89d0b..b8322bb8c4ee 100644
--- a/app/gui2/src/components/RecordControl.vue
+++ b/app/gui2/src/components/RecordControl.vue
@@ -34,12 +34,12 @@ const emit = defineEmits<{ recordOnce: []; 'update:recordMode': [enabled: boolea
   user-select: none;
   display: flex;
   place-items: center;
-  backdrop-filter: var(--blur-app-bg);
   gap: 1px;
 }
 
 .control {
   background: var(--color-frame-bg);
+  backdrop-filter: var(--blur-app-bg);
   padding: 8px 8px;
 }
 

From 8f2b9da664e8a8e5e184de17b2c66a068ae1e98d Mon Sep 17 00:00:00 2001
From: James Dunkerley <jdunkerley@users.noreply.github.com>
Date: Mon, 26 Feb 2024 10:52:07 +0000
Subject: [PATCH 16/26] IsNa to IsNothing, missing to Nothing in Table code.
 (#9154)

Starting to use Nothing everywhere...
---
 .../Database/0.0.0-dev/src/Data/DB_Table.enso |   2 +-
 .../Table/0.0.0-dev/src/Data/Column.enso      |   4 +-
 .../Table/0.0.0-dev/src/Data/Table.enso       |   2 +-
 .../column/builder/BigIntegerBuilder.java     |   2 +-
 .../data/column/builder/BoolBuilder.java      |  16 +--
 .../data/column/builder/DoubleBuilder.java    |  18 +--
 .../builder/InferringDoubleBuilder.java       |  14 +--
 .../data/column/builder/LongBuilder.java      |  24 ++--
 .../column/builder/LongBuilderChecked.java    |   8 +-
 .../column/builder/LongBuilderUnchecked.java  |   6 +-
 .../data/column/builder/NumericBuilder.java   |   8 +-
 .../operation/cast/ToBigIntegerConverter.java |   6 +-
 .../cast/ToFloatStorageConverter.java         |   4 +-
 .../cast/ToIntegerStorageConverter.java       |  20 ++--
 .../cast/ToTextStorageConverter.java          |  10 +-
 .../map/GenericBinaryObjectMapOperation.java  |   6 +-
 .../operation/map/SpecializedIsInOp.java      |  15 ++-
 .../operation/map/bool/BooleanIsInOp.java     |  30 ++---
 .../operation/map/numeric/DoubleRoundOp.java  |  12 +-
 .../operation/map/numeric/LongRoundOp.java    |  10 +-
 .../NumericBinaryOpImplementation.java        |  50 ++++-----
 .../comparisons/NumericComparison.java        |  62 +++++------
 .../helpers/BigIntegerArrayAdapter.java       |   2 +-
 .../numeric/helpers/DoubleArrayAdapter.java   |   8 +-
 .../column/operation/map/text/LikeOp.java     |  14 +--
 .../operation/map/text/StringBooleanOp.java   |  38 +++----
 .../map/text/StringLongToStringOp.java        |   4 +-
 .../operation/map/text/StringStringOp.java    |   4 +-
 .../data/column/storage/BoolStorage.java      | 104 +++++++++---------
 .../data/column/storage/ColumnStorage.java    |   7 +-
 .../column/storage/MixedStorageFacade.java    |   4 +-
 .../column/storage/SpecializedStorage.java    |   7 +-
 .../table/data/column/storage/Storage.java    |  30 ++---
 .../data/column/storage/StringStorage.java    |  14 +--
 .../storage/numeric/AbstractLongStorage.java  |  18 ++-
 .../storage/numeric/ComputedLongStorage.java  |  26 ++---
 .../numeric/ComputedNullableLongStorage.java  |  42 +++----
 .../column/storage/numeric/DoubleStorage.java |  81 ++++++--------
 .../column/storage/numeric/LongStorage.java   |  62 +++++------
 .../table/data/index/MultiValueKeyBase.java   |   4 +-
 .../org/enso/table/write/ExcelWriter.java     |   2 +-
 .../table_test_helpers/ExplodingStorage.java  |   2 +-
 .../LongNullHandling.java                     |  28 ++---
 .../MapHelpers.java                           |  36 +++---
 .../SimpleStorageAggregateHelpers.java        |   4 +-
 .../src/Table/Column_Aggregate.enso           |   2 +-
 .../src/Table/Column_Bi_Map.enso              |   2 +-
 .../src/Table/Column_Map.enso                 |   2 +-
 .../src/Table/Enso_Callback.enso              |   2 +-
 49 files changed, 423 insertions(+), 455 deletions(-)

diff --git a/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso b/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
index 223247fc3026..3297b50bee88 100644
--- a/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
+++ b/distribution/lib/Standard/Database/0.0.0-dev/src/Data/DB_Table.enso
@@ -2782,7 +2782,7 @@ display_dataframe df indices_count all_rows_count format_terminal =
     display_rows = df.row_count
     rows = Vector.new display_rows row_num->
         col_vals.map col->
-            if col.isNa row_num then "Nothing" else get_item_string col row_num
+            if col.isNothing row_num then "Nothing" else get_item_string col row_num
     table = print_table col_names rows indices_count format_terminal
     if display_rows == all_rows_count then table else
         missing_rows_count = all_rows_count - display_rows
diff --git a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Column.enso b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Column.enso
index e7388ff41b67..96a3226d4662 100644
--- a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Column.enso
+++ b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Column.enso
@@ -161,7 +161,7 @@ type Column
         num_rows = java_col.getSize
         display_rows = num_rows.min show_rows
         items = Vector.new display_rows num->
-            row = if storage.isNa num then "Nothing" else
+            row = if storage.isNothing num then "Nothing" else
                 get_item_string storage num
             [num.to_text, row]
         table = print_table ["", col_name] items 1 format_terminal
@@ -2141,7 +2141,7 @@ type Column
         valid_index = (index >= 0) && (index < self.length)
         if valid_index.not then default else
             storage = self.java_column.getStorage
-            if storage.isNa index then Nothing else
+            if storage.isNothing index then Nothing else
                 storage.getItem index
 
     ## ICON data_input
diff --git a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
index fa0b101094ea..a67f3a096eb9 100644
--- a/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
+++ b/distribution/lib/Standard/Table/0.0.0-dev/src/Data/Table.enso
@@ -185,7 +185,7 @@ type Table
         display_rows = num_rows.min show_rows
         rows = Vector.new display_rows row_num->
             cols = col_vals.map col->
-                if col.isNa row_num then "Nothing" else get_item_string col row_num
+                if col.isNothing row_num then "Nothing" else get_item_string col row_num
             [row_num.to_text] + cols
         table = print_table col_names rows 1 format_terminal
         if num_rows - display_rows <= 0 then table else
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/BigIntegerBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/BigIntegerBuilder.java
index 96a784dbb629..7d4495c90181 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/BigIntegerBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/BigIntegerBuilder.java
@@ -113,7 +113,7 @@ public void appendBulkStorage(Storage<?> storage) {
       if (storage instanceof AbstractLongStorage longStorage) {
         int n = longStorage.size();
         for (int i = 0; i < n; i++) {
-          if (storage.isNa(i)) {
+          if (storage.isNothing(i)) {
             data[currentSize++] = null;
           } else {
             long item = longStorage.getItem(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/BoolBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/BoolBuilder.java
index a13585f78171..a92fe3751641 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/BoolBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/BoolBuilder.java
@@ -11,23 +11,23 @@
 /** A builder for boolean columns. */
 public class BoolBuilder extends TypedBuilder {
   private final BitSet vals;
-  private final BitSet isNa;
+  private final BitSet isNothing;
   int size = 0;
 
   public BoolBuilder() {
     vals = new BitSet();
-    isNa = new BitSet();
+    isNothing = new BitSet();
   }
 
   public BoolBuilder(int capacity) {
     vals = new BitSet(capacity);
-    isNa = new BitSet(capacity);
+    isNothing = new BitSet(capacity);
   }
 
   @Override
   public void appendNoGrow(Object o) {
     if (o == null) {
-      isNa.set(size);
+      isNothing.set(size);
     } else {
       if (o instanceof Boolean b) {
         if (b) {
@@ -64,7 +64,7 @@ public void appendBoolean(boolean data) {
 
   @Override
   public void appendNulls(int count) {
-    isNa.set(size, size + count);
+    isNothing.set(size, size + count);
     size += count;
   }
 
@@ -73,7 +73,7 @@ public void appendBulkStorage(Storage<?> storage) {
     if (storage.getType().equals(getType())) {
       if (storage instanceof BoolStorage boolStorage) {
         BitSets.copy(boolStorage.getValues(), vals, size, boolStorage.size());
-        BitSets.copy(boolStorage.getIsMissing(), isNa, size, boolStorage.size());
+        BitSets.copy(boolStorage.getIsNothingMap(), isNothing, size, boolStorage.size());
         size += boolStorage.size();
       } else {
         throw new IllegalStateException(
@@ -88,7 +88,7 @@ public void appendBulkStorage(Storage<?> storage) {
 
   @Override
   public Storage<Boolean> seal() {
-    return new BoolStorage(vals, isNa, size, false);
+    return new BoolStorage(vals, isNothing, size, false);
   }
 
   @Override
@@ -99,7 +99,7 @@ public int getCurrentSize() {
   @Override
   public void retypeToMixed(Object[] items) {
     for (int i = 0; i < size; i++) {
-      if (isNa.get(i)) {
+      if (isNothing.get(i)) {
         items[i] = null;
       } else {
         items[i] = vals.get(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/DoubleBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/DoubleBuilder.java
index 3c2bf8097308..f915ab4dcb74 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/DoubleBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/DoubleBuilder.java
@@ -23,8 +23,8 @@
 /** A builder for floating point columns. */
 public class DoubleBuilder extends NumericBuilder {
   DoubleBuilder(
-      BitSet isMissing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
-    super(isMissing, data, currentSize);
+      BitSet isNothing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
+    super(isNothing, data, currentSize);
     precisionLossAggregator = new PrecisionLossAggregator(problemAggregator);
   }
 
@@ -55,7 +55,7 @@ public StorageType getType() {
   @Override
   public void appendNoGrow(Object o) {
     if (o == null) {
-      isMissing.set(currentSize++);
+      isNothing.set(currentSize++);
     } else if (NumericConverter.isFloatLike(o)) {
       double value = NumericConverter.coerceToDouble(o);
       data[currentSize++] = Double.doubleToRawLongBits(value);
@@ -83,7 +83,7 @@ public void appendBulkStorage(Storage<?> storage) {
         int n = doubleStorage.size();
         ensureFreeSpaceFor(n);
         System.arraycopy(doubleStorage.getRawData(), 0, data, currentSize, n);
-        BitSets.copy(doubleStorage.getIsMissing(), isMissing, currentSize, n);
+        BitSets.copy(doubleStorage.getIsNothingMap(), isNothing, currentSize, n);
         currentSize += n;
       } else {
         throw new IllegalStateException(
@@ -94,7 +94,7 @@ public void appendBulkStorage(Storage<?> storage) {
     } else if (storage.getType() instanceof IntegerType) {
       if (storage instanceof AbstractLongStorage longStorage) {
         int n = longStorage.size();
-        BitSets.copy(longStorage.getIsMissing(), isMissing, currentSize, n);
+        BitSets.copy(longStorage.getIsNothingMap(), isNothing, currentSize, n);
         for (int i = 0; i < n; i++) {
           long item = longStorage.getItem(i);
           double converted = convertIntegerToDouble(item);
@@ -112,7 +112,7 @@ public void appendBulkStorage(Storage<?> storage) {
         for (int i = 0; i < n; i++) {
           BigInteger item = bigIntegerStorage.getItem(i);
           if (item == null) {
-            isMissing.set(currentSize++);
+            isNothing.set(currentSize++);
           } else {
             double converted = convertBigIntegerToDouble(item);
             data[currentSize++] = Double.doubleToRawLongBits(converted);
@@ -128,8 +128,8 @@ public void appendBulkStorage(Storage<?> storage) {
       if (storage instanceof BoolStorage boolStorage) {
         int n = boolStorage.size();
         for (int i = 0; i < n; i++) {
-          if (boolStorage.isNa(i)) {
-            isMissing.set(currentSize++);
+          if (boolStorage.isNothing(i)) {
+            isNothing.set(currentSize++);
           } else {
             double x = ToFloatStorageConverter.booleanAsDouble(boolStorage.getItem(i));
             data[currentSize++] = Double.doubleToRawLongBits(x);
@@ -183,7 +183,7 @@ public void appendBigInteger(BigInteger integer) {
 
   @Override
   public Storage<Double> seal() {
-    return new DoubleStorage(data, currentSize, isMissing);
+    return new DoubleStorage(data, currentSize, isNothing);
   }
 
   /**
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/InferringDoubleBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/InferringDoubleBuilder.java
index 44758a03c19b..55977439ed28 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/InferringDoubleBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/InferringDoubleBuilder.java
@@ -19,11 +19,11 @@ static InferringDoubleBuilder retypeFromLongBuilder(LongBuilder longBuilder) {
     int currentSize = longBuilder.currentSize;
     InferringDoubleBuilder newBuilder =
         new InferringDoubleBuilder(
-            longBuilder.isMissing, longBuilder.data, currentSize, longBuilder.problemAggregator);
+            longBuilder.isNothing, longBuilder.data, currentSize, longBuilder.problemAggregator);
 
     // Invalidate the old builder.
     longBuilder.data = null;
-    longBuilder.isMissing = null;
+    longBuilder.isNothing = null;
     longBuilder.currentSize = -1;
 
     // Assume all longs will be compacted.
@@ -31,7 +31,7 @@ static InferringDoubleBuilder retypeFromLongBuilder(LongBuilder longBuilder) {
 
     // Translate the data in-place to avoid unnecessary allocations.
     for (int i = 0; i < currentSize; i++) {
-      if (!newBuilder.isMissing.get(i)) {
+      if (!newBuilder.isNothing.get(i)) {
         long currentIntegerValue = newBuilder.data[i];
         double convertedFloatValue = (double) currentIntegerValue;
         boolean isLossy = currentIntegerValue != (long) convertedFloatValue;
@@ -52,8 +52,8 @@ static InferringDoubleBuilder retypeFromLongBuilder(LongBuilder longBuilder) {
   }
 
   InferringDoubleBuilder(
-      BitSet isMissing, long[] doubleData, int currentSize, ProblemAggregator problemAggregator) {
-    super(isMissing, doubleData, currentSize, problemAggregator);
+      BitSet isNothing, long[] doubleData, int currentSize, ProblemAggregator problemAggregator) {
+    super(isNothing, doubleData, currentSize, problemAggregator);
     rawData = null;
     isLongCompactedAsDouble = new BitSet();
   }
@@ -81,7 +81,7 @@ static InferringDoubleBuilder retypeFromLongBuilder(LongBuilder longBuilder) {
   public void retypeToMixed(Object[] items) {
     int rawN = rawData == null ? 0 : rawData.length;
     for (int i = 0; i < currentSize; i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         items[i] = null;
       } else {
         if (isLongCompactedAsDouble.get(i)) {
@@ -157,7 +157,7 @@ public void appendBigInteger(BigInteger integer) {
   @Override
   public void appendNoGrow(Object o) {
     if (o == null) {
-      isMissing.set(currentSize++);
+      isNothing.set(currentSize++);
     } else if (NumericConverter.isFloatLike(o)) {
       double value = NumericConverter.coerceToDouble(o);
       data[currentSize++] = Double.doubleToRawLongBits(value);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilder.java
index 65d0cece24f4..e56e4b86722b 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilder.java
@@ -21,25 +21,25 @@ public abstract class LongBuilder extends NumericBuilder {
   protected final ProblemAggregator problemAggregator;
 
   protected LongBuilder(
-      BitSet isMissing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
-    super(isMissing, data, currentSize);
+      BitSet isNothing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
+    super(isNothing, data, currentSize);
     this.problemAggregator = problemAggregator;
   }
 
   static LongBuilder make(int initialSize, IntegerType type, ProblemAggregator problemAggregator) {
-    BitSet isMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     long[] data = new long[initialSize];
     if (type.equals(IntegerType.INT_64)) {
-      return new LongBuilderUnchecked(isMissing, data, 0, problemAggregator);
+      return new LongBuilderUnchecked(isNothing, data, 0, problemAggregator);
     } else {
-      return new LongBuilderChecked(isMissing, data, 0, type, problemAggregator);
+      return new LongBuilderChecked(isNothing, data, 0, type, problemAggregator);
     }
   }
 
   @Override
   public void retypeToMixed(Object[] items) {
     for (int i = 0; i < currentSize; i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         items[i] = null;
       } else {
         items[i] = data[i];
@@ -80,15 +80,15 @@ public void appendBulkStorage(Storage<?> storage) {
       int n = longStorage.size();
       ensureFreeSpaceFor(n);
       System.arraycopy(longStorage.getRawData(), 0, data, currentSize, n);
-      BitSets.copy(longStorage.getIsMissing(), isMissing, currentSize, n);
+      BitSets.copy(longStorage.getIsNothingMap(), isNothing, currentSize, n);
       currentSize += n;
     } else if (storage.getType() instanceof IntegerType otherType && getType().fits(otherType)) {
       if (storage instanceof AbstractLongStorage longStorage) {
         int n = longStorage.size();
         ensureFreeSpaceFor(n);
         for (int i = 0; i < n; i++) {
-          if (longStorage.isNa(i)) {
-            isMissing.set(currentSize++);
+          if (longStorage.isNothing(i)) {
+            isNothing.set(currentSize++);
           } else {
             appendLongNoGrow(longStorage.getItem(i));
           }
@@ -103,8 +103,8 @@ public void appendBulkStorage(Storage<?> storage) {
       if (storage instanceof BoolStorage boolStorage) {
         int n = boolStorage.size();
         for (int i = 0; i < n; i++) {
-          if (boolStorage.isNa(i)) {
-            isMissing.set(currentSize++);
+          if (boolStorage.isNothing(i)) {
+            isNothing.set(currentSize++);
           } else {
             data[currentSize++] = ToIntegerStorageConverter.booleanAsLong(boolStorage.getItem(i));
           }
@@ -147,6 +147,6 @@ public void appendLongUnchecked(long data) {
 
   @Override
   public Storage<Long> seal() {
-    return new LongStorage(data, currentSize, isMissing, getType());
+    return new LongStorage(data, currentSize, isNothing, getType());
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderChecked.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderChecked.java
index 10129429f757..47ac9751c73f 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderChecked.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderChecked.java
@@ -13,12 +13,12 @@ public class LongBuilderChecked extends LongBuilder {
   private final CastProblemAggregator castProblemAggregator;
 
   protected LongBuilderChecked(
-      BitSet isMissing,
+      BitSet isNothing,
       long[] data,
       int currentSize,
       IntegerType type,
       ProblemAggregator problemAggregator) {
-    super(isMissing, data, currentSize, problemAggregator);
+    super(isNothing, data, currentSize, problemAggregator);
     this.type = type;
 
     // Currently we have no correlation with column name, and it may not be necessary for now.
@@ -31,7 +31,7 @@ protected LongBuilderChecked(
   @Override
   public void appendNoGrow(Object o) {
     if (o == null) {
-      isMissing.set(currentSize++);
+      isNothing.set(currentSize++);
     } else {
       Long x = NumericConverter.tryConvertingToLong(o);
       if (x != null) {
@@ -52,7 +52,7 @@ public void appendLongNoGrow(long x) {
     if (type.fits(x)) {
       data[currentSize++] = x;
     } else {
-      isMissing.set(currentSize++);
+      isNothing.set(currentSize++);
       castProblemAggregator.reportNumberOutOfRange(x);
     }
   }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderUnchecked.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderUnchecked.java
index c2d315fa42cd..b899eb283de2 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderUnchecked.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/LongBuilderUnchecked.java
@@ -12,14 +12,14 @@
  */
 public class LongBuilderUnchecked extends LongBuilder {
   protected LongBuilderUnchecked(
-      BitSet isMissing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
-    super(isMissing, data, currentSize, problemAggregator);
+      BitSet isNothing, long[] data, int currentSize, ProblemAggregator problemAggregator) {
+    super(isNothing, data, currentSize, problemAggregator);
   }
 
   @Override
   public void appendNoGrow(Object o) {
     if (o == null) {
-      isMissing.set(currentSize++);
+      isNothing.set(currentSize++);
     } else {
       Long x = NumericConverter.tryConvertingToLong(o);
       if (x != null) {
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/builder/NumericBuilder.java b/std-bits/table/src/main/java/org/enso/table/data/column/builder/NumericBuilder.java
index a2527cb8b15c..a2bbacedf7ac 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/builder/NumericBuilder.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/builder/NumericBuilder.java
@@ -7,12 +7,12 @@
 
 /** A common base for numeric builders. */
 public abstract class NumericBuilder extends TypedBuilder {
-  protected BitSet isMissing;
+  protected BitSet isNothing;
   protected long[] data;
   protected int currentSize;
 
-  NumericBuilder(BitSet isMissing, long[] data, int currentSize) {
-    this.isMissing = isMissing;
+  NumericBuilder(BitSet isNothing, long[] data, int currentSize) {
+    this.isNothing = isNothing;
     this.data = data;
     this.currentSize = currentSize;
   }
@@ -38,7 +38,7 @@ public static LongBuilder createLongBuilder(
 
   @Override
   public void appendNulls(int count) {
-    isMissing.set(currentSize, currentSize + count);
+    isNothing.set(currentSize, currentSize + count);
     currentSize += count;
   }
 
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToBigIntegerConverter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToBigIntegerConverter.java
index bc035013eebb..7f489254dccd 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToBigIntegerConverter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToBigIntegerConverter.java
@@ -34,7 +34,7 @@ private Storage<BigInteger> convertDoubleStorage(
     int n = doubleStorage.size();
     BigIntegerBuilder builder = new BigIntegerBuilder(n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (doubleStorage.isNa(i)) {
+      if (doubleStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         double x = doubleStorage.getItemAsDouble(i);
@@ -50,7 +50,7 @@ private Storage<BigInteger> convertLongStorage(
     int n = longStorage.size();
     BigIntegerBuilder builder = new BigIntegerBuilder(n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (longStorage.isNa(i)) {
+      if (longStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         long x = longStorage.getItem(i);
@@ -66,7 +66,7 @@ private Storage<BigInteger> convertBoolStorage(
     int n = boolStorage.size();
     BigIntegerBuilder builder = new BigIntegerBuilder(n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (boolStorage.isNa(i)) {
+      if (boolStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         boolean x = boolStorage.getItem(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToFloatStorageConverter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToFloatStorageConverter.java
index 52fdcaa96d2f..13102e4cff6c 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToFloatStorageConverter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToFloatStorageConverter.java
@@ -75,7 +75,7 @@ private Storage<Double> convertLongStorage(
     int n = longStorage.size();
     DoubleBuilder builder = NumericBuilder.createDoubleBuilder(n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (longStorage.isNa(i)) {
+      if (longStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         long value = longStorage.getItem(i);
@@ -91,7 +91,7 @@ private Storage<Double> convertBoolStorage(
     int n = boolStorage.size();
     DoubleBuilder builder = NumericBuilder.createDoubleBuilder(n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (boolStorage.isNa(i)) {
+      if (boolStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         boolean value = boolStorage.getItem(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToIntegerStorageConverter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToIntegerStorageConverter.java
index d9606e0ee82c..8a98b3ef6f7c 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToIntegerStorageConverter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToIntegerStorageConverter.java
@@ -97,7 +97,7 @@ private Storage<Long> convertBoolStorage(
     int n = boolStorage.size();
     LongBuilder builder = NumericBuilder.createLongBuilder(n, targetType, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (boolStorage.isNa(i)) {
+      if (boolStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         boolean value = boolStorage.getItem(i);
@@ -116,7 +116,7 @@ private Storage<Long> convertDoubleStorage(
     int n = doubleStorage.size();
     LongBuilder builder = NumericBuilder.createLongBuilder(n, targetType, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (doubleStorage.isNa(i)) {
+      if (doubleStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         double value = doubleStorage.getItemAsDouble(i);
@@ -147,14 +147,14 @@ private Storage<Long> convertLongStorage(
       Context context = Context.getCurrent();
       int n = longStorage.size();
       long[] data = new long[n];
-      BitSet isMissing = BitSets.makeDuplicate(longStorage.getIsMissing());
+      BitSet isNothing = BitSets.makeDuplicate(longStorage.getIsNothingMap());
       for (int i = 0; i < n; i++) {
-        if (!isMissing.get(i)) {
+        if (!isNothing.get(i)) {
           long value = longStorage.getItem(i);
           if (targetType.fits(value)) {
             data[i] = value;
           } else {
-            isMissing.set(i);
+            isNothing.set(i);
             problemAggregator.reportNumberOutOfRange(value);
           }
         }
@@ -162,7 +162,7 @@ private Storage<Long> convertLongStorage(
         context.safepoint();
       }
 
-      return new LongStorage(data, n, isMissing, targetType);
+      return new LongStorage(data, n, isNothing, targetType);
     }
   }
 
@@ -171,22 +171,22 @@ private Storage<Long> convertBigIntegerStorage(
     Context context = Context.getCurrent();
     int n = storage.size();
     long[] data = new long[n];
-    BitSet isMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
       BigInteger value = storage.getItemBoxed(i);
       if (value == null) {
-        isMissing.set(i);
+        isNothing.set(i);
       } else if (targetType.fits(value)) {
         data[i] = value.longValue();
       } else {
-        isMissing.set(i);
+        isNothing.set(i);
         problemAggregator.reportNumberOutOfRange(value);
       }
 
       context.safepoint();
     }
 
-    return new LongStorage(data, n, isMissing, targetType);
+    return new LongStorage(data, n, isNothing, targetType);
   }
 
   public static long booleanAsLong(boolean value) {
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToTextStorageConverter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToTextStorageConverter.java
index a75604605e9e..3c1afce68cca 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToTextStorageConverter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/cast/ToTextStorageConverter.java
@@ -101,7 +101,7 @@ private Storage<String> castLongStorage(
     Context context = Context.getCurrent();
     StringBuilder builder = new StringBuilder(longStorage.size(), targetType);
     for (int i = 0; i < longStorage.size(); i++) {
-      if (longStorage.isNa(i)) {
+      if (longStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         long value = longStorage.getItem(i);
@@ -119,7 +119,7 @@ private Storage<String> castBoolStorage(
     Context context = Context.getCurrent();
     StringBuilder builder = new StringBuilder(boolStorage.size(), targetType);
     for (int i = 0; i < boolStorage.size(); i++) {
-      if (boolStorage.isNa(i)) {
+      if (boolStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         boolean value = boolStorage.getItem(i);
@@ -137,7 +137,7 @@ private Storage<String> castDoubleStorage(
     Context context = Context.getCurrent();
     StringBuilder builder = new StringBuilder(doubleStorage.size(), targetType);
     for (int i = 0; i < doubleStorage.size(); i++) {
-      if (doubleStorage.isNa(i)) {
+      if (doubleStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         double value = doubleStorage.getItemAsDouble(i);
@@ -155,7 +155,7 @@ private <T> Storage<String> castDateTimeStorage(
     Context context = Context.getCurrent();
     StringBuilder builder = new StringBuilder(storage.size(), targetType);
     for (int i = 0; i < storage.size(); i++) {
-      if (storage.isNa(i)) {
+      if (storage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         T value = storage.getItemBoxed(i);
@@ -192,7 +192,7 @@ private Storage<String> adaptStringStorage(
     Context context = Context.getCurrent();
     StringBuilder builder = new StringBuilder(stringStorage.size(), targetType);
     for (int i = 0; i < stringStorage.size(); i++) {
-      if (stringStorage.isNa(i)) {
+      if (stringStorage.isNothing(i)) {
         builder.appendNulls(1);
       } else {
         String value = stringStorage.getItem(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/GenericBinaryObjectMapOperation.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/GenericBinaryObjectMapOperation.java
index f06d727ab88c..a25102d4df05 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/GenericBinaryObjectMapOperation.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/GenericBinaryObjectMapOperation.java
@@ -42,7 +42,7 @@ public Storage<?> runBinaryMap(
       Builder builder = createOutputBuilder(n);
       Context context = Context.getCurrent();
       for (int i = 0; i < n; i++) {
-        if (storage.isNa(i)) {
+        if (storage.isNothing(i)) {
           builder.appendNulls(1);
         } else {
           OutputType result = run(storage.getItemBoxed(i), casted);
@@ -67,7 +67,7 @@ public Storage<?> runZip(
       Builder builder = createOutputBuilder(n);
       Context context = Context.getCurrent();
       for (int i = 0; i < n; ++i) {
-        if (storage.isNa(i) || otherCasted.isNa(i)) {
+        if (storage.isNothing(i) || otherCasted.isNothing(i)) {
           builder.appendNulls(1);
         } else {
           InputType left = storage.getItemBoxed(i);
@@ -85,7 +85,7 @@ public Storage<?> runZip(
       Builder builder = createOutputBuilder(n);
       Context context = Context.getCurrent();
       for (int i = 0; i < n; ++i) {
-        if (storage.isNa(i) || arg.isNa(i)) {
+        if (storage.isNothing(i) || arg.isNothing(i)) {
           builder.appendNulls(1);
         } else {
           InputType left = storage.getItemBoxed(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/SpecializedIsInOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/SpecializedIsInOp.java
index 9409ca1d7862..1c33277d1376 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/SpecializedIsInOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/SpecializedIsInOp.java
@@ -55,23 +55,22 @@ public Storage<?> runMap(S storage, List<?> arg) {
     Context context = Context.getCurrent();
     CompactRepresentation<T> compactRepresentation = prepareList(arg);
     BitSet newVals = new BitSet();
-    BitSet missing = new BitSet();
-    if (arg.size() > 0) {
+    BitSet isNothing = new BitSet();
+    if (!arg.isEmpty()) {
       for (int i = 0; i < storage.size(); i++) {
-        if (storage.isNa(i)) {
-          missing.set(i);
+        if (storage.isNothing(i)) {
+          isNothing.set(i);
         } else if (compactRepresentation.coercedValues.contains(storage.getItemBoxed(i))) {
           newVals.set(i);
         } else if (compactRepresentation.hasNulls) {
-          missing.set(i);
-        } else {
-          // Leave as default=false
+          isNothing.set(i);
         }
+        // Otherwise leave as default=false
 
         context.safepoint();
       }
     }
-    return new BoolStorage(newVals, missing, storage.size(), false);
+    return new BoolStorage(newVals, isNothing, storage.size(), false);
   }
 
   @Override
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/bool/BooleanIsInOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/bool/BooleanIsInOp.java
index b19f687e2c8a..80a9cd7b4797 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/bool/BooleanIsInOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/bool/BooleanIsInOp.java
@@ -62,28 +62,32 @@ public Storage<?> runZip(
   private BoolStorage run(BoolStorage storage, boolean hadNull, boolean hadTrue, boolean hadFalse) {
     int size = storage.size();
     ImmutableBitSet values = new ImmutableBitSet(storage.getValues(), size);
-    ImmutableBitSet missing = new ImmutableBitSet(storage.getIsMissing(), size);
+    ImmutableBitSet isNothing = new ImmutableBitSet(storage.getIsNothingMap(), size);
     boolean negated = storage.isNegated();
 
     ImmutableBitSet newValues;
-    ImmutableBitSet newMissing;
+    ImmutableBitSet newIsNothing;
 
     if (hadTrue && !hadFalse) {
-      newValues = storage.isNegated() ? missing.notAndNot(values) : missing.notAnd(values);
-      newMissing =
-          hadNull ? (storage.isNegated() ? missing.or(values) : missing.orNot(values)) : missing;
+      newValues = storage.isNegated() ? isNothing.notAndNot(values) : isNothing.notAnd(values);
+      newIsNothing =
+          hadNull
+              ? (storage.isNegated() ? isNothing.or(values) : isNothing.orNot(values))
+              : isNothing;
     } else if (!hadTrue && hadFalse) {
-      newValues = storage.isNegated() ? missing.notAnd(values) : missing.notAndNot(values);
-      newMissing =
-          hadNull ? (storage.isNegated() ? missing.orNot(values) : missing.or(values)) : missing;
-    } else if (hadTrue && hadFalse) {
-      newValues = missing.not();
-      newMissing = missing;
+      newValues = storage.isNegated() ? isNothing.notAnd(values) : isNothing.notAndNot(values);
+      newIsNothing =
+          hadNull
+              ? (storage.isNegated() ? isNothing.orNot(values) : isNothing.or(values))
+              : isNothing;
+    } else if (hadTrue) {
+      newValues = isNothing.not();
+      newIsNothing = isNothing;
     } else {
       newValues = ImmutableBitSet.allFalse(size);
-      newMissing = hadNull ? ImmutableBitSet.allTrue(size) : ImmutableBitSet.allFalse(size);
+      newIsNothing = hadNull ? ImmutableBitSet.allTrue(size) : ImmutableBitSet.allFalse(size);
     }
 
-    return new BoolStorage(newValues.toBitSet(), newMissing.toBitSet(), size, false);
+    return new BoolStorage(newValues.toBitSet(), newIsNothing.toBitSet(), size, false);
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/DoubleRoundOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/DoubleRoundOp.java
index badd717f6af4..28439815b769 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/DoubleRoundOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/DoubleRoundOp.java
@@ -39,10 +39,10 @@ public Storage<?> runTernaryMap(
     if (decimalPlaces <= 0) {
       // Return Long storage
       long[] out = new long[storage.size()];
-      BitSet isMissing = new BitSet();
+      BitSet isNothing = new BitSet();
 
       for (int i = 0; i < storage.size(); i++) {
-        if (!storage.isNa(i)) {
+        if (!storage.isNothing(i)) {
           double item = storage.getItemAsDouble(i);
           boolean special = Double.isNaN(item) || Double.isInfinite(item);
           if (!special) {
@@ -50,22 +50,22 @@ public Storage<?> runTernaryMap(
           } else {
             String msg = "Value is " + item;
             problemAggregator.reportArithmeticError(msg, i);
-            isMissing.set(i);
+            isNothing.set(i);
           }
         } else {
-          isMissing.set(i);
+          isNothing.set(i);
         }
 
         context.safepoint();
       }
-      return new LongStorage(out, storage.size(), isMissing, IntegerType.INT_64);
+      return new LongStorage(out, storage.size(), isNothing, IntegerType.INT_64);
     } else {
       // Return double storage.
       DoubleBuilder doubleBuilder =
           NumericBuilder.createDoubleBuilder(storage.size(), problemAggregator);
 
       for (int i = 0; i < storage.size(); i++) {
-        if (!storage.isNa(i)) {
+        if (!storage.isNothing(i)) {
           double item = storage.getItemAsDouble(i);
           boolean special = Double.isNaN(item) || Double.isInfinite(item);
           if (!special) {
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/LongRoundOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/LongRoundOp.java
index 505cd3541a83..6d247b27dbad 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/LongRoundOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/LongRoundOp.java
@@ -45,10 +45,10 @@ public Storage<Long> runTernaryMap(
 
     Context context = Context.getCurrent();
     long[] out = new long[storage.size()];
-    BitSet isMissing = new BitSet();
+    BitSet isNothing = new BitSet();
 
     for (int i = 0; i < storage.size(); i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         long item = storage.getItem(i);
         boolean outOfRange = item < ROUND_MIN_LONG || item > ROUND_MAX_LONG;
         if (!outOfRange) {
@@ -62,16 +62,16 @@ public Storage<Long> runTernaryMap(
                   + " (inclusive), but was "
                   + item;
           problemAggregator.reportIllegalArgumentError(msg, i);
-          isMissing.set(i);
+          isNothing.set(i);
         }
 
       } else {
-        isMissing.set(i);
+        isNothing.set(i);
       }
 
       context.safepoint();
     }
 
-    return new LongStorage(out, storage.size(), isMissing, IntegerType.INT_64);
+    return new LongStorage(out, storage.size(), isNothing, IntegerType.INT_64);
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/arithmetic/NumericBinaryOpImplementation.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/arithmetic/NumericBinaryOpImplementation.java
index ae03315f549d..ede9667b08e6 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/arithmetic/NumericBinaryOpImplementation.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/arithmetic/NumericBinaryOpImplementation.java
@@ -122,10 +122,10 @@ protected DoubleStorage runDoubleZip(
     int n = a.size();
     int m = Math.min(a.size(), b.size());
     long[] out = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < m; i++) {
-      if (a.isNa(i) || b.isNa(i)) {
-        newMissing.set(i);
+      if (a.isNothing(i) || b.isNothing(i)) {
+        isNothing.set(i);
       } else {
         double r = doDouble(a.getItemAsDouble(i), b.getItemAsDouble(i), i, problemAggregator);
         out[i] = Double.doubleToRawLongBits(r);
@@ -135,10 +135,10 @@ protected DoubleStorage runDoubleZip(
     }
 
     if (m < n) {
-      newMissing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new DoubleStorage(out, n, newMissing);
+    return new DoubleStorage(out, n, isNothing);
   }
 
   private static Storage<? extends Number> allNullStorageOfSameType(Storage<?> storage) {
@@ -161,10 +161,10 @@ protected DoubleStorage runDoubleMap(
     Context context = Context.getCurrent();
     int n = a.size();
     long[] out = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (a.isNa(i)) {
-        newMissing.set(i);
+      if (a.isNothing(i)) {
+        isNothing.set(i);
       } else {
         double r = doDouble(a.getItemAsDouble(i), bNonNull, i, problemAggregator);
         out[i] = Double.doubleToRawLongBits(r);
@@ -173,7 +173,7 @@ protected DoubleStorage runDoubleMap(
       context.safepoint();
     }
 
-    return new DoubleStorage(out, n, newMissing);
+    return new DoubleStorage(out, n, isNothing);
   }
 
   protected LongStorage runLongZip(
@@ -184,14 +184,14 @@ protected LongStorage runLongZip(
     int n = a.size();
     int m = Math.min(a.size(), b.size());
     long[] out = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < m; i++) {
-      if (a.isNa(i) || b.isNa(i)) {
-        newMissing.set(i);
+      if (a.isNothing(i) || b.isNothing(i)) {
+        isNothing.set(i);
       } else {
         Long r = doLong(a.getItem(i), b.getItem(i), i, problemAggregator);
         if (r == null) {
-          newMissing.set(i);
+          isNothing.set(i);
         } else {
           out[i] = r;
         }
@@ -201,10 +201,10 @@ protected LongStorage runLongZip(
     }
 
     if (m < n) {
-      newMissing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new LongStorage(out, n, newMissing, INTEGER_RESULT_TYPE);
+    return new LongStorage(out, n, isNothing, INTEGER_RESULT_TYPE);
   }
 
   protected LongStorage runLongMap(
@@ -217,14 +217,14 @@ protected LongStorage runLongMap(
     Context context = Context.getCurrent();
     int n = a.size();
     long[] out = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (a.isNa(i)) {
-        newMissing.set(i);
+      if (a.isNothing(i)) {
+        isNothing.set(i);
       } else {
         Long r = doLong(a.getItem(i), bNonNull, i, problemAggregator);
         if (r == null) {
-          newMissing.set(i);
+          isNothing.set(i);
         } else {
           out[i] = r;
         }
@@ -233,7 +233,7 @@ protected LongStorage runLongMap(
       context.safepoint();
     }
 
-    return new LongStorage(out, n, newMissing, INTEGER_RESULT_TYPE);
+    return new LongStorage(out, n, isNothing, INTEGER_RESULT_TYPE);
   }
 
   protected BigIntegerStorage runBigIntegerZip(
@@ -244,24 +244,16 @@ protected BigIntegerStorage runBigIntegerZip(
     int n = a.size();
     int m = Math.min(a.size(), b.size());
     BigInteger[] out = new BigInteger[n];
-    BitSet newMissing = new BitSet();
     for (int i = 0; i < m; i++) {
       BigInteger x = a.getItem(i);
       BigInteger y = b.getItem(i);
-      if (x == null || y == null) {
-        newMissing.set(i);
-      } else {
+      if (x != null && y != null) {
         BigInteger r = doBigInteger(x, y, i, problemAggregator);
         out[i] = r;
       }
-
       context.safepoint();
     }
 
-    if (m < n) {
-      newMissing.set(m, n);
-    }
-
     return new BigIntegerStorage(out, n);
   }
 
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/comparisons/NumericComparison.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/comparisons/NumericComparison.java
index 8efe80a86746..fcef5f955574 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/comparisons/NumericComparison.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/comparisons/NumericComparison.java
@@ -67,13 +67,13 @@ public BoolStorage runBinaryMap(
       return runDoubleMap(lhs, rhs, problemAggregator);
     } else {
       int n = storage.size();
-      BitSet missing = new BitSet();
+      BitSet isNothing = new BitSet();
       BitSet comparisonResults = new BitSet();
       Context context = Context.getCurrent();
       for (int i = 0; i < n; ++i) {
         Object item = storage.getItemBoxed(i);
         if (item == null) {
-          missing.set(i);
+          isNothing.set(i);
         } else {
           boolean r = onOtherType(item, arg);
           if (r) {
@@ -84,7 +84,7 @@ public BoolStorage runBinaryMap(
         context.safepoint();
       }
 
-      return new BoolStorage(comparisonResults, missing, n, false);
+      return new BoolStorage(comparisonResults, isNothing, n, false);
     }
   }
 
@@ -92,10 +92,10 @@ protected BoolStorage runLongMap(
       AbstractLongStorage lhs, long rhs, MapOperationProblemAggregator problemAggregator) {
     int n = lhs.size();
     BitSet comparisonResults = new BitSet();
-    BitSet missing = BitSets.makeDuplicate(lhs.getIsMissing());
+    BitSet isNothing = BitSets.makeDuplicate(lhs.getIsNothingMap());
     Context context = Context.getCurrent();
     for (int i = 0; i < n; ++i) {
-      if (!lhs.isNa(i)) {
+      if (!lhs.isNothing(i)) {
         long item = lhs.getItem(i);
         boolean r = doLong(item, rhs);
         if (r) {
@@ -106,18 +106,18 @@ protected BoolStorage runLongMap(
       context.safepoint();
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   protected BoolStorage runDoubleMap(
       DoubleArrayAdapter lhs, double rhs, MapOperationProblemAggregator problemAggregator) {
     int n = lhs.size();
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < n; ++i) {
-      if (lhs.isNa(i)) {
-        missing.set(i);
+      if (lhs.isNothing(i)) {
+        isNothing.set(i);
       } else {
         double item = lhs.getItemAsDouble(i);
         boolean r = doDouble(item, rhs);
@@ -129,19 +129,19 @@ protected BoolStorage runDoubleMap(
       context.safepoint();
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   protected BoolStorage runBigIntegerMap(
       BigIntegerArrayAdapter lhs, BigInteger rhs, MapOperationProblemAggregator problemAggregator) {
     int n = lhs.size();
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < n; ++i) {
       BigInteger item = lhs.getItem(i);
       if (item == null) {
-        missing.set(i);
+        isNothing.set(i);
       } else {
         boolean r = doBigInteger(item, rhs);
         if (r) {
@@ -152,7 +152,7 @@ protected BoolStorage runBigIntegerMap(
       context.safepoint();
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   @Override
@@ -208,11 +208,11 @@ protected BoolStorage runLongZip(
     int n = lhs.size();
     int m = Math.min(lhs.size(), rhs.size());
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < m; ++i) {
-      if (lhs.isNa(i) || rhs.isNa(i)) {
-        missing.set(i);
+      if (lhs.isNothing(i) || rhs.isNothing(i)) {
+        isNothing.set(i);
       } else {
         long x = lhs.getItem(i);
         long y = rhs.getItem(i);
@@ -226,10 +226,10 @@ protected BoolStorage runLongZip(
     }
 
     if (m < n) {
-      missing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   protected BoolStorage runDoubleZip(
@@ -239,11 +239,11 @@ protected BoolStorage runDoubleZip(
     int n = lhs.size();
     int m = Math.min(lhs.size(), rhs.size());
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < m; ++i) {
-      if (lhs.isNa(i) || rhs.isNa(i)) {
-        missing.set(i);
+      if (lhs.isNothing(i) || rhs.isNothing(i)) {
+        isNothing.set(i);
       } else {
         double x = lhs.getItemAsDouble(i);
         double y = rhs.getItemAsDouble(i);
@@ -257,10 +257,10 @@ protected BoolStorage runDoubleZip(
     }
 
     if (m < n) {
-      missing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   protected BoolStorage runBigIntegerZip(
@@ -270,13 +270,13 @@ protected BoolStorage runBigIntegerZip(
     int n = lhs.size();
     int m = Math.min(lhs.size(), rhs.size());
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < m; ++i) {
       BigInteger x = lhs.getItem(i);
       BigInteger y = rhs.getItem(i);
       if (x == null || y == null) {
-        missing.set(i);
+        isNothing.set(i);
       } else {
         boolean r = doBigInteger(x, y);
         if (r) {
@@ -288,10 +288,10 @@ protected BoolStorage runBigIntegerZip(
     }
 
     if (m < n) {
-      missing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 
   protected BoolStorage runMixedZip(
@@ -299,13 +299,13 @@ protected BoolStorage runMixedZip(
     int n = lhs.size();
     int m = Math.min(lhs.size(), rhs.size());
     BitSet comparisonResults = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < m; ++i) {
       Object x = lhs.getItemBoxed(i);
       Object y = rhs.getItemBoxed(i);
       if (x == null || y == null) {
-        missing.set(i);
+        isNothing.set(i);
       } else {
         boolean r = false;
         // Any number is coercible to double, if the value is not coercible, it is not a supported
@@ -341,9 +341,9 @@ protected BoolStorage runMixedZip(
     }
 
     if (m < n) {
-      missing.set(m, n);
+      isNothing.set(m, n);
     }
 
-    return new BoolStorage(comparisonResults, missing, n, false);
+    return new BoolStorage(comparisonResults, isNothing, n, false);
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/BigIntegerArrayAdapter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/BigIntegerArrayAdapter.java
index 62f2bbc919c2..2d6032791dbe 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/BigIntegerArrayAdapter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/BigIntegerArrayAdapter.java
@@ -44,7 +44,7 @@ private LongStorageAsBigInteger(AbstractLongStorage storage) {
 
     @Override
     public BigInteger getItem(int i) {
-      if (storage.isNa(i)) {
+      if (storage.isNothing(i)) {
         return null;
       } else {
         long x = storage.getItem(i);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/DoubleArrayAdapter.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/DoubleArrayAdapter.java
index 628eda61b075..aa28de2128a9 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/DoubleArrayAdapter.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/numeric/helpers/DoubleArrayAdapter.java
@@ -9,7 +9,7 @@
 public interface DoubleArrayAdapter {
   double getItemAsDouble(int i);
 
-  boolean isNa(int i);
+  boolean isNothing(long i);
 
   int size();
 
@@ -49,8 +49,8 @@ public double getItemAsDouble(int i) {
     }
 
     @Override
-    public boolean isNa(int i) {
-      return storage.isNa(i);
+    public boolean isNothing(long i) {
+      return storage.isNothing(i);
     }
 
     @Override
@@ -73,7 +73,7 @@ public double getItemAsDouble(int i) {
     }
 
     @Override
-    public boolean isNa(int i) {
+    public boolean isNothing(long i) {
       return storage.getItem(i) == null;
     }
 
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/LikeOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/LikeOp.java
index eef9349eab20..ffdcde1512d2 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/LikeOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/LikeOp.java
@@ -41,24 +41,24 @@ public BoolStorage runBinaryMap(
       MapOperationProblemAggregator problemAggregator) {
     if (arg == null) {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
-      newMissing.set(0, storage.size());
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      BitSet newIsNothing = new BitSet();
+      newIsNothing.set(0, storage.size());
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     } else if (arg instanceof String argString) {
       Pattern pattern = createRegexPatternFromSql(argString);
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       Context context = Context.getCurrent();
       for (int i = 0; i < storage.size(); i++) {
-        if (storage.isNa(i)) {
-          newMissing.set(i);
+        if (storage.isNothing(i)) {
+          newIsNothing.set(i);
         } else if (pattern.matcher(storage.getItem(i)).matches()) {
           newVals.set(i);
         }
 
         context.safepoint();
       }
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     } else {
       throw new UnexpectedTypeException("a Text");
     }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringBooleanOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringBooleanOp.java
index f90c42ebb3a3..10dcad687de5 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringBooleanOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringBooleanOp.java
@@ -29,37 +29,37 @@ public BoolStorage runBinaryMap(
       MapOperationProblemAggregator problemAggregator) {
     if (arg == null) {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
-      newMissing.set(0, storage.size());
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      BitSet newIsNothing = new BitSet();
+      newIsNothing.set(0, storage.size());
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     } else if (arg instanceof String argString) {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       Context context = Context.getCurrent();
       for (int i = 0; i < storage.size(); i++) {
-        if (storage.isNa(i)) {
-          newMissing.set(i);
+        if (storage.isNothing(i)) {
+          newIsNothing.set(i);
         } else if (doString(storage.getItem(i), argString)) {
           newVals.set(i);
         }
 
         context.safepoint();
       }
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     } else {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       Context context = Context.getCurrent();
       for (int i = 0; i < storage.size(); i++) {
-        if (storage.isNa(i)) {
-          newMissing.set(i);
+        if (storage.isNothing(i)) {
+          newIsNothing.set(i);
         } else if (doObject(storage.getItem(i), arg)) {
           newVals.set(i);
         }
 
         context.safepoint();
       }
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     }
   }
 
@@ -71,24 +71,24 @@ public BoolStorage runZip(
     Context context = Context.getCurrent();
     if (arg instanceof StringStorage v) {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       for (int i = 0; i < storage.size(); i++) {
-        if (!storage.isNa(i) && i < v.size() && !v.isNa(i)) {
+        if (!storage.isNothing(i) && i < v.size() && !v.isNothing(i)) {
           if (doString(storage.getItem(i), v.getItem(i))) {
             newVals.set(i);
           }
         } else {
-          newMissing.set(i);
+          newIsNothing.set(i);
         }
 
         context.safepoint();
       }
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     } else {
       BitSet newVals = new BitSet();
-      BitSet newMissing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       for (int i = 0; i < storage.size(); i++) {
-        if (!storage.isNa(i) && i < arg.size() && !arg.isNa(i)) {
+        if (!storage.isNothing(i) && i < arg.size() && !arg.isNothing(i)) {
           Object x = arg.getItemBoxed(i);
           if (x instanceof String) {
             if (doString(storage.getItem(i), (String) x)) {
@@ -100,12 +100,12 @@ public BoolStorage runZip(
             }
           }
         } else {
-          newMissing.set(i);
+          newIsNothing.set(i);
         }
 
         context.safepoint();
       }
-      return new BoolStorage(newVals, newMissing, storage.size(), false);
+      return new BoolStorage(newVals, newIsNothing, storage.size(), false);
     }
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringLongToStringOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringLongToStringOp.java
index c58b9d5fad75..e6c784e3cf84 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringLongToStringOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringLongToStringOp.java
@@ -33,7 +33,7 @@ public Storage<?> runBinaryMap(
       String[] newVals = new String[size];
       Context context = Context.getCurrent();
       for (int i = 0; i < size; i++) {
-        if (storage.isNa(i)) {
+        if (storage.isNothing(i)) {
           newVals[i] = null;
         } else {
           newVals[i] = doOperation(storage.getItem(i), argLong);
@@ -58,7 +58,7 @@ public Storage<?> runZip(
       String[] newVals = new String[size];
       Context context = Context.getCurrent();
       for (int i = 0; i < size; i++) {
-        if (storage.isNa(i) || v.isNa(i)) {
+        if (storage.isNothing(i) || v.isNothing(i)) {
           newVals[i] = null;
         } else {
           newVals[i] = doOperation(storage.getItem(i), v.getItem(i));
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringStringOp.java b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringStringOp.java
index 893ee17db127..5638056ba7ef 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringStringOp.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/operation/map/text/StringStringOp.java
@@ -34,7 +34,7 @@ public Storage<?> runBinaryMap(
       String[] newVals = new String[size];
       Context context = Context.getCurrent();
       for (int i = 0; i < size; i++) {
-        if (storage.isNa(i)) {
+        if (storage.isNothing(i)) {
           newVals[i] = null;
         } else {
           newVals[i] = doString(storage.getItem(i), argString);
@@ -61,7 +61,7 @@ public Storage<?> runZip(
       String[] newVals = new String[size];
       Context context = Context.getCurrent();
       for (int i = 0; i < size; i++) {
-        if (storage.isNa(i) || v.isNa(i)) {
+        if (storage.isNothing(i) || v.isNothing(i)) {
           newVals[i] = null;
         } else {
           newVals[i] = doString(storage.getItem(i), v.getItem(i));
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/BoolStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/BoolStorage.java
index fd54d4d9a9c2..ea504b0ef43d 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/BoolStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/BoolStorage.java
@@ -25,21 +25,21 @@ public final class BoolStorage extends Storage<Boolean>
     implements ColumnBooleanStorage, ColumnStorageWithNothingMap {
   private static final MapOperationStorage<Boolean, BoolStorage> ops = buildOps();
   private final BitSet values;
-  private final BitSet isMissing;
+  private final BitSet isNothing;
   private final int size;
   private final boolean negated;
 
-  public BoolStorage(BitSet values, BitSet isMissing, int size, boolean negated) {
+  public BoolStorage(BitSet values, BitSet isNothing, int size, boolean negated) {
     this.values = values;
-    this.isMissing = isMissing;
+    this.isNothing = isNothing;
     this.size = size;
     this.negated = negated;
   }
 
   public static BoolStorage makeEmpty(int size) {
-    BitSet isMissing = new BitSet(size);
-    isMissing.set(0, size);
-    return new BoolStorage(new BitSet(), isMissing, size, false);
+    BitSet isNothing = new BitSet(size);
+    isNothing.set(0, size);
+    return new BoolStorage(new BitSet(), isNothing, size, false);
   }
 
   public static BoolStorage makeConstant(int size, boolean r) {
@@ -58,7 +58,7 @@ public StorageType getType() {
 
   @Override
   public Boolean getItemBoxed(int idx) {
-    return isMissing.get(idx) ? null : getItem(idx);
+    return isNothing.get(idx) ? null : getItem(idx);
   }
 
   public boolean getItem(long idx) {
@@ -66,8 +66,8 @@ public boolean getItem(long idx) {
   }
 
   @Override
-  public boolean isNa(long idx) {
-    return isMissing.get((int) idx);
+  public boolean isNothing(long idx) {
+    return isNothing.get((int) idx);
   }
 
   @Override
@@ -91,10 +91,6 @@ public BitSet getValues() {
     return values;
   }
 
-  public BitSet getIsMissing() {
-    return isMissing;
-  }
-
   /**
    * Creates a new BoolStorage in which all missing values have been replaced by arg.
    *
@@ -105,9 +101,9 @@ public BitSet getIsMissing() {
   private Storage<?> fillMissingBoolean(boolean arg) {
     final var newValues = (BitSet) values.clone();
     if (arg != negated) {
-      newValues.or(isMissing);
+      newValues.or(isNothing);
     } else {
-      newValues.andNot(isMissing);
+      newValues.andNot(isNothing);
     }
     return new BoolStorage(newValues, new BitSet(), size, negated);
   }
@@ -131,17 +127,17 @@ public Storage<?> fillMissingFromPrevious(BoolStorage missingIndicator) {
 
     boolean previousValue = false;
     boolean hasPrevious = false;
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     BitSet newValues = new BitSet();
 
     Context context = Context.getCurrent();
     for (int i = 0; i < size; i++) {
-      boolean isCurrentValueMissing = isMissing.get(i);
+      boolean isCurrentValueMissing = isNothing.get(i);
       if (isCurrentValueMissing) {
         if (hasPrevious) {
           newValues.set(i, previousValue);
         } else {
-          newMissing.set(i);
+          newIsNothing.set(i);
         }
       } else {
         boolean currentValue = getItem(i);
@@ -153,19 +149,19 @@ public Storage<?> fillMissingFromPrevious(BoolStorage missingIndicator) {
       context.safepoint();
     }
 
-    return new BoolStorage(newValues, newMissing, size, false);
+    return new BoolStorage(newValues, newIsNothing, size, false);
   }
 
   @Override
   public BoolStorage applyFilter(BitSet filterMask, int newLength) {
     Context context = Context.getCurrent();
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     BitSet newValues = new BitSet();
     int resultIx = 0;
     for (int i = 0; i < size; i++) {
       if (filterMask.get(i)) {
-        if (isMissing.get(i)) {
-          newMissing.set(resultIx++);
+        if (isNothing.get(i)) {
+          newIsNothing.set(resultIx++);
         } else if (values.get(i)) {
           newValues.set(resultIx++);
         } else {
@@ -177,7 +173,7 @@ public BoolStorage applyFilter(BitSet filterMask, int newLength) {
 
       context.safepoint();
     }
-    return new BoolStorage(newValues, newMissing, newLength, negated);
+    return new BoolStorage(newValues, newIsNothing, newLength, negated);
   }
 
   @Override
@@ -187,7 +183,7 @@ public BoolStorage applyMask(OrderMask mask) {
     BitSet newVals = new BitSet();
     for (int i = 0; i < mask.length(); i++) {
       int position = mask.get(i);
-      if (position == Storage.NOT_FOUND_INDEX || isMissing.get(position)) {
+      if (position == Storage.NOT_FOUND_INDEX || isNothing.get(position)) {
         newNa.set(i);
       } else if (values.get(position)) {
         newVals.set(i);
@@ -212,7 +208,7 @@ public Storage<?> iif(
     var on_false = makeRowProvider(when_false);
     Builder builder = Builder.getForType(resultStorageType, size, problemAggregator);
     for (int i = 0; i < size; i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.append(null);
       } else if (getItem(i)) {
         builder.append(on_true.apply(i));
@@ -250,10 +246,10 @@ public BoolStorage runBinaryMap(
                     return storage;
                   } else {
                     return new BoolStorage(
-                        storage.values, storage.isMissing, storage.size, !storage.negated);
+                        storage.values, storage.isNothing, storage.size, !storage.negated);
                   }
                 } else {
-                  return new BoolStorage(new BitSet(), storage.isMissing, storage.size, false);
+                  return new BoolStorage(new BitSet(), storage.isNothing, storage.size, false);
                 }
               }
 
@@ -264,19 +260,19 @@ public BoolStorage runZip(
                   MapOperationProblemAggregator problemAggregator) {
                 Context context = Context.getCurrent();
                 BitSet out = new BitSet();
-                BitSet missing = new BitSet();
+                BitSet isNothing = new BitSet();
                 for (int i = 0; i < storage.size; i++) {
-                  if (!storage.isNa(i) && i < arg.size() && !arg.isNa(i)) {
+                  if (!storage.isNothing(i) && i < arg.size() && !arg.isNothing(i)) {
                     if (((Boolean) storage.getItem(i)).equals(arg.getItemBoxed(i))) {
                       out.set(i);
                     }
                   } else {
-                    missing.set(i);
+                    isNothing.set(i);
                   }
 
                   context.safepoint();
                 }
-                return new BoolStorage(out, missing, storage.size, false);
+                return new BoolStorage(out, isNothing, storage.size, false);
               }
             })
         .add(
@@ -293,7 +289,7 @@ public BoolStorage runBinaryMap(
                     newMissing.xor(storage.values);
                     return new BoolStorage(storage.values, newMissing, storage.size, true);
                   } else {
-                    var newMissing = storage.isMissing.get(0, storage.size);
+                    var newMissing = storage.isNothing.get(0, storage.size);
                     newMissing.or(storage.values);
                     return new BoolStorage(new BitSet(), newMissing, storage.size, false);
                   }
@@ -332,20 +328,20 @@ public BoolStorage runZip(
                   negated = false;
                 }
 
-                BitSet missing = BitSets.makeDuplicate(storage.isMissing);
-                missing.or(v.isMissing);
-                int current = missing.nextSetBit(0);
+                BitSet isNothing = BitSets.makeDuplicate(storage.isNothing);
+                isNothing.or(v.isNothing);
+                int current = isNothing.nextSetBit(0);
                 while (current != -1) {
                   var value = negated != out.get(current);
                   if (!value
                       && (storage.getItemBoxed(current) == Boolean.FALSE
                           || v.getItemBoxed(current) == Boolean.FALSE)) {
-                    missing.clear(current);
+                    isNothing.clear(current);
                   }
-                  current = missing.nextSetBit(current + 1);
+                  current = isNothing.nextSetBit(current + 1);
                 }
 
-                return new BoolStorage(out, missing, storage.size, negated);
+                return new BoolStorage(out, isNothing, storage.size, negated);
               }
             })
         .add(
@@ -357,7 +353,7 @@ public BoolStorage runBinaryMap(
                   MapOperationProblemAggregator problemAggregator) {
                 if (arg == null) {
                   if (storage.negated) {
-                    var newMissing = storage.isMissing.get(0, storage.size);
+                    var newMissing = storage.isNothing.get(0, storage.size);
                     newMissing.or(storage.values);
                     return new BoolStorage(new BitSet(), newMissing, storage.size, true);
                   } else {
@@ -402,20 +398,20 @@ public BoolStorage runZip(
                   negated = false;
                 }
 
-                BitSet missing = BitSets.makeDuplicate(storage.isMissing);
-                missing.or(v.isMissing);
-                int current = missing.nextSetBit(0);
+                BitSet isNothing = BitSets.makeDuplicate(storage.isNothing);
+                isNothing.or(v.isNothing);
+                int current = isNothing.nextSetBit(0);
                 while (current != -1) {
                   var value = negated != out.get(current);
                   if (value
                       && (storage.getItemBoxed(current) == Boolean.TRUE
                           || v.getItemBoxed(current) == Boolean.TRUE)) {
-                    missing.clear(current);
+                    isNothing.clear(current);
                   }
-                  current = missing.nextSetBit(current + 1);
+                  current = isNothing.nextSetBit(current + 1);
                 }
 
-                return new BoolStorage(out, missing, storage.size, negated);
+                return new BoolStorage(out, isNothing, storage.size, negated);
               }
             })
         .add(new BooleanIsInOp());
@@ -429,7 +425,7 @@ public static BitSet toMask(BoolStorage storage) {
     if (storage.isNegated()) {
       mask.flip(0, storage.size());
     }
-    mask.andNot(storage.getIsMissing());
+    mask.andNot(storage.getIsNothingMap());
     return mask;
   }
 
@@ -438,16 +434,16 @@ public BoolStorage slice(int offset, int limit) {
     int newSize = Math.min(size - offset, limit);
     return new BoolStorage(
         values.get(offset, offset + limit),
-        isMissing.get(offset, offset + limit),
+        isNothing.get(offset, offset + limit),
         newSize,
         negated);
   }
 
   @Override
   public Storage<?> appendNulls(int count) {
-    BitSet newMissing = BitSets.makeDuplicate(isMissing);
-    newMissing.set(size, size + count);
-    return new BoolStorage(values, newMissing, size + count, negated);
+    BitSet isNothing = BitSets.makeDuplicate(this.isNothing);
+    isNothing.set(size, size + count);
+    return new BoolStorage(values, isNothing, size + count, negated);
   }
 
   @Override
@@ -455,24 +451,24 @@ public BoolStorage slice(List<SliceRange> ranges) {
     Context context = Context.getCurrent();
     int newSize = SliceRange.totalLength(ranges);
     BitSet newValues = new BitSet(newSize);
-    BitSet newMissing = new BitSet(newSize);
+    BitSet newIsNothing = new BitSet(newSize);
     int offset = 0;
     for (SliceRange range : ranges) {
       int length = range.end() - range.start();
       for (int i = 0; i < length; ++i) {
         newValues.set(offset + i, values.get(range.start() + i));
-        newMissing.set(offset + i, isMissing.get(range.start() + i));
+        newIsNothing.set(offset + i, isNothing.get(range.start() + i));
         context.safepoint();
       }
       offset += length;
     }
 
-    return new BoolStorage(newValues, newMissing, newSize, negated);
+    return new BoolStorage(newValues, newIsNothing, newSize, negated);
   }
 
   @Override
   public BitSet getIsNothingMap() {
-    return isMissing;
+    return isNothing;
   }
 
   @Override
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/ColumnStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/ColumnStorage.java
index 04988201b678..362503ce27b5 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/ColumnStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/ColumnStorage.java
@@ -10,7 +10,12 @@ public interface ColumnStorage {
   /* Gets the value type of the storage. */
   StorageType getType();
 
-  /* Gets if a value is Nothing at a given index. */
+  /**
+   * Checks whether the value at idx is Nothing.
+   *
+   * @param index – the index to check.
+   * @return whether the value is Nothing.
+   */
   boolean isNothing(long index);
 
   /* Gets the value at a given index. */
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/MixedStorageFacade.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/MixedStorageFacade.java
index e66678a0bb32..aa728f3b8f34 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/MixedStorageFacade.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/MixedStorageFacade.java
@@ -42,8 +42,8 @@ public StorageType inferPreciseTypeShrunk() {
   }
 
   @Override
-  public boolean isNa(long idx) {
-    return underlyingStorage.isNa(idx);
+  public boolean isNothing(long idx) {
+    return underlyingStorage.isNothing(idx);
   }
 
   @Override
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/SpecializedStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/SpecializedStorage.java
index f149dc1d7349..53e057963939 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/SpecializedStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/SpecializedStorage.java
@@ -56,11 +56,8 @@ public T getItemBoxed(int idx) {
     return data[idx];
   }
 
-  /**
-   * @inheritDoc
-   */
   @Override
-  public boolean isNa(long idx) {
+  public boolean isNothing(long idx) {
     return data[(int) idx] == null;
   }
 
@@ -157,7 +154,7 @@ public Storage<T> fillMissingFromPrevious(BoolStorage missingIndicator) {
     Context context = Context.getCurrent();
     for (int i = 0; i < size; i++) {
       boolean isCurrentValueMissing =
-          missingIndicator == null ? isNa(i) : missingIndicator.getItem(i);
+          missingIndicator == null ? isNothing(i) : missingIndicator.getItem(i);
       if (!isCurrentValueMissing) {
         previous = data[i];
         hasPrevious = true;
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/Storage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/Storage.java
index 3df2b2f6a35c..cde141dcd583 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/Storage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/Storage.java
@@ -28,9 +28,12 @@ public abstract class Storage<T> implements ColumnStorage {
    */
   public abstract int size();
 
-  /**
-   * @return the type tag of this column's storage.
-   */
+  @Override
+  public long getSize() {
+    return size();
+  }
+
+  @Override
   public abstract StorageType getType();
 
   /**
@@ -64,13 +67,8 @@ public Storage<?> tryGettingMoreSpecializedStorage() {
     return this;
   }
 
-  /**
-   * Checks whether the value at {@code idx} is missing.
-   *
-   * @param idx the index to check.
-   * @return whether or not the value is missing.
-   */
-  public abstract boolean isNa(long idx);
+  @Override
+  public abstract boolean isNothing(long index);
 
   /**
    * Returns a boxed representation of an item. Missing values are denoted with null.
@@ -356,7 +354,7 @@ public Storage<?> fillMissingFrom(
     var builder = Builder.getForType(commonType, size(), problemAggregator);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isNa(i)) {
+      if (isNothing(i)) {
         builder.appendNoGrow(other.getItemBoxed(i));
       } else {
         builder.appendNoGrow(getItemBoxed(i));
@@ -441,16 +439,6 @@ public final Storage<?> cast(
     return converter.cast(this, castProblemAggregator);
   }
 
-  @Override
-  public long getSize() {
-    return size();
-  }
-
-  @Override
-  public boolean isNothing(long index) {
-    return isNa(index);
-  }
-
   @Override
   public Object getItemAsObject(long index) {
     return getItemBoxed((int) index);
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/StringStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/StringStorage.java
index 4a18de32d9ad..4a77e2104d0a 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/StringStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/StringStorage.java
@@ -54,18 +54,18 @@ public BoolStorage runBinaryMap(
               Object arg,
               MapOperationProblemAggregator problemAggregator) {
             BitSet r = new BitSet();
-            BitSet missing = new BitSet();
+            BitSet isNothing = new BitSet();
             Context context = Context.getCurrent();
             for (int i = 0; i < storage.size(); i++) {
               if (storage.getItem(i) == null || arg == null) {
-                missing.set(i);
+                isNothing.set(i);
               } else if (arg instanceof String s && Text_Utils.equals(storage.getItem(i), s)) {
                 r.set(i);
               }
 
               context.safepoint();
             }
-            return new BoolStorage(r, missing, storage.size(), false);
+            return new BoolStorage(r, isNothing, storage.size(), false);
           }
 
           @Override
@@ -74,11 +74,11 @@ public BoolStorage runZip(
               Storage<?> arg,
               MapOperationProblemAggregator problemAggregator) {
             BitSet r = new BitSet();
-            BitSet missing = new BitSet();
+            BitSet isNothing = new BitSet();
             Context context = Context.getCurrent();
             for (int i = 0; i < storage.size(); i++) {
-              if (storage.getItem(i) == null || i >= arg.size() || arg.isNa(i)) {
-                missing.set(i);
+              if (storage.getItem(i) == null || i >= arg.size() || arg.isNothing(i)) {
+                isNothing.set(i);
               } else if (arg.getItemBoxed(i) instanceof String s
                   && Text_Utils.equals(storage.getItem(i), s)) {
                 r.set(i);
@@ -86,7 +86,7 @@ public BoolStorage runZip(
 
               context.safepoint();
             }
-            return new BoolStorage(r, missing, storage.size(), false);
+            return new BoolStorage(r, isNothing, storage.size(), false);
           }
         });
     t.add(
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/AbstractLongStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/AbstractLongStorage.java
index 954a778e7418..bd4717dc334e 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/AbstractLongStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/AbstractLongStorage.java
@@ -25,8 +25,6 @@ public abstract class AbstractLongStorage extends NumericStorage<Long>
     implements ColumnLongStorage, ColumnStorageWithNothingMap {
   public abstract long getItem(int idx);
 
-  public abstract BitSet getIsMissing();
-
   private static final MapOperationStorage<Long, AbstractLongStorage> ops = buildOps();
 
   @Override
@@ -84,7 +82,7 @@ public StorageType inferPreciseTypeShrunk() {
     int n = size();
     Context context = Context.getCurrent();
     for (int i = 0; i < n; i++) {
-      if (isNa(i)) {
+      if (isNothing(i)) {
         continue;
       }
 
@@ -130,18 +128,18 @@ public AbstractLongStorage fillMissingFromPrevious(BoolStorage missingIndicator)
 
     int n = size();
     long[] newData = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long previousValue = 0;
     boolean hasPrevious = false;
 
     Context context = Context.getCurrent();
     for (int i = 0; i < n; i++) {
-      boolean isCurrentMissing = isNa(i);
-      if (isCurrentMissing) {
+      boolean isCurrentNothing = isNothing(i);
+      if (isCurrentNothing) {
         if (hasPrevious) {
           newData[i] = previousValue;
         } else {
-          newMissing.set(i);
+          newIsNothing.set(i);
         }
       } else {
         long currentValue = getItem(i);
@@ -153,7 +151,7 @@ public AbstractLongStorage fillMissingFromPrevious(BoolStorage missingIndicator)
       context.safepoint();
     }
 
-    return new LongStorage(newData, n, newMissing, getType());
+    return new LongStorage(newData, n, newIsNothing, getType());
   }
 
   /**
@@ -172,7 +170,5 @@ public long get(long index) throws ValueIsNothingException {
   }
 
   @Override
-  public BitSet getIsNothingMap() {
-    return getIsMissing();
-  }
+  public abstract BitSet getIsNothingMap();
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedLongStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedLongStorage.java
index 02e9d6776a75..774397997bd2 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedLongStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedLongStorage.java
@@ -33,7 +33,7 @@ public IntegerType getType() {
   }
 
   @Override
-  public boolean isNa(long idx) {
+  public boolean isNothing(long idx) {
     return false;
   }
 
@@ -51,14 +51,9 @@ public long getItem(int idx) {
     return computeItem(idx);
   }
 
-  @Override
-  public BitSet getIsMissing() {
-    return EMPTY;
-  }
-
   @Override
   public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long[] newData = new long[newLength];
     int resIx = 0;
     Context context = Context.getCurrent();
@@ -69,25 +64,25 @@ public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
 
       context.safepoint();
     }
-    return new LongStorage(newData, newLength, newMissing, getType());
+    return new LongStorage(newData, newLength, newIsNothing, getType());
   }
 
   @Override
   public Storage<Long> applyMask(OrderMask mask) {
     long[] newData = new long[mask.length()];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < mask.length(); i++) {
       int position = mask.get(i);
       if (position == Storage.NOT_FOUND_INDEX) {
-        newMissing.set(i);
+        newIsNothing.set(i);
       } else {
         newData[i] = getItem(position);
       }
 
       context.safepoint();
     }
-    return new LongStorage(newData, newData.length, newMissing, getType());
+    return new LongStorage(newData, newData.length, newIsNothing, getType());
   }
 
   @Override
@@ -107,7 +102,7 @@ public Storage<Long> slice(int offset, int limit) {
   public Storage<Long> slice(List<SliceRange> ranges) {
     int newSize = SliceRange.totalLength(ranges);
     long[] newData = new long[newSize];
-    BitSet newMissing = new BitSet(newSize);
+    BitSet newIsNothing = new BitSet(newSize);
     int offset = 0;
     Context context = Context.getCurrent();
     for (SliceRange range : ranges) {
@@ -120,7 +115,7 @@ public Storage<Long> slice(List<SliceRange> ranges) {
       offset += length;
     }
 
-    return new LongStorage(newData, newSize, newMissing, getType());
+    return new LongStorage(newData, newSize, newIsNothing, getType());
   }
 
   private static final BitSet EMPTY = new BitSet();
@@ -148,4 +143,9 @@ protected Long computeItem(int idx) {
       }
     };
   }
+
+  @Override
+  public BitSet getIsNothingMap() {
+    return EMPTY;
+  }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedNullableLongStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedNullableLongStorage.java
index 3244197eb4b8..8cbefdc2525f 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedNullableLongStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/ComputedNullableLongStorage.java
@@ -17,7 +17,7 @@
 public abstract class ComputedNullableLongStorage extends AbstractLongStorage {
   protected final int size;
 
-  protected BitSet isMissing = null;
+  protected BitSet isNothing = null;
 
   protected abstract Long computeItem(int idx);
 
@@ -36,7 +36,7 @@ public IntegerType getType() {
   }
 
   @Override
-  public boolean isNa(long idx) {
+  public boolean isNothing(long idx) {
     if (idx < 0 || idx >= size) {
       throw new IndexOutOfBoundsException(
           "Index " + idx + " is out of bounds for range of length " + size + ".");
@@ -60,26 +60,26 @@ public long getItem(int idx) {
   }
 
   @Override
-  public BitSet getIsMissing() {
-    if (isMissing == null) {
+  public BitSet getIsNothingMap() {
+    if (isNothing == null) {
       // Only compute once as needed.
-      BitSet missing = new BitSet();
+      BitSet newIsNothing = new BitSet();
       Context context = Context.getCurrent();
       for (int i = 0; i < size; i++) {
         if (computeItem(i) == null) {
-          missing.set(i);
+          newIsNothing.set(i);
         }
 
         context.safepoint();
       }
-      isMissing = missing;
+      isNothing = newIsNothing;
     }
-    return isMissing;
+    return isNothing;
   }
 
   @Override
   public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long[] newData = new long[newLength];
     int resIx = 0;
     Context context = Context.getCurrent();
@@ -87,7 +87,7 @@ public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
       if (filterMask.get(i)) {
         Long item = computeItem(i);
         if (item == null) {
-          newMissing.set(resIx++);
+          newIsNothing.set(resIx++);
         } else {
           newData[resIx++] = item;
         }
@@ -95,22 +95,22 @@ public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
 
       context.safepoint();
     }
-    return new LongStorage(newData, newLength, newMissing, getType());
+    return new LongStorage(newData, newLength, newIsNothing, getType());
   }
 
   @Override
   public Storage<Long> applyMask(OrderMask mask) {
     long[] newData = new long[mask.length()];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < mask.length(); i++) {
       int position = mask.get(i);
       if (position == Storage.NOT_FOUND_INDEX) {
-        newMissing.set(i);
+        newIsNothing.set(i);
       } else {
         Long item = computeItem(position);
         if (item == null) {
-          newMissing.set(i);
+          newIsNothing.set(i);
         } else {
           newData[i] = item;
         }
@@ -118,32 +118,32 @@ public Storage<Long> applyMask(OrderMask mask) {
 
       context.safepoint();
     }
-    return new LongStorage(newData, newData.length, newMissing, getType());
+    return new LongStorage(newData, newData.length, newIsNothing, getType());
   }
 
   @Override
   public Storage<Long> slice(int offset, int limit) {
     int newSize = Math.min(size - offset, limit);
     long[] newData = new long[newSize];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < newSize; i++) {
       Long item = computeItem(offset + i);
       if (item == null) {
-        newMissing.set(i);
+        newIsNothing.set(i);
       } else {
         newData[i] = item;
       }
       context.safepoint();
     }
-    return new LongStorage(newData, newSize, newMissing, getType());
+    return new LongStorage(newData, newSize, newIsNothing, getType());
   }
 
   @Override
   public Storage<Long> slice(List<SliceRange> ranges) {
     int newSize = SliceRange.totalLength(ranges);
     long[] newData = new long[newSize];
-    BitSet newMissing = new BitSet(newSize);
+    BitSet newIsNothing = new BitSet(newSize);
     int offset = 0;
     Context context = Context.getCurrent();
     for (SliceRange range : ranges) {
@@ -152,7 +152,7 @@ public Storage<Long> slice(List<SliceRange> ranges) {
       for (int i = 0; i < length; i++) {
         Long item = computeItem(rangeStart + i);
         if (item == null) {
-          newMissing.set(offset + i);
+          newIsNothing.set(offset + i);
         } else {
           newData[offset + i] = item;
         }
@@ -161,7 +161,7 @@ public Storage<Long> slice(List<SliceRange> ranges) {
       offset += length;
     }
 
-    return new LongStorage(newData, newSize, newMissing, getType());
+    return new LongStorage(newData, newSize, newIsNothing, getType());
   }
 
   @Override
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/DoubleStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/DoubleStorage.java
index c21e32d56ed5..01f92b3b18df 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/DoubleStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/DoubleStorage.java
@@ -37,26 +37,26 @@
 public final class DoubleStorage extends NumericStorage<Double>
     implements DoubleArrayAdapter, ColumnStorageWithNothingMap {
   private final long[] data;
-  private final BitSet isMissing;
+  private final BitSet isNothing;
   private final int size;
   private static final MapOperationStorage<Double, DoubleStorage> ops = buildOps();
 
   /**
    * @param data the underlying data
    * @param size the number of items stored
-   * @param isMissing a bit set denoting at index {@code i} whether the value at index {@code i} is
-   *     missing.
+   * @param isNothing a bit set denoting at index {@code i} whether the value at index {@code i} is
+   *     Nothing.
    */
-  public DoubleStorage(long[] data, int size, BitSet isMissing) {
+  public DoubleStorage(long[] data, int size, BitSet isNothing) {
     this.data = data;
-    this.isMissing = isMissing;
+    this.isNothing = isNothing;
     this.size = size;
   }
 
   public static DoubleStorage makeEmpty(int size) {
-    BitSet isMissing = new BitSet(size);
-    isMissing.set(0, size);
-    return new DoubleStorage(new long[0], size, isMissing);
+    BitSet isNothing = new BitSet(size);
+    isNothing.set(0, size);
+    return new DoubleStorage(new long[0], size, isNothing);
   }
 
   /**
@@ -77,7 +77,7 @@ public double getItem(long idx) {
 
   @Override
   public Double getItemBoxed(int idx) {
-    return isMissing.get(idx) ? null : Double.longBitsToDouble(data[idx]);
+    return isNothing.get(idx) ? null : Double.longBitsToDouble(data[idx]);
   }
 
   /**
@@ -92,8 +92,8 @@ public StorageType getType() {
    * @inheritDoc
    */
   @Override
-  public boolean isNa(long idx) {
-    return isMissing.get((int) idx);
+  public boolean isNothing(long idx) {
+    return isNothing.get((int) idx);
   }
 
   @Override
@@ -101,11 +101,6 @@ public double getItemAsDouble(int i) {
     return Double.longBitsToDouble(data[i]);
   }
 
-  @Override
-  public boolean isNa(int i) {
-    return isMissing.get(i);
-  }
-
   @Override
   public boolean isBinaryOpVectorized(String op) {
     return ops.isSupportedBinary(op);
@@ -142,7 +137,7 @@ private Storage<?> fillMissingDouble(double arg, ProblemAggregator problemAggreg
     long rawArg = Double.doubleToRawLongBits(arg);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendRawNoGrow(rawArg);
       } else {
         builder.appendRawNoGrow(data[i]);
@@ -158,7 +153,7 @@ private Storage<?> fillMissingBigInteger(BigInteger arg, ProblemAggregator probl
     final var builder = NumericBuilder.createDoubleBuilder(size(), problemAggregator);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendBigInteger(arg);
       } else {
         builder.appendRawNoGrow(data[i]);
@@ -174,7 +169,7 @@ private Storage<?> fillMissingLong(long arg, ProblemAggregator problemAggregator
     final var builder = NumericBuilder.createDoubleBuilder(size(), problemAggregator);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendLong(arg);
       } else {
         builder.appendRawNoGrow(data[i]);
@@ -210,18 +205,18 @@ public DoubleStorage fillMissingFromPrevious(BoolStorage missingIndicator) {
 
     int n = size();
     long[] newData = new long[n];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long previousValueRaw = 0;
     boolean hasPrevious = false;
 
     Context context = Context.getCurrent();
     for (int i = 0; i < n; i++) {
-      boolean isCurrentMissing = isNa(i);
+      boolean isCurrentMissing = isNothing(i);
       if (isCurrentMissing) {
         if (hasPrevious) {
           newData[i] = previousValueRaw;
         } else {
-          newMissing.set(i);
+          newIsNothing.set(i);
         }
       } else {
         long currentValueRaw = data[i];
@@ -233,19 +228,19 @@ public DoubleStorage fillMissingFromPrevious(BoolStorage missingIndicator) {
       context.safepoint();
     }
 
-    return new DoubleStorage(newData, n, newMissing);
+    return new DoubleStorage(newData, n, newIsNothing);
   }
 
   @Override
   public Storage<Double> applyFilter(BitSet filterMask, int newLength) {
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long[] newData = new long[newLength];
     int resIx = 0;
     Context context = Context.getCurrent();
     for (int i = 0; i < size; i++) {
       if (filterMask.get(i)) {
-        if (isMissing.get(i)) {
-          newMissing.set(resIx++);
+        if (isNothing.get(i)) {
+          newIsNothing.set(resIx++);
         } else {
           newData[resIx++] = data[i];
         }
@@ -253,29 +248,25 @@ public Storage<Double> applyFilter(BitSet filterMask, int newLength) {
 
       context.safepoint();
     }
-    return new DoubleStorage(newData, newLength, newMissing);
+    return new DoubleStorage(newData, newLength, newIsNothing);
   }
 
   @Override
   public Storage<Double> applyMask(OrderMask mask) {
     long[] newData = new long[mask.length()];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < mask.length(); i++) {
       int position = mask.get(i);
-      if (position == Storage.NOT_FOUND_INDEX || isMissing.get(position)) {
-        newMissing.set(i);
+      if (position == Storage.NOT_FOUND_INDEX || isNothing.get(position)) {
+        newIsNothing.set(i);
       } else {
         newData[i] = data[position];
       }
 
       context.safepoint();
     }
-    return new DoubleStorage(newData, newData.length, newMissing);
-  }
-
-  public BitSet getIsMissing() {
-    return isMissing;
+    return new DoubleStorage(newData, newData.length, newIsNothing);
   }
 
   public long[] getRawData() {
@@ -305,38 +296,38 @@ public Storage<Double> slice(int offset, int limit) {
     int newSize = Math.min(size - offset, limit);
     long[] newData = new long[newSize];
     System.arraycopy(data, offset, newData, 0, newSize);
-    BitSet newMask = isMissing.get(offset, offset + limit);
+    BitSet newMask = isNothing.get(offset, offset + limit);
     return new DoubleStorage(newData, newSize, newMask);
   }
 
   @Override
   public DoubleStorage appendNulls(int count) {
-    BitSet newMissing = BitSets.makeDuplicate(isMissing);
-    newMissing.set(size, size + count);
+    BitSet newIsNothing = BitSets.makeDuplicate(isNothing);
+    newIsNothing.set(size, size + count);
 
     long[] newData = new long[size + count];
     System.arraycopy(data, 0, newData, 0, size);
-    return new DoubleStorage(newData, size + count, newMissing);
+    return new DoubleStorage(newData, size + count, newIsNothing);
   }
 
   @Override
   public Storage<Double> slice(List<SliceRange> ranges) {
     int newSize = SliceRange.totalLength(ranges);
     long[] newData = new long[newSize];
-    BitSet newMissing = new BitSet(newSize);
+    BitSet newIsNothing = new BitSet(newSize);
     int offset = 0;
     Context context = Context.getCurrent();
     for (SliceRange range : ranges) {
       int length = range.end() - range.start();
       System.arraycopy(data, range.start(), newData, offset, length);
       for (int i = 0; i < length; ++i) {
-        newMissing.set(offset + i, isMissing.get(range.start() + i));
+        newIsNothing.set(offset + i, isNothing.get(range.start() + i));
         context.safepoint();
       }
       offset += length;
     }
 
-    return new DoubleStorage(newData, newSize, newMissing);
+    return new DoubleStorage(newData, newSize, newIsNothing);
   }
 
   private StorageType inferredType = null;
@@ -347,7 +338,7 @@ public StorageType inferPreciseType() {
       boolean areAllIntegers = true;
       int visitedNumbers = 0;
       for (int i = 0; i < size; i++) {
-        if (isMissing.get(i)) {
+        if (isNothing.get(i)) {
           continue;
         }
 
@@ -388,7 +379,7 @@ private StorageType findSmallestIntegerTypeThatFits() {
         new ComputedNullableLongStorage(size) {
           @Override
           protected Long computeItem(int idx) {
-            if (parent.isNa(idx)) {
+            if (parent.isNothing(idx)) {
               return null;
             }
 
@@ -405,6 +396,6 @@ protected Long computeItem(int idx) {
 
   @Override
   public BitSet getIsNothingMap() {
-    return isMissing;
+    return isNothing;
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/LongStorage.java b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/LongStorage.java
index e143ee19b7bc..a30332d64c0b 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/LongStorage.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/column/storage/numeric/LongStorage.java
@@ -22,7 +22,7 @@ public final class LongStorage extends AbstractLongStorage {
   // for more compact storage and more efficient handling of smaller integers; for now we will be
   // handling this just by checking the bounds
   private final long[] data;
-  private final BitSet isMissing;
+  private final BitSet isNothing;
   private final int size;
 
   private final IntegerType type;
@@ -30,13 +30,13 @@ public final class LongStorage extends AbstractLongStorage {
   /**
    * @param data the underlying data
    * @param size the number of items stored
-   * @param isMissing a bit set denoting at index {@code i} whether or not the value at index {@code
+   * @param isNothing a bit set denoting at index {@code i} whether or not the value at index {@code
    *     i} is missing.
    * @param type the type specifying the bit-width of integers that are allowed in this storage
    */
-  public LongStorage(long[] data, int size, BitSet isMissing, IntegerType type) {
+  public LongStorage(long[] data, int size, BitSet isNothing, IntegerType type) {
     this.data = data;
-    this.isMissing = isMissing;
+    this.isNothing = isNothing;
     this.size = size;
     this.type = type;
   }
@@ -46,9 +46,9 @@ public static LongStorage fromArray(long[] data) {
   }
 
   public static LongStorage makeEmpty(int size, IntegerType type) {
-    BitSet isMissing = new BitSet(size);
-    isMissing.set(0, size);
-    return new LongStorage(new long[0], size, isMissing, type);
+    BitSet isNothing = new BitSet(size);
+    isNothing.set(0, size);
+    return new LongStorage(new long[0], size, isNothing, type);
   }
 
   public LongStorage(long[] data, IntegerType type) {
@@ -73,7 +73,7 @@ public long getItem(int idx) {
 
   @Override
   public Long getItemBoxed(int idx) {
-    return isMissing.get(idx) ? null : data[idx];
+    return isNothing.get(idx) ? null : data[idx];
   }
 
   /**
@@ -88,8 +88,8 @@ public IntegerType getType() {
    * @inheritDoc
    */
   @Override
-  public boolean isNa(long idx) {
-    return isMissing.get((int) idx);
+  public boolean isNothing(long idx) {
+    return isNothing.get((int) idx);
   }
 
   private Storage<?> fillMissingDouble(double arg, ProblemAggregator problemAggregator) {
@@ -97,7 +97,7 @@ private Storage<?> fillMissingDouble(double arg, ProblemAggregator problemAggreg
     long rawArg = Double.doubleToRawLongBits(arg);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendRawNoGrow(rawArg);
       } else {
         double coerced = data[i];
@@ -115,7 +115,7 @@ private Storage<?> fillMissingLong(long arg, ProblemAggregator problemAggregator
         NumericBuilder.createLongBuilder(size, IntegerType.INT_64, problemAggregator);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendRawNoGrow(arg);
       } else {
         builder.appendRawNoGrow(data[i]);
@@ -132,7 +132,7 @@ private Storage<?> fillMissingBigInteger(
     final var builder = new BigIntegerBuilder(size, problemAggregator);
     Context context = Context.getCurrent();
     for (int i = 0; i < size(); i++) {
-      if (isMissing.get(i)) {
+      if (isNothing.get(i)) {
         builder.appendRawNoGrow(bigInteger);
       } else {
         builder.appendRawNoGrow(BigInteger.valueOf(data[i]));
@@ -162,14 +162,14 @@ public Storage<?> fillMissing(
 
   @Override
   public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     long[] newData = new long[newLength];
     int resIx = 0;
     Context context = Context.getCurrent();
     for (int i = 0; i < size; i++) {
       if (filterMask.get(i)) {
-        if (isMissing.get(i)) {
-          newMissing.set(resIx++);
+        if (isNothing.get(i)) {
+          newIsNothing.set(resIx++);
         } else {
           newData[resIx++] = data[i];
         }
@@ -177,30 +177,30 @@ public Storage<Long> applyFilter(BitSet filterMask, int newLength) {
 
       context.safepoint();
     }
-    return new LongStorage(newData, newLength, newMissing, type);
+    return new LongStorage(newData, newLength, newIsNothing, type);
   }
 
   @Override
   public Storage<Long> applyMask(OrderMask mask) {
     long[] newData = new long[mask.length()];
-    BitSet newMissing = new BitSet();
+    BitSet newIsNothing = new BitSet();
     Context context = Context.getCurrent();
     for (int i = 0; i < mask.length(); i++) {
       int position = mask.get(i);
-      if (position == Storage.NOT_FOUND_INDEX || isMissing.get(position)) {
-        newMissing.set(i);
+      if (position == Storage.NOT_FOUND_INDEX || isNothing.get(position)) {
+        newIsNothing.set(i);
       } else {
         newData[i] = data[position];
       }
 
       context.safepoint();
     }
-    return new LongStorage(newData, newData.length, newMissing, type);
+    return new LongStorage(newData, newData.length, newIsNothing, type);
   }
 
   @Override
-  public BitSet getIsMissing() {
-    return isMissing;
+  public BitSet getIsNothingMap() {
+    return isNothing;
   }
 
   public long[] getRawData() {
@@ -212,43 +212,43 @@ public LongStorage slice(int offset, int limit) {
     int newSize = Math.min(size - offset, limit);
     long[] newData = new long[newSize];
     System.arraycopy(data, offset, newData, 0, newSize);
-    BitSet newMask = isMissing.get(offset, offset + limit);
+    BitSet newMask = isNothing.get(offset, offset + limit);
     return new LongStorage(newData, newSize, newMask, type);
   }
 
   @Override
   public LongStorage appendNulls(int count) {
-    BitSet newMissing = BitSets.makeDuplicate(isMissing);
-    newMissing.set(size, size + count);
+    BitSet newIsNothing = BitSets.makeDuplicate(isNothing);
+    newIsNothing.set(size, size + count);
     long[] newData = new long[size + count];
     System.arraycopy(data, 0, newData, 0, size);
-    return new LongStorage(newData, size + count, newMissing, type);
+    return new LongStorage(newData, size + count, newIsNothing, type);
   }
 
   @Override
   public LongStorage slice(List<SliceRange> ranges) {
     int newSize = SliceRange.totalLength(ranges);
     long[] newData = new long[newSize];
-    BitSet newMissing = new BitSet(newSize);
+    BitSet newIsNothing = new BitSet(newSize);
     int offset = 0;
     Context context = Context.getCurrent();
     for (SliceRange range : ranges) {
       int length = range.end() - range.start();
       System.arraycopy(data, range.start(), newData, offset, length);
       for (int i = 0; i < length; ++i) {
-        newMissing.set(offset + i, isMissing.get(range.start() + i));
+        newIsNothing.set(offset + i, isNothing.get(range.start() + i));
         context.safepoint();
       }
       offset += length;
     }
 
-    return new LongStorage(newData, newSize, newMissing, type);
+    return new LongStorage(newData, newSize, newIsNothing, type);
   }
 
   /** Widening to a bigger type can be done without copying the data. */
   @Override
   public LongStorage widen(IntegerType widerType) {
     assert widerType.fits(type);
-    return new LongStorage(data, size, isMissing, widerType);
+    return new LongStorage(data, size, isNothing, widerType);
   }
 }
diff --git a/std-bits/table/src/main/java/org/enso/table/data/index/MultiValueKeyBase.java b/std-bits/table/src/main/java/org/enso/table/data/index/MultiValueKeyBase.java
index e8ad683ac08c..db594a201637 100644
--- a/std-bits/table/src/main/java/org/enso/table/data/index/MultiValueKeyBase.java
+++ b/std-bits/table/src/main/java/org/enso/table/data/index/MultiValueKeyBase.java
@@ -50,7 +50,7 @@ public int getNumberOfColumns() {
   /** Checks if all cells in the current row are missing. */
   public boolean areAllNull() {
     for (Storage<?> storage : storages) {
-      if (!storage.isNa(rowIndex)) {
+      if (!storage.isNothing(rowIndex)) {
         return false;
       }
     }
@@ -60,7 +60,7 @@ public boolean areAllNull() {
   /** Checks if any cells in the current row are missing. */
   public boolean hasAnyNulls() {
     for (Storage<?> storage : storages) {
-      if (storage.isNa(rowIndex)) {
+      if (storage.isNothing(rowIndex)) {
         return true;
       }
     }
diff --git a/std-bits/table/src/main/java/org/enso/table/write/ExcelWriter.java b/std-bits/table/src/main/java/org/enso/table/write/ExcelWriter.java
index 963e68070907..cfc2c698c707 100644
--- a/std-bits/table/src/main/java/org/enso/table/write/ExcelWriter.java
+++ b/std-bits/table/src/main/java/org/enso/table/write/ExcelWriter.java
@@ -489,7 +489,7 @@ private static CellStyle getDateTimeStyle(Workbook workbook, String format) {
 
   private static void writeValueToCell(Cell cell, int j, Storage<?> storage, Workbook workbook)
       throws IllegalStateException {
-    if (storage.isNa(j)) {
+    if (storage.isNothing(j)) {
       cell.setBlank();
     } else if (storage instanceof DoubleStorage doubleStorage) {
       cell.setCellValue(doubleStorage.getItemAsDouble(j));
diff --git a/test/Base_Tests/polyglot-sources/enso-test-java-helpers/src/main/java/org/enso/table_test_helpers/ExplodingStorage.java b/test/Base_Tests/polyglot-sources/enso-test-java-helpers/src/main/java/org/enso/table_test_helpers/ExplodingStorage.java
index bbee33be42fc..865f111c439c 100644
--- a/test/Base_Tests/polyglot-sources/enso-test-java-helpers/src/main/java/org/enso/table_test_helpers/ExplodingStorage.java
+++ b/test/Base_Tests/polyglot-sources/enso-test-java-helpers/src/main/java/org/enso/table_test_helpers/ExplodingStorage.java
@@ -40,7 +40,7 @@ public StorageType getType() {
   }
 
   @Override
-  public boolean isNa(long idx) {
+  public boolean isNothing(long idx) {
     checkIndex(idx);
     return false;
   }
diff --git a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/LongNullHandling.java b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/LongNullHandling.java
index 32a6287d0341..8c820c1bcb6b 100644
--- a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/LongNullHandling.java
+++ b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/LongNullHandling.java
@@ -23,15 +23,15 @@ public LongStorage run(
         LongStorage storage, LongStorage arg, MapOperationProblemAggregator problemAggregator) {
       int n = storage.size();
       long[] newVals = new long[n];
-      BitSet missing = new BitSet();
+      BitSet isNothing = new BitSet();
       for (int i = 0; i < n; i++) {
-        if (storage.isNa(i) || arg.isNa(i)) {
-          missing.set(i);
+        if (storage.isNothing(i) || arg.isNothing(i)) {
+          isNothing.set(i);
         } else {
           newVals[i] = doLong(storage.getItem(i), arg.getItem(i), i, problemAggregator);
         }
       }
-      return new LongStorage(newVals, n, missing, IntegerType.INT_64);
+      return new LongStorage(newVals, n, isNothing, IntegerType.INT_64);
     }
   }
 
@@ -45,20 +45,20 @@ public LongStorage run(
         LongStorage storage, LongStorage arg, MapOperationProblemAggregator problemAggregator) {
       int n = storage.size();
       long[] newVals = new long[n];
-      BitSet missing = new BitSet();
+      BitSet isNothing = new BitSet();
       for (int i = 0; i < n; i++) {
-        if (storage.isNa(i) || arg.isNa(i)) {
-          missing.set(i);
+        if (storage.isNothing(i) || arg.isNothing(i)) {
+          isNothing.set(i);
         } else {
           Long x = doLong(storage.getItem(i), arg.getItem(i), i, problemAggregator);
           if (x == null) {
-            missing.set(i);
+            isNothing.set(i);
           } else {
             newVals[i] = x;
           }
         }
       }
-      return new LongStorage(newVals, n, missing, IntegerType.INT_64);
+      return new LongStorage(newVals, n, isNothing, IntegerType.INT_64);
     }
   }
 
@@ -83,23 +83,23 @@ public LongStorage run(
         LongStorage storage, LongStorage arg, MapOperationProblemAggregator problemAggregator) {
       int n = storage.size();
       long[] newVals = new long[n];
-      BitSet missing = new BitSet();
+      BitSet isNothing = new BitSet();
       NullityReporter nullityReporter = new NullityReporter();
       for (int i = 0; i < n; i++) {
-        if (storage.isNa(i) || arg.isNa(i)) {
-          missing.set(i);
+        if (storage.isNothing(i) || arg.isNothing(i)) {
+          isNothing.set(i);
         } else {
           long x =
               doLong(storage.getItem(i), arg.getItem(i), i, problemAggregator, nullityReporter);
           if (nullityReporter.wasLastNull) {
-            missing.set(i);
+            isNothing.set(i);
             nullityReporter.wasLastNull = false;
           } else {
             newVals[i] = x;
           }
         }
       }
-      return new LongStorage(newVals, n, missing, IntegerType.INT_64);
+      return new LongStorage(newVals, n, isNothing, IntegerType.INT_64);
     }
   }
 
diff --git a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/MapHelpers.java b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/MapHelpers.java
index 21c0397b3b32..1566a9be19e9 100644
--- a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/MapHelpers.java
+++ b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/MapHelpers.java
@@ -24,7 +24,7 @@ public static StringStorage stringConcatBimap(StringStorage storage1, StringStor
     int n = storage1.size();
     String[] result = new String[n];
     for (int i = 0; i < n; i++) {
-      if (!storage1.isNa(i) && !storage2.isNa(i)) {
+      if (!storage1.isNothing(i) && !storage2.isNothing(i)) {
         result[i] = storage1.getItem(i) + storage2.getItem(i);
       } else {
         result[i] = null;
@@ -40,59 +40,59 @@ public static LongStorage longAddBimap(LongStorage storage1, LongStorage storage
 
     int n = storage1.size();
     long[] result = new long[n];
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (!storage1.isNa(i) && !storage2.isNa(i)) {
+      if (!storage1.isNothing(i) && !storage2.isNothing(i)) {
         result[i] = storage1.getItem(i) + storage2.getItem(i);
       } else {
-        missing.set(i);
+        isNothing.set(i);
       }
     }
-    return new LongStorage(result, n, missing, IntegerType.INT_64);
+    return new LongStorage(result, n, isNothing, IntegerType.INT_64);
   }
 
   public static BoolStorage textEndsWith(StringStorage storage, String suffix) {
     int n = storage.size();
     BitSet result = new BitSet();
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (storage.isNa(i)) {
-        missing.set(i);
+      if (storage.isNothing(i)) {
+        isNothing.set(i);
       } else {
         if (Text_Utils.ends_with(storage.getItem(i), suffix)) {
           result.set(i);
         }
       }
     }
-    return new BoolStorage(result, missing, n, false);
+    return new BoolStorage(result, isNothing, n, false);
   }
 
   public static LongStorage longAdd(LongStorage storage, long shift) {
     int n = storage.size();
     long[] result = new long[n];
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         result[i] = storage.getItem(i) + shift;
       } else {
-        missing.set(i);
+        isNothing.set(i);
       }
     }
-    return new LongStorage(result, n, missing, IntegerType.INT_64);
+    return new LongStorage(result, n, isNothing, IntegerType.INT_64);
   }
 
   public static LongStorage getYear(DateStorage storage) {
     int n = storage.size();
     long[] result = new long[n];
-    BitSet missing = new BitSet();
+    BitSet isNothing = new BitSet();
     for (int i = 0; i < n; i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         result[i] = storage.getItem(i).getYear();
       } else {
-        missing.set(i);
+        isNothing.set(i);
       }
     }
-    return new LongStorage(result, n, missing, IntegerType.INT_64);
+    return new LongStorage(result, n, isNothing, IntegerType.INT_64);
   }
 
   public static Storage<?> mapCallback(
@@ -106,7 +106,7 @@ public static Storage<?> mapCallback(
             ? new InferredBuilder(n, problemAggregator)
             : Builder.getForType(expectedType, n, problemAggregator);
     for (int i = 0; i < n; i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         builder.append(fn.apply(storage.getItemBoxed(i)));
       } else {
         builder.appendNulls(1);
diff --git a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/SimpleStorageAggregateHelpers.java b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/SimpleStorageAggregateHelpers.java
index 8c2f2172edbc..ac070cf0a43c 100644
--- a/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/SimpleStorageAggregateHelpers.java
+++ b/test/Exploratory_Benchmarks/polyglot-sources/exploratory-benchmark-java-helpers/src/main/java/org/enso/exploratory_benchmark_helpers/SimpleStorageAggregateHelpers.java
@@ -10,7 +10,7 @@ public class SimpleStorageAggregateHelpers {
   public static long sumLongStorage(LongStorage storage) {
     long sum = 0;
     for (int i = 0; i < storage.size(); i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         sum += storage.getItem(i);
       }
     }
@@ -32,7 +32,7 @@ public static String longestText(StringStorage storage) {
     String longestText = null;
     int n = storage.size();
     for (int i = 0; i < n; i++) {
-      if (!storage.isNa(i)) {
+      if (!storage.isNothing(i)) {
         String text = storage.getItem(i);
         long length = Text_Utils.grapheme_length(text);
         if (length > longest) {
diff --git a/test/Exploratory_Benchmarks/src/Table/Column_Aggregate.enso b/test/Exploratory_Benchmarks/src/Table/Column_Aggregate.enso
index bb4d24584411..559353f87d2b 100644
--- a/test/Exploratory_Benchmarks/src/Table/Column_Aggregate.enso
+++ b/test/Exploratory_Benchmarks/src/Table/Column_Aggregate.enso
@@ -62,7 +62,7 @@ type Primitive_Total_Aggregate
         n = self.int_column.length
         storage = self.int_column.java_column.getStorage
         (0.up_to n).fold 0 acc-> ix->
-            if storage.isNa ix then acc else
+            if storage.isNothing ix then acc else
                 acc + storage.getItem ix
 
     verify_correctness self =
diff --git a/test/Exploratory_Benchmarks/src/Table/Column_Bi_Map.enso b/test/Exploratory_Benchmarks/src/Table/Column_Bi_Map.enso
index 923c27f3dd96..f49b553c53bc 100644
--- a/test/Exploratory_Benchmarks/src/Table/Column_Bi_Map.enso
+++ b/test/Exploratory_Benchmarks/src/Table/Column_Bi_Map.enso
@@ -68,7 +68,7 @@ type Primitive_Bi_Map_Test
             storage_1 = self.int_column_1.java_column.getStorage
             storage_2 = self.int_column_2.java_column.getStorage
             0.up_to n . each i->
-                if storage_1.isNa i || storage_2.isNa i then builder.appendNulls 1 else
+                if storage_1.isNothing i || storage_2.isNothing i then builder.appendNulls 1 else
                     item_1 = storage_1.getItem i
                     item_2 = storage_2.getItem i
                     res = item_1 + item_2
diff --git a/test/Exploratory_Benchmarks/src/Table/Column_Map.enso b/test/Exploratory_Benchmarks/src/Table/Column_Map.enso
index 9a88ae2c8fe8..61ab49f1bb9d 100644
--- a/test/Exploratory_Benchmarks/src/Table/Column_Map.enso
+++ b/test/Exploratory_Benchmarks/src/Table/Column_Map.enso
@@ -72,7 +72,7 @@ type Primitive_Map_Test
         builder = NumericBuilder.createLongBuilder n
         storage = self.int_column.java_column.getStorage
         0.up_to n . each i->
-            case storage.isNa i of
+            case storage.isNothing i of
                 True ->
                     builder.appendNulls 1
                 False ->
diff --git a/test/Exploratory_Benchmarks/src/Table/Enso_Callback.enso b/test/Exploratory_Benchmarks/src/Table/Enso_Callback.enso
index e7ac99a7458a..f14501810d1b 100644
--- a/test/Exploratory_Benchmarks/src/Table/Enso_Callback.enso
+++ b/test/Exploratory_Benchmarks/src/Table/Enso_Callback.enso
@@ -90,7 +90,7 @@ type Primitive_Enso_Callback_Test
         builder = NumericBuilder.createLongBuilder n
         storage = self.int_column.java_column.getStorage
         0.up_to n . each i->
-            case storage.isNa i of
+            case storage.isNothing i of
                 True ->
                     builder.appendNulls 1
                 False ->

From 4e8f066ec07b6442a8449cebf9edde18cc4808a8 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 00:51:44 +1000
Subject: [PATCH 17/26] Use backend errors in toast notifications (#9078)

Adds the `message` returned by the backend to the toast notification, so that the user gets a more detailed error message.

# Important Notes
- Not sure what's the best way to properly test this, as for a lot of the backend endpoints there is no easy way to (even intentionally) trigger them from the frontend, because the frontend does a decent amount of validation as well.
---
 app/ide-desktop/README.md                     |  26 ++++
 app/ide-desktop/eslint.config.js              |   5 +
 app/ide-desktop/lib/dashboard/README.md       |  10 +-
 .../dashboard/src/components/ColorPicker.tsx  |   2 +-
 .../components/dashboard/FileNameColumn.tsx   |  15 +-
 .../src/layouts/dashboard/AssetProperties.tsx |   2 +-
 .../src/layouts/dashboard/AssetSearchBar.tsx  |   2 +-
 .../layouts/dashboard/GlobalContextMenu.tsx   |   2 +-
 .../dashboard/src/services/RemoteBackend.ts   | 131 ++++++++++--------
 9 files changed, 121 insertions(+), 74 deletions(-)
 create mode 100644 app/ide-desktop/README.md

diff --git a/app/ide-desktop/README.md b/app/ide-desktop/README.md
new file mode 100644
index 000000000000..d6018e582aa3
--- /dev/null
+++ b/app/ide-desktop/README.md
@@ -0,0 +1,26 @@
+# Desktop app
+
+This folder contains projects related to the desktop app.
+
+## Folder structure
+
+Refer to the `README.md` in each individual module (if it exists) for the
+internal folder structure of the module.
+
+- `assets/`: Icons and images used by other modules. Currently these are only
+  used by `dashboard/`.
+- `client/`: The code for the Electron desktop app.
+- `common/`: Utility functions required by multiple other modules.
+- `content/`: The entry point for the GUI1 web app. This is the main page for
+  the desktop app.
+- `content-config/`: The statically-typed configuration object for `content/`.
+- [`dashboard/`](./lib/dashboard/README.md): The dashboard, used to manage
+  projects. It launches the GUI (located in `content/` for GUI1, or `/app/gui2/`
+  for GUI2) when a project is opened.
+- `esbuild-plugin-copy-directories/`: An ESBuild plugin for continuously copying
+  directories from the a given location to a given subdirectory of the build
+  output directory.
+- `icons/`: Generates the logo for the app.
+- `ts-plugin-namespace-auto-import/`: (WIP) A TypeScript plugin to change
+  auto-import to use `import * as moduleName` rather than `import {}`.
+- `types/`: Miscellaneous types used by multiple modules.
diff --git a/app/ide-desktop/eslint.config.js b/app/ide-desktop/eslint.config.js
index a0229e078dc1..38435eb3671b 100644
--- a/app/ide-desktop/eslint.config.js
+++ b/app/ide-desktop/eslint.config.js
@@ -228,6 +228,11 @@ const RESTRICTED_SYNTAXES = [
         selector: 'CallExpression[callee.name=toastAndLog][arguments.0.value=/\\.$/]',
         message: '`toastAndLog` already includes a trailing `.`',
     },
+    {
+        selector:
+            'JSXElement[closingElement!=null]:not(:has(.children:matches(JSXText[raw=/\\S/], :not(JSXText))))',
+        message: 'Use self-closing tags (`<tag />`) for tags without children.',
+    },
 ]
 
 // ============================
diff --git a/app/ide-desktop/lib/dashboard/README.md b/app/ide-desktop/lib/dashboard/README.md
index dcff285adb6c..f7bea14c70a2 100644
--- a/app/ide-desktop/lib/dashboard/README.md
+++ b/app/ide-desktop/lib/dashboard/README.md
@@ -6,10 +6,9 @@ management, project sharing, and user accounts and authentication.
 ## Folder structure
 
 - `mock/`: Overrides for specific files in `src/` when running Playwright tests.
-- `test-component/`: Contains component tests.
-- `test-e2e/`: Contains end-to-end tests.
+- `e2e/`: Contains end-to-end tests.
 - `**/__tests__/`: Contains all unit tests. Unit tests MUST be in a `__tests__/`
-  subfolder, not beside the module they are testing.
+  subfolder, not beside (and not inside) the module they are testing.
 - `src/`: The dashboard application.
   - `index.html`: The sole HTML file used by this SPA. It imports the TS entry
     point.
@@ -27,3 +26,8 @@ management, project sharing, and user accounts and authentication.
       - `components/`: Contains all components used by the authentication flow.
       - `providers/`: Contains React `Context`s required for authentication, and
         used by the main app.
+- `index.html`: The entrypoint, in the format required by Vite.
+- `404.html`: A copy of the entrypoint. This is served on unknown routes by
+  certain static hosting providers.
+- `esbuild-config.ts`: Configuration for ESBuild based on the environment
+  variables. This is a dependency of `esbuild-config.ts` in sibling modules.
diff --git a/app/ide-desktop/lib/dashboard/src/components/ColorPicker.tsx b/app/ide-desktop/lib/dashboard/src/components/ColorPicker.tsx
index 3afff684704e..bdd9236bf5e8 100644
--- a/app/ide-desktop/lib/dashboard/src/components/ColorPicker.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/ColorPicker.tsx
@@ -30,7 +30,7 @@ export default function ColorPicker(props: ColorPickerProps) {
               backgroundColor: backend.lChColorToCssColor(currentColor),
             }}
           >
-            <div className="hidden peer-checked:group-[]:block bg-frame-selected rounded-full w-2 h-2"></div>
+            <div className="hidden peer-checked:group-[]:block bg-frame-selected rounded-full w-2 h-2" />
           </button>
         </label>
       ))}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
index 32bcdf6d579c..90af956f28c2 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
@@ -90,11 +90,7 @@ export default function FileNameColumn(props: FileNameColumnProps) {
           rowState.setVisibility(Visibility.faded)
           try {
             const createdFile = await backend.uploadFile(
-              {
-                fileId,
-                fileName: asset.title,
-                parentDirectoryId: asset.parentId,
-              },
+              { fileId, fileName: asset.title, parentDirectoryId: asset.parentId },
               file
             )
             rowState.setVisibility(Visibility.visible)
@@ -102,15 +98,12 @@ export default function FileNameColumn(props: FileNameColumnProps) {
           } catch (error) {
             switch (event.type) {
               case AssetEventType.uploadFiles: {
-                dispatchAssetListEvent({
-                  type: AssetListEventType.delete,
-                  key: item.key,
-                })
-                toastAndLog('Could not upload file', error)
+                dispatchAssetListEvent({ type: AssetListEventType.delete, key: item.key })
+                toastAndLog(null, error)
                 break
               }
               case AssetEventType.updateFiles: {
-                toastAndLog('Could not update file', error)
+                toastAndLog(null, error)
                 break
               }
             }
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx
index 1280b0879df1..257487ca45b6 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx
@@ -164,7 +164,7 @@ export default function AssetProperties(props: AssetPropertiesProps) {
                   setDescription(event.currentTarget.value)
                 }}
                 className="bg-frame resize-none rounded-lg w-full p-2"
-              ></textarea>
+              />
               <button type="submit" className="self-start bg-frame-selected rounded-full px-4 py-1">
                 Update
               </button>
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
index ccff77fb5eb3..99feb289c957 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
@@ -236,7 +236,7 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
         }}
       />
       <div className="absolute flex flex-col top-0 left-0 overflow-hidden w-full before:absolute before:bg-frame before:inset-0 before:backdrop-blur-3xl rounded-2xl pointer-events-none transition-all duration-300">
-        <div className="relative padding h-8"></div>
+        <div className="relative padding h-8" />
         {areSuggestionsVisible && (
           <div className="relative flex flex-col gap-2">
             {/* Tags (`name:`, `modified:`, etc.) */}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx
index 141c14c157d3..a0c3bd0ff847 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx
@@ -65,7 +65,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
               unsetModal()
             }
           }}
-        ></input>
+        />
       )}
       <MenuEntry
         hidden={hidden}
diff --git a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
index 6c4929393626..55fa81f68f2a 100644
--- a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
+++ b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
@@ -11,7 +11,6 @@ import Backend, * as backendModule from '#/services/Backend'
 import * as remoteBackendPaths from '#/services/remoteBackendPaths'
 
 import * as config from '#/utilities/config'
-import * as errorModule from '#/utilities/error'
 import type HttpClient from '#/utilities/HttpClient'
 import * as object from '#/utilities/object'
 
@@ -37,6 +36,18 @@ const DEFAULT_OPEN_PROJECT_BODY: backendModule.OpenProjectRequestBody = {
   executeAsync: false,
 }
 
+// =============
+// === Types ===
+// =============
+
+/** The format of all errors returned by the backend. */
+interface RemoteBackendError {
+  readonly type: string
+  readonly code: string
+  readonly message: string
+  readonly param: string
+}
+
 // ============================
 // === responseIsSuccessful ===
 // ============================
@@ -141,7 +152,9 @@ export default class RemoteBackend extends Backend {
     // All of our API endpoints are authenticated, so we expect the `Authorization` header to be
     // set.
     if (!new Headers(this.client.defaultHeaders).has('Authorization')) {
-      return this.throw('Authorization header not set.')
+      const message = 'Authorization header not set'
+      this.logger.error(message)
+      throw new Error(message)
     } else {
       if (detect.IS_DEV_MODE) {
         // @ts-expect-error This exists only for debugging purposes. It does not have types
@@ -154,7 +167,14 @@ export default class RemoteBackend extends Backend {
 
   /** Log an error message and throws an {@link Error} with the specified message.
    * @throws {Error} Always. */
-  throw(message: string): never {
+  async throw(prefix: string, response: Response | null): Promise<never> {
+    const error =
+      response == null
+        ? { message: 'unknown error' }
+        : // This is SAFE only when the response has been confirmed to have an erroring status code.
+          // eslint-disable-next-line no-restricted-syntax
+          ((await response.json()) as RemoteBackendError)
+    const message = `${prefix}: ${error.message}.`
     this.logger.error(message)
     throw new Error(message)
   }
@@ -164,7 +184,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_USERS_PATH
     const response = await this.get<ListUsersResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not list users in the organization.`)
+      return this.throw(`Could not list users in the organization`, response)
     } else {
       return (await response.json()).users
     }
@@ -177,7 +197,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_USER_PATH
     const response = await this.post<backendModule.User>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not create user.')
+      return this.throw('Could not create user', response)
     } else {
       return await response.json()
     }
@@ -189,9 +209,9 @@ export default class RemoteBackend extends Backend {
     const response = await this.put(path, body)
     if (!responseIsSuccessful(response)) {
       if (body.username != null) {
-        return this.throw('Could not change username.')
+        return this.throw('Could not change username', response)
       } else {
-        return this.throw('Could not update user.')
+        return this.throw('Could not update user', response)
       }
     } else {
       return
@@ -202,7 +222,7 @@ export default class RemoteBackend extends Backend {
   override async deleteUser(): Promise<void> {
     const response = await this.delete(remoteBackendPaths.DELETE_USER_PATH)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not delete user.')
+      return this.throw('Could not delete user', response)
     } else {
       return
     }
@@ -213,7 +233,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.INVITE_USER_PATH
     const response = await this.post(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not invite user '${body.userEmail}'.`)
+      return this.throw(`Could not invite user '${body.userEmail}'`, response)
     } else {
       return
     }
@@ -232,7 +252,7 @@ export default class RemoteBackend extends Backend {
     const path = `${remoteBackendPaths.UPLOAD_USER_PICTURE_PATH}?${paramsString}`
     const response = await this.putBinary<backendModule.User>(path, file)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not upload user profile picture.')
+      return this.throw('Could not upload user profile picture', response)
     } else {
       return await response.json()
     }
@@ -247,7 +267,7 @@ export default class RemoteBackend extends Backend {
       // Organization info has not yet been created.
       return null
     } else if (!responseIsSuccessful(response)) {
-      return this.throw('Could not get organization.')
+      return this.throw('Could not get organization', response)
     } else {
       return await response.json()
     }
@@ -264,7 +284,7 @@ export default class RemoteBackend extends Backend {
       // Organization info has not yet been created.
       return null
     } else if (!responseIsSuccessful(response)) {
-      return this.throw('Could not update organization.')
+      return this.throw('Could not update organization', response)
     } else {
       return await response.json()
     }
@@ -283,7 +303,7 @@ export default class RemoteBackend extends Backend {
     const path = `${remoteBackendPaths.UPLOAD_ORGANIZATION_PICTURE_PATH}?${paramsString}`
     const response = await this.putBinary<backendModule.OrganizationInfo>(path, file)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not upload user profile picture.')
+      return this.throw('Could not upload user profile picture', response)
     } else {
       return await response.json()
     }
@@ -294,7 +314,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_PERMISSION_PATH
     const response = await this.post<backendModule.User>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not set permissions.`)
+      return this.throw('Could not set permissions', response)
     } else {
       return
     }
@@ -338,9 +358,9 @@ export default class RemoteBackend extends Backend {
         return []
       } else if (query.parentId != null) {
         const name = title != null ? `'${title}'` : `with ID '${query.parentId}'`
-        return this.throw(`Could not list folder ${name}.`)
+        return this.throw(`Could not list folder ${name}`, response)
       } else {
-        return this.throw('Could not list root folder.')
+        return this.throw('Could not list root folder', response)
       }
     } else {
       return (await response.json()).assets
@@ -366,7 +386,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_DIRECTORY_PATH
     const response = await this.post<backendModule.CreatedDirectory>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create folder with name '${body.title}'.`)
+      return this.throw(`Could not create folder with name '${body.title}'`, response)
     } else {
       return await response.json()
     }
@@ -383,7 +403,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.put<backendModule.UpdatedDirectory>(path, body)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${directoryId}'`
-      return this.throw(`Could not update folder ${name}.`)
+      return this.throw(`Could not update folder ${name}`, response)
     } else {
       return await response.json()
     }
@@ -398,7 +418,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.get<backendModule.AssetVersions>(path)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${assetId}'`
-      return this.throw(`Could not list versions for ${name}.`)
+      return this.throw(`Could not list versions for ${name}`, response)
     } else {
       return await response.json()
     }
@@ -415,7 +435,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.patch(path, body)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `asset with ID '${assetId}'`
-      return this.throw(`Could not update ${name}.`)
+      return this.throw(`Could not update ${name}.`, response)
     } else {
       return
     }
@@ -428,7 +448,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.delete(path)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `asset with ID '${assetId}'`
-      return this.throw(`Unable to delete ${name}.`)
+      return this.throw(`Unable to delete ${name}.`, response)
     } else {
       return
     }
@@ -446,7 +466,8 @@ export default class RemoteBackend extends Backend {
       return this.throw(
         `Unable to restore ${
           title != null ? `'${title}'` : `asset with ID '${assetId}'`
-        } from Trash.`
+        } from Trash`,
+        response
       )
     } else {
       return
@@ -471,7 +492,8 @@ export default class RemoteBackend extends Backend {
           parentDirectoryTitle != null
             ? `'${parentDirectoryTitle}'`
             : `directory with ID '${parentDirectoryId}'`
-        }.`
+        }`,
+        response
       )
     } else {
       return await response.json()
@@ -484,7 +506,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_PROJECTS_PATH
     const response = await this.get<ListProjectsResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not list projects.')
+      return this.throw('Could not list projects', response)
     } else {
       return (await response.json()).projects.map(project => ({
         ...project,
@@ -504,7 +526,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_PROJECT_PATH
     const response = await this.post<backendModule.CreatedProject>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create project with name '${body.projectName}'.`)
+      return this.throw(`Could not create project with name '${body.projectName}'`, response)
     } else {
       return await response.json()
     }
@@ -520,7 +542,8 @@ export default class RemoteBackend extends Backend {
     const response = await this.post(path, {})
     if (!responseIsSuccessful(response)) {
       return this.throw(
-        `Could not close project ${title != null ? `'${title}'` : `with ID '${projectId}'`}.`
+        `Could not close project ${title != null ? `'${title}'` : `with ID '${projectId}'`}`,
+        response
       )
     } else {
       return
@@ -539,7 +562,8 @@ export default class RemoteBackend extends Backend {
       return this.throw(
         `Could not get details of project ${
           title != null ? `'${title}'` : `with ID '${projectId}'`
-        }.`
+        }`,
+        response
       )
     } else {
       const project = await response.json()
@@ -568,7 +592,8 @@ export default class RemoteBackend extends Backend {
     const response = await this.post(path, body ?? DEFAULT_OPEN_PROJECT_BODY)
     if (!responseIsSuccessful(response)) {
       return this.throw(
-        `Could not open project ${title != null ? `'${title}'` : `with ID '${projectId}'`}.`
+        `Could not open project ${title != null ? `'${title}'` : `with ID '${projectId}'`}`,
+        response
       )
     } else {
       return
@@ -586,7 +611,8 @@ export default class RemoteBackend extends Backend {
     const response = await this.put<backendModule.UpdatedProject>(path, body)
     if (!responseIsSuccessful(response)) {
       return this.throw(
-        `Could not update project ${title != null ? `'${title}'` : `with ID '${projectId}'`}.`
+        `Could not update project ${title != null ? `'${title}'` : `with ID '${projectId}'`}`,
+        response
       )
     } else {
       return await response.json()
@@ -605,7 +631,8 @@ export default class RemoteBackend extends Backend {
       return this.throw(
         `Could not get resource usage for project ${
           title != null ? `'${title}'` : `with ID '${projectId}'`
-        }.`
+        }`,
+        response
       )
     } else {
       return await response.json()
@@ -618,7 +645,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_FILES_PATH
     const response = await this.get<ListFilesResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not list files.')
+      return this.throw('Could not list files', response)
     } else {
       return (await response.json()).files
     }
@@ -640,19 +667,10 @@ export default class RemoteBackend extends Backend {
     const path = `${remoteBackendPaths.UPLOAD_FILE_PATH}?${paramsString}`
     const response = await this.postBinary<backendModule.FileInfo>(path, file)
     if (!responseIsSuccessful(response)) {
-      let suffix = '.'
-      try {
-        const error = errorModule.tryGetError<unknown>(await response.json())
-        if (error != null) {
-          suffix = `: ${error}`
-        }
-      } catch {
-        // Ignored.
-      }
       if (params.fileId != null) {
-        return this.throw(`Could not upload file with ID '${params.fileId}'${suffix}`)
+        return this.throw(`Could not upload file with ID '${params.fileId}'`, response)
       } else {
-        return this.throw(`Could not upload file${suffix}`)
+        return this.throw('Could not upload file', response)
       }
     } else {
       return await response.json()
@@ -669,7 +687,8 @@ export default class RemoteBackend extends Backend {
     const response = await this.get<backendModule.FileDetails>(path)
     if (!responseIsSuccessful(response)) {
       return this.throw(
-        `Could not get details of project ${title != null ? `'${title}'` : `with ID '${fileId}'`}.`
+        `Could not get details of project ${title != null ? `'${title}'` : `with ID '${fileId}'`}`,
+        response
       )
     } else {
       return await response.json()
@@ -684,7 +703,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_CONNECTOR_PATH
     const response = await this.post<backendModule.ConnectorInfo>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create Data Link with name '${body.name}'.`)
+      return this.throw(`Could not create Data Link with name '${body.name}'`, response)
     } else {
       return await response.json()
     }
@@ -700,7 +719,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.get<backendModule.Connector>(path)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${connectorId}'`
-      return this.throw(`Could not get Data Link ${name}.`)
+      return this.throw(`Could not get Data Link ${name}`, response)
     } else {
       return await response.json()
     }
@@ -716,7 +735,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.delete(path)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${connectorId}'`
-      return this.throw(`Could not delete Data Link ${name}.`)
+      return this.throw(`Could not delete Data Link ${name}`, response)
     } else {
       return
     }
@@ -730,7 +749,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_SECRET_PATH
     const response = await this.post<backendModule.SecretId>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create secret with name '${body.name}'.`)
+      return this.throw(`Could not create secret with name '${body.name}'`, response)
     } else {
       return await response.json()
     }
@@ -746,7 +765,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.get<backendModule.Secret>(path)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${secretId}'`
-      return this.throw(`Could not get secret ${name}.`)
+      return this.throw(`Could not get secret ${name}`, response)
     } else {
       return await response.json()
     }
@@ -763,7 +782,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.put(path, body)
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${secretId}'`
-      return this.throw(`Could not update secret ${name}.`)
+      return this.throw(`Could not update secret ${name}`, response)
     } else {
       return
     }
@@ -775,7 +794,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_SECRETS_PATH
     const response = await this.get<ListSecretsResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw('Could not list secrets.')
+      return this.throw('Could not list secrets', response)
     } else {
       return (await response.json()).secrets
     }
@@ -787,7 +806,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.CREATE_TAG_PATH
     const response = await this.post<backendModule.Label>(path, body)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create label '${body.value}'.`)
+      return this.throw(`Could not create label '${body.value}'`, response)
     } else {
       return await response.json()
     }
@@ -799,7 +818,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_TAGS_PATH
     const response = await this.get<ListTagsResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not list labels.`)
+      return this.throw(`Could not list labels`, response)
     } else {
       return (await response.json()).tags
     }
@@ -816,7 +835,7 @@ export default class RemoteBackend extends Backend {
     const response = await this.patch<ListTagsResponseBody>(path, { labels })
     if (!responseIsSuccessful(response)) {
       const name = title != null ? `'${title}'` : `with ID '${assetId}'`
-      return this.throw(`Could not set labels for asset ${name}.`)
+      return this.throw(`Could not set labels for asset ${name}`, response)
     } else {
       return
     }
@@ -831,7 +850,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.deleteTagPath(tagId)
     const response = await this.delete(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not delete label '${value}'.`)
+      return this.throw(`Could not delete label '${value}'`, response)
     } else {
       return
     }
@@ -850,7 +869,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.LIST_VERSIONS_PATH + '?' + paramsString
     const response = await this.get<ListVersionsResponseBody>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not list versions of type '${params.versionType}'.`)
+      return this.throw(`Could not list versions of type '${params.versionType}'`, response)
     } else {
       return (await response.json()).versions
     }
@@ -895,7 +914,7 @@ export default class RemoteBackend extends Backend {
     } else {
       const version = (await this.listVersions({ versionType, default: true }))[0]?.number
       if (version == null) {
-        return this.throw(`No default ${versionType} version found.`)
+        return this.throw(`No default ${versionType} version found`, null)
       } else {
         const info: DefaultVersionInfo = { version, lastUpdatedEpochMs: nowEpochMs }
         this.defaultVersions[versionType] = info

From 65f66fabb6445ce6f6d17995481a43833b539429 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 01:10:38 +1000
Subject: [PATCH 18/26] Remove `forceCreate` from backend requests; minor
 bugfixes (#9074)

- Remove unused `forceCreate` parameter from backend requests
- Also undo bad change to behavior of sorting assets:
- https://github.com/enso-org/enso/pull/7540#issuecomment-1683699696
- Fix https://github.com/enso-org/cloud-v2/issues/910
- Closing a project now doesn't close other projects.
- Unable to properly test, as I cannot get the second project to open
- Fix https://github.com/enso-org/cloud-v2/issues/908
- Use the `download` module that already exists to download the app...
- Add correct arrow icon for collapsing/expanding folders
- Turns out this icon had always existed, and I just didn't see it for the longest time
- Hide irrelevant parts of search bar on Local Backend
- The row of labels
- `no:`, `has:`, `label:`, `-label:`, `description:`, `-description:` (and their corresponding autocomplete entries)
- Also change text to say "Type to search for projects." because the other asset types mentioned do not (and will never) exist on the Local Backend.
- Fix search bar eating up `"` and ` ` keypresses
- Fix icons for Data Links and Secrets being swapped in `AssetIcon`

# Important Notes
- The fix for https://github.com/enso-org/cloud-v2/issues/908 has not been tested on Safari (I don't have a macOS machine.)
---
 app/ide-desktop/lib/assets/folder_arrow.svg   |   5 +
 app/ide-desktop/lib/dashboard/e2e/actions.ts  |   2 +-
 .../lib/dashboard/e2e/sort.spec.ts            |  58 ++++-----
 .../dashboard/src/authentication/cognito.ts   |  14 ++-
 .../src/components/dashboard/AssetIcon.tsx    |   4 +-
 .../src/components/dashboard/AssetRow.tsx     |   5 +-
 .../dashboard/DataLinkNameColumn.tsx          |   1 -
 .../dashboard/DirectoryNameColumn.tsx         |   7 +-
 .../components/dashboard/FileNameColumn.tsx   |   1 -
 .../src/components/dashboard/ProjectIcon.tsx  |  56 +++------
 .../dashboard/ProjectNameColumn.tsx           |  13 +-
 .../components/dashboard/SecretNameColumn.tsx |   1 -
 .../dashboard/src/events/AssetEventType.ts    |   1 -
 .../lib/dashboard/src/events/assetEvent.ts    |   5 -
 .../layouts/dashboard/AssetContextMenu.tsx    |   2 +-
 .../src/layouts/dashboard/AssetSearchBar.tsx  |  87 +++++++------
 .../src/layouts/dashboard/AssetsTable.tsx     | 117 ++++++++----------
 .../dashboard/src/layouts/dashboard/Drive.tsx |   7 +-
 .../src/layouts/dashboard/DriveBar.tsx        |   4 +-
 .../src/layouts/dashboard/TopBar.tsx          |   4 +-
 .../src/layouts/dashboard/UserMenu.tsx        |   3 +-
 .../src/pages/dashboard/Dashboard.tsx         |  18 +--
 .../lib/dashboard/src/services/Backend.ts     |  33 ++++-
 .../dashboard/src/services/RemoteBackend.ts   |  11 +-
 .../lib/dashboard/src/utilities/AssetQuery.ts |  15 +++
 25 files changed, 248 insertions(+), 226 deletions(-)
 create mode 100644 app/ide-desktop/lib/assets/folder_arrow.svg

diff --git a/app/ide-desktop/lib/assets/folder_arrow.svg b/app/ide-desktop/lib/assets/folder_arrow.svg
new file mode 100644
index 000000000000..48327d24d7d6
--- /dev/null
+++ b/app/ide-desktop/lib/assets/folder_arrow.svg
@@ -0,0 +1,5 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path fill-rule="evenodd" clip-rule="evenodd"
+        d="M4.58579 3.75735L8.82843 7.99999L4.58579 12.2426L6 13.6568L10.2426 9.41421L11.6569 7.99999L10.2426 6.58578L6 2.34314L4.58579 3.75735Z"
+        fill="black" />
+</svg>
\ No newline at end of file
diff --git a/app/ide-desktop/lib/dashboard/e2e/actions.ts b/app/ide-desktop/lib/dashboard/e2e/actions.ts
index 0893baf11c78..696c7846f65a 100644
--- a/app/ide-desktop/lib/dashboard/e2e/actions.ts
+++ b/app/ide-desktop/lib/dashboard/e2e/actions.ts
@@ -83,7 +83,7 @@ export function locateSecretValueInput(page: test.Locator | test.Page) {
 /** Find a search bar input (if any) on the current page. */
 export function locateSearchBarInput(page: test.Locator | test.Page) {
   return locateSearchBar(page).getByPlaceholder(
-    'Type to search for projects, data connectors, users, and more.'
+    'Type to search for projects, Data Links, users, and more.'
   )
 }
 
diff --git a/app/ide-desktop/lib/dashboard/e2e/sort.spec.ts b/app/ide-desktop/lib/dashboard/e2e/sort.spec.ts
index 6bf6d9493990..967941acf8d4 100644
--- a/app/ide-desktop/lib/dashboard/e2e/sort.spec.ts
+++ b/app/ide-desktop/lib/dashboard/e2e/sort.spec.ts
@@ -63,25 +63,25 @@ test.test('sort', async ({ page }) => {
   await nameHeading.click()
   await test.expect(actions.locateSortAscendingIcon(nameHeading)).toBeVisible()
   await test.expect(assetRows.nth(0)).toHaveText(/^a directory/)
-  await test.expect(assetRows.nth(1)).toHaveText(/^G directory/)
-  await test.expect(assetRows.nth(2)).toHaveText(/^b project/)
-  await test.expect(assetRows.nth(3)).toHaveText(/^C project/)
-  await test.expect(assetRows.nth(4)).toHaveText(/^d file/)
-  await test.expect(assetRows.nth(5)).toHaveText(/^e file/)
-  await test.expect(assetRows.nth(6)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(1)).toHaveText(/^b project/)
+  await test.expect(assetRows.nth(2)).toHaveText(/^C project/)
+  await test.expect(assetRows.nth(3)).toHaveText(/^d file/)
+  await test.expect(assetRows.nth(4)).toHaveText(/^e file/)
+  await test.expect(assetRows.nth(5)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(6)).toHaveText(/^G directory/)
   await test.expect(assetRows.nth(7)).toHaveText(/^H secret/)
 
   // Sort by name descending.
   await nameHeading.click()
   await test.expect(actions.locateSortDescendingIcon(nameHeading)).toBeVisible()
-  await test.expect(assetRows.nth(0)).toHaveText(/^G directory/)
-  await test.expect(assetRows.nth(1)).toHaveText(/^a directory/)
-  await test.expect(assetRows.nth(2)).toHaveText(/^C project/)
-  await test.expect(assetRows.nth(3)).toHaveText(/^b project/)
-  await test.expect(assetRows.nth(4)).toHaveText(/^e file/)
-  await test.expect(assetRows.nth(5)).toHaveText(/^d file/)
-  await test.expect(assetRows.nth(6)).toHaveText(/^H secret/)
-  await test.expect(assetRows.nth(7)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(0)).toHaveText(/^H secret/)
+  await test.expect(assetRows.nth(1)).toHaveText(/^G directory/)
+  await test.expect(assetRows.nth(2)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(3)).toHaveText(/^e file/)
+  await test.expect(assetRows.nth(4)).toHaveText(/^d file/)
+  await test.expect(assetRows.nth(5)).toHaveText(/^C project/)
+  await test.expect(assetRows.nth(6)).toHaveText(/^b project/)
+  await test.expect(assetRows.nth(7)).toHaveText(/^a directory/)
 
   // Sorting should be unset.
   await nameHeading.click()
@@ -100,26 +100,26 @@ test.test('sort', async ({ page }) => {
   // Sort by date ascending.
   await modifiedHeading.click()
   await test.expect(actions.locateSortAscendingIcon(modifiedHeading)).toBeVisible()
-  await test.expect(assetRows.nth(0)).toHaveText(/^a directory/)
-  await test.expect(assetRows.nth(1)).toHaveText(/^G directory/)
-  await test.expect(assetRows.nth(2)).toHaveText(/^b project/)
-  await test.expect(assetRows.nth(3)).toHaveText(/^C project/)
+  await test.expect(assetRows.nth(0)).toHaveText(/^b project/)
+  await test.expect(assetRows.nth(1)).toHaveText(/^H secret/)
+  await test.expect(assetRows.nth(2)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(3)).toHaveText(/^a directory/)
   await test.expect(assetRows.nth(4)).toHaveText(/^e file/)
-  await test.expect(assetRows.nth(5)).toHaveText(/^d file/)
-  await test.expect(assetRows.nth(6)).toHaveText(/^H secret/)
-  await test.expect(assetRows.nth(7)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(5)).toHaveText(/^G directory/)
+  await test.expect(assetRows.nth(6)).toHaveText(/^C project/)
+  await test.expect(assetRows.nth(7)).toHaveText(/^d file/)
 
   // Sort by date descending.
   await modifiedHeading.click()
   await test.expect(actions.locateSortDescendingIcon(modifiedHeading)).toBeVisible()
-  await test.expect(assetRows.nth(0)).toHaveText(/^G directory/)
-  await test.expect(assetRows.nth(1)).toHaveText(/^a directory/)
-  await test.expect(assetRows.nth(2)).toHaveText(/^C project/)
-  await test.expect(assetRows.nth(3)).toHaveText(/^b project/)
-  await test.expect(assetRows.nth(4)).toHaveText(/^d file/)
-  await test.expect(assetRows.nth(5)).toHaveText(/^e file/)
-  await test.expect(assetRows.nth(6)).toHaveText(/^f secret/)
-  await test.expect(assetRows.nth(7)).toHaveText(/^H secret/)
+  await test.expect(assetRows.nth(0)).toHaveText(/^d file/)
+  await test.expect(assetRows.nth(1)).toHaveText(/^C project/)
+  await test.expect(assetRows.nth(2)).toHaveText(/^G directory/)
+  await test.expect(assetRows.nth(3)).toHaveText(/^e file/)
+  await test.expect(assetRows.nth(4)).toHaveText(/^a directory/)
+  await test.expect(assetRows.nth(5)).toHaveText(/^f secret/)
+  await test.expect(assetRows.nth(6)).toHaveText(/^H secret/)
+  await test.expect(assetRows.nth(7)).toHaveText(/^b project/)
 
   // Sorting should be unset.
   await modifiedHeading.click()
diff --git a/app/ide-desktop/lib/dashboard/src/authentication/cognito.ts b/app/ide-desktop/lib/dashboard/src/authentication/cognito.ts
index 8f882b9c90b1..a47eb9d6b408 100644
--- a/app/ide-desktop/lib/dashboard/src/authentication/cognito.ts
+++ b/app/ide-desktop/lib/dashboard/src/authentication/cognito.ts
@@ -148,6 +148,7 @@ export enum CognitoErrorType {
   notAuthorized = 'NotAuthorized',
   userNotConfirmed = 'UserNotConfirmed',
   userNotFound = 'UserNotFound',
+  userBrokenState = 'UserBrokenState',
   amplifyError = 'AmplifyError',
   authError = 'AuthError',
   noCurrentUser = 'NoCurrentUser',
@@ -546,7 +547,10 @@ export function intoSignInWithPasswordErrorOrThrow(error: AmplifyError): SignInW
 
 /** An error that may occur when requesting a password reset. */
 export interface ForgotPasswordError extends CognitoError {
-  readonly type: CognitoErrorType.userNotConfirmed | CognitoErrorType.userNotFound
+  readonly type:
+    | CognitoErrorType.userBrokenState
+    | CognitoErrorType.userNotConfirmed
+    | CognitoErrorType.userNotFound
   readonly message: string
 }
 
@@ -571,6 +575,14 @@ export function intoForgotPasswordErrorOrThrow(error: AmplifyError): ForgotPassw
         'Cannot reset password for user with an unverified email. ' +
         'Please verify your email first.',
     }
+  } else if (
+    error.code === 'NotAuthorizedException' &&
+    error.message === 'User password cannot be reset in the current state.'
+  ) {
+    return {
+      type: CognitoErrorType.userBrokenState,
+      message: 'User account is in a broken state. Please contact support.',
+    }
   } else {
     throw error
   }
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetIcon.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetIcon.tsx
index d2949442ec97..e2da0de642f2 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetIcon.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetIcon.tsx
@@ -33,10 +33,10 @@ export default function AssetIcon(props: AssetIconProps) {
       return <SvgMask src={fileIcon.fileIcon()} className={className} />
     }
     case backend.AssetType.dataLink: {
-      return <SvgMask src={KeyIcon} className={className} />
+      return <SvgMask src={ConnectorIcon} className={className} />
     }
     case backend.AssetType.secret: {
-      return <SvgMask src={ConnectorIcon} className={className} />
+      return <SvgMask src={KeyIcon} className={className} />
     }
     case backend.AssetType.specialLoading:
     case backend.AssetType.specialEmpty: {
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
index 6bdc62ee938b..dd5bdb7247a5 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
@@ -313,8 +313,7 @@ export default function AssetRow(props: AssetRowProps) {
       case AssetEventType.newSecret:
       case AssetEventType.updateFiles:
       case AssetEventType.openProject:
-      case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects: {
+      case AssetEventType.closeProject: {
         break
       }
       case AssetEventType.copy: {
@@ -386,7 +385,7 @@ export default function AssetRow(props: AssetRowProps) {
               try {
                 const details = await backend.getFileDetails(asset.id, asset.title)
                 const file = details.file
-                download.download(download.s3URLToHTTPURL(file.path), asset.title)
+                download.download(details.url ?? download.s3URLToHTTPURL(file.path), asset.title)
               } catch (error) {
                 toastAndLog('Could not download selected files', error)
               }
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
index ad30c1043fcc..1273af36a4d6 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
@@ -63,7 +63,6 @@ export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
       case AssetEventType.openProject:
       case AssetEventType.updateFiles:
       case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects:
       case AssetEventType.copy:
       case AssetEventType.cut:
       case AssetEventType.cancelCut:
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
index d02bf7f3b758..cc63ca8ff181 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
@@ -1,8 +1,8 @@
 /** @file The icon and name of a {@link backendModule.DirectoryAsset}. */
 import * as React from 'react'
 
+import FolderArrowIcon from 'enso-assets/folder_arrow.svg'
 import FolderIcon from 'enso-assets/folder.svg'
-import TriangleDownIcon from 'enso-assets/triangle_down.svg'
 
 import * as eventHooks from '#/hooks/eventHooks'
 import * as setAssetHooks from '#/hooks/setAssetHooks'
@@ -77,7 +77,6 @@ export default function DirectoryNameColumn(props: DirectoryNameColumnProps) {
       case AssetEventType.openProject:
       case AssetEventType.updateFiles:
       case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects:
       case AssetEventType.copy:
       case AssetEventType.cut:
       case AssetEventType.cancelCut:
@@ -146,10 +145,10 @@ export default function DirectoryNameColumn(props: DirectoryNameColumnProps) {
       }}
     >
       <SvgMask
-        src={TriangleDownIcon}
+        src={FolderArrowIcon}
         alt={item.children == null ? 'Expand' : 'Collapse'}
         className={`hidden group-hover:inline-block cursor-pointer h-4 w-4 m-1 transition-transform duration-300 ${
-          item.children != null ? '' : '-rotate-90'
+          item.children != null ? 'rotate-90' : ''
         }`}
         onClick={event => {
           event.stopPropagation()
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
index 90af956f28c2..0198e946df86 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
@@ -62,7 +62,6 @@ export default function FileNameColumn(props: FileNameColumnProps) {
       case AssetEventType.newSecret:
       case AssetEventType.openProject:
       case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects:
       case AssetEventType.copy:
       case AssetEventType.cut:
       case AssetEventType.cancelCut:
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectIcon.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectIcon.tsx
index 7e2ed730326b..7339198a7031 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectIcon.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectIcon.tsx
@@ -12,7 +12,6 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
-import * as localStorageProvider from '#/providers/LocalStorageProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
@@ -47,6 +46,7 @@ const REMOTE_SPINNER_STATE: Readonly<Record<backendModule.ProjectState, spinner.
   [backendModule.ProjectState.placeholder]: spinner.SpinnerState.loadingSlow,
   [backendModule.ProjectState.openInProgress]: spinner.SpinnerState.loadingSlow,
   [backendModule.ProjectState.provisioned]: spinner.SpinnerState.loadingSlow,
+  [backendModule.ProjectState.scheduled]: spinner.SpinnerState.loadingSlow,
   [backendModule.ProjectState.opened]: spinner.SpinnerState.done,
 }
 /** The corresponding {@link spinner.SpinnerState} for each {@link backendModule.ProjectState},
@@ -59,6 +59,7 @@ const LOCAL_SPINNER_STATE: Readonly<Record<backendModule.ProjectState, spinner.S
   [backendModule.ProjectState.placeholder]: spinner.SpinnerState.loadingMedium,
   [backendModule.ProjectState.openInProgress]: spinner.SpinnerState.loadingMedium,
   [backendModule.ProjectState.provisioned]: spinner.SpinnerState.loadingMedium,
+  [backendModule.ProjectState.scheduled]: spinner.SpinnerState.loadingMedium,
   [backendModule.ProjectState.opened]: spinner.SpinnerState.done,
 }
 
@@ -74,17 +75,17 @@ export interface ProjectIconProps {
   readonly assetEvents: assetEvent.AssetEvent[]
   /** Called when the project is opened via the {@link ProjectIcon}. */
   readonly doOpenManually: (projectId: backendModule.ProjectId) => void
-  readonly onClose: () => void
-  readonly openIde: (switchPage: boolean) => void
+  readonly doCloseEditor: () => void
+  readonly doOpenEditor: (switchPage: boolean) => void
 }
 
 /** An interactive icon indicating the status of a project. */
 export default function ProjectIcon(props: ProjectIconProps) {
-  const { keyProp: key, item, setItem, assetEvents, doOpenManually, onClose, openIde } = props
+  const { keyProp: key, item, setItem, assetEvents, doOpenManually } = props
+  const { doCloseEditor, doOpenEditor } = props
   const { backend } = backendProvider.useBackend()
   const { user } = authProvider.useNonPartialUserSession()
   const { unsetModal } = modalProvider.useSetModal()
-  const { localStorage } = localStorageProvider.useLocalStorage()
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const state = item.projectState.type
   const setState = React.useCallback(
@@ -99,7 +100,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
         let newProjectState: backendModule.ProjectStateType = object.merge(oldItem.projectState, {
           type: newState,
         })
-        if (!backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[newState]) {
+        if (!backendModule.IS_OPENING_OR_OPENED[newState]) {
           // eslint-disable-next-line @typescript-eslint/naming-convention, @typescript-eslint/no-unused-vars
           const { opened_by, ...newProjectState2 } = newProjectState
           newProjectState = newProjectState2
@@ -145,10 +146,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
               }
               await backend.openProject(
                 item.id,
-                {
-                  forceCreate: false,
-                  executeAsync: shouldRunInBackground,
-                },
+                { executeAsync: shouldRunInBackground },
                 item.title
               )
             }
@@ -166,14 +164,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
             break
           }
           case backendModule.BackendType.local: {
-            await backend.openProject(
-              item.id,
-              {
-                forceCreate: false,
-                executeAsync: shouldRunInBackground,
-              },
-              item.title
-            )
+            await backend.openProject(item.id, { executeAsync: shouldRunInBackground }, item.title)
             setState(oldState =>
               oldState === backendModule.ProjectState.openInProgress
                 ? backendModule.ProjectState.opened
@@ -261,8 +252,8 @@ export default function ProjectIcon(props: ProjectIconProps) {
         if (event.id !== item.id) {
           if (!event.runInBackground && !isRunningInBackground) {
             setShouldOpenWhenReady(false)
-            if (!isOtherUserUsingProject) {
-              void closeProject(false)
+            if (!isOtherUserUsingProject && backendModule.IS_OPENING_OR_OPENED[state]) {
+              // void closeProject(false)
             }
           }
         } else {
@@ -280,19 +271,6 @@ export default function ProjectIcon(props: ProjectIconProps) {
         }
         break
       }
-      case AssetEventType.cancelOpeningAllProjects: {
-        if (!isRunningInBackground) {
-          setShouldOpenWhenReady(false)
-          onSpinnerStateChange?.(null)
-          setOnSpinnerStateChange(null)
-          openProjectAbortController?.abort()
-          setOpenProjectAbortController(null)
-          if (!isOtherUserUsingProject) {
-            void closeProject(false)
-          }
-        }
-        break
-      }
       case AssetEventType.newProject: {
         if (event.placeholderId === key) {
           setOnSpinnerStateChange(() => event.onSpinnerStateChange)
@@ -307,18 +285,17 @@ export default function ProjectIcon(props: ProjectIconProps) {
   React.useEffect(() => {
     if (state === backendModule.ProjectState.opened) {
       if (shouldOpenWhenReady) {
-        openIde(shouldSwitchPage)
+        doOpenEditor(shouldSwitchPage)
         setShouldOpenWhenReady(false)
       }
     }
-    // `openIde` is a callback, not a dependency.
+    // `doOpenEditor` is a callback, not a dependency.
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [shouldOpenWhenReady, shouldSwitchPage, state])
 
   const closeProject = async (triggerOnClose = true) => {
     if (triggerOnClose) {
-      onClose()
-      localStorage.delete('projectStartupInfo')
+      doCloseEditor()
     }
     setToastId(null)
     setShouldOpenWhenReady(false)
@@ -329,7 +306,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
     setOpenProjectAbortController(null)
     const abortController = new AbortController()
     setCloseProjectAbortController(abortController)
-    if (backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[state]) {
+    if (backendModule.IS_OPENING_OR_OPENED[state]) {
       try {
         if (
           backend.type === backendModule.BackendType.local &&
@@ -371,6 +348,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
         </button>
       )
     case backendModule.ProjectState.openInProgress:
+    case backendModule.ProjectState.scheduled:
     case backendModule.ProjectState.provisioned:
     case backendModule.ProjectState.placeholder:
       return (
@@ -422,7 +400,7 @@ export default function ProjectIcon(props: ProjectIconProps) {
               onClick={clickEvent => {
                 clickEvent.stopPropagation()
                 unsetModal()
-                openIde(true)
+                doOpenEditor(true)
               }}
             >
               <SvgMask alt="Open in editor" src={ArrowUpIcon} className={ICON_CLASSES} />
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
index 76b4f9554bb4..c4b39fd41761 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
@@ -43,7 +43,7 @@ export interface ProjectNameColumnProps extends column.AssetColumnProps {}
 export default function ProjectNameColumn(props: ProjectNameColumnProps) {
   const { item, setItem, selected, rowState, setRowState, state } = props
   const { selectedKeys, assetEvents, dispatchAssetEvent, dispatchAssetListEvent } = state
-  const { nodeMap, doOpenManually, doOpenIde, doCloseIde } = state
+  const { nodeMap, doOpenManually, doOpenEditor, doCloseEditor } = state
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
   const { user } = authProvider.useNonPartialUserSession()
@@ -62,7 +62,7 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
   const projectState = asset.projectState ?? {
     type: backendModule.ProjectState.closed,
   }
-  const isRunning = backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[projectState.type]
+  const isRunning = backendModule.IS_OPENING_OR_OPENED[projectState.type]
   const canExecute =
     backend.type === backendModule.BackendType.local ||
     (ownPermission != null && permissions.PERMISSION_ACTION_CAN_EXECUTE[ownPermission.permission])
@@ -98,7 +98,6 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
       case AssetEventType.newSecret:
       case AssetEventType.openProject:
       case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects:
       case AssetEventType.copy:
       case AssetEventType.cut:
       case AssetEventType.cancelCut:
@@ -295,11 +294,11 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
           setItem={setAsset}
           assetEvents={assetEvents}
           doOpenManually={doOpenManually}
-          openIde={switchPage => {
-            doOpenIde(asset, setAsset, switchPage)
+          doOpenEditor={switchPage => {
+            doOpenEditor(asset, setAsset, switchPage)
           }}
-          onClose={() => {
-            doCloseIde(asset)
+          doCloseEditor={() => {
+            doCloseEditor(asset)
           }}
         />
       )}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
index 0de8452e82a0..8998874fcb9d 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
@@ -60,7 +60,6 @@ export default function SecretNameColumn(props: SecretNameColumnProps) {
       case AssetEventType.openProject:
       case AssetEventType.updateFiles:
       case AssetEventType.closeProject:
-      case AssetEventType.cancelOpeningAllProjects:
       case AssetEventType.copy:
       case AssetEventType.cut:
       case AssetEventType.cancelCut:
diff --git a/app/ide-desktop/lib/dashboard/src/events/AssetEventType.ts b/app/ide-desktop/lib/dashboard/src/events/AssetEventType.ts
index 8f88a3a97c62..96e120bc9fee 100644
--- a/app/ide-desktop/lib/dashboard/src/events/AssetEventType.ts
+++ b/app/ide-desktop/lib/dashboard/src/events/AssetEventType.ts
@@ -14,7 +14,6 @@ enum AssetEventType {
   newSecret = 'new-secret',
   openProject = 'open-project',
   closeProject = 'close-project',
-  cancelOpeningAllProjects = 'cancel-opening-all-projects',
   copy = 'copy',
   cut = 'cut',
   cancelCut = 'cancel-cut',
diff --git a/app/ide-desktop/lib/dashboard/src/events/assetEvent.ts b/app/ide-desktop/lib/dashboard/src/events/assetEvent.ts
index b9d8a706692f..195a1d61a11c 100644
--- a/app/ide-desktop/lib/dashboard/src/events/assetEvent.ts
+++ b/app/ide-desktop/lib/dashboard/src/events/assetEvent.ts
@@ -33,7 +33,6 @@ interface AssetEvents {
   readonly newSecret: AssetNewSecretEvent
   readonly openProject: AssetOpenProjectEvent
   readonly closeProject: AssetCloseProjectEvent
-  readonly cancelOpeningAllProjects: AssetCancelOpeningAllProjectsEvent
   readonly copy: AssetCopyEvent
   readonly cut: AssetCutEvent
   readonly cancelCut: AssetCancelCutEvent
@@ -105,10 +104,6 @@ export interface AssetCloseProjectEvent extends AssetBaseEvent<AssetEventType.cl
   readonly id: backendModule.ProjectId
 }
 
-/** A signal to cancel automatically opening any project that is currently opening. */
-export interface AssetCancelOpeningAllProjectsEvent
-  extends AssetBaseEvent<AssetEventType.cancelOpeningAllProjects> {}
-
 /** A signal that multiple assets should be copied. `ids` are the `Id`s of the newly created
  * placeholder items. */
 export interface AssetCopyEvent extends AssetBaseEvent<AssetEventType.copy> {
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx
index d462049db879..37e434b69662 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx
@@ -75,7 +75,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
     managesThisAsset || self?.permission === permissions.PermissionAction.edit
   const isRunningProject =
     asset.type === backendModule.AssetType.project &&
-    backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[asset.projectState.type]
+    backendModule.IS_OPENING_OR_OPENED[asset.projectState.type]
   const canExecute =
     backend.type === backendModule.BackendType.local ||
     (self?.permission != null && permissions.PERMISSION_ACTION_CAN_EXECUTE[self.permission])
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
index 99feb289c957..37f3499ac55b 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
@@ -41,6 +41,7 @@ export interface Suggestion {
 
 /** Props for a {@link AssetSearchBar}. */
 export interface AssetSearchBarProps {
+  readonly isCloud: boolean
   readonly query: AssetQuery
   readonly setQuery: React.Dispatch<React.SetStateAction<AssetQuery>>
   readonly labels: backend.Label[]
@@ -49,7 +50,7 @@ export interface AssetSearchBarProps {
 
 /** A search bar containing a text input, and a list of suggestions. */
 export default function AssetSearchBar(props: AssetSearchBarProps) {
-  const { query, setQuery, labels, suggestions: rawSuggestions } = props
+  const { isCloud, query, setQuery, labels, suggestions: rawSuggestions } = props
   /** A cached query as of the start of tabbing. */
   const baseQuery = React.useRef(query)
   const [suggestions, setSuggestions] = React.useState(rawSuggestions)
@@ -86,7 +87,7 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
       querySource.current !== QuerySource.tabbing
     ) {
       if (searchRef.current != null) {
-        searchRef.current.value = query.toString()
+        searchRef.current.value = query.query
       }
     }
   }, [query])
@@ -136,7 +137,10 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
             }
           })
         }
-        if (event.key === 'Enter' || event.key === ' ') {
+        if (
+          event.key === 'Enter' ||
+          (event.key === ' ' && document.activeElement !== searchRef.current)
+        ) {
           querySource.current = QuerySource.external
           if (searchRef.current != null) {
             searchRef.current.focus()
@@ -214,8 +218,12 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
         ref={searchRef}
         type="search"
         size={1}
-        placeholder="Type to search for projects, data connectors, users, and more."
-        className="peer relative z-1 grow bg-transparent leading-5 h-6 py-px xl:placeholder:text-center"
+        placeholder={
+          isCloud
+            ? 'Type to search for projects, Data Links, users, and more.'
+            : 'Type to search for projects.'
+        }
+        className="peer relative z-1 grow bg-transparent leading-5 h-6 py-px placeholder:text-center"
         onChange={event => {
           if (querySource.current !== QuerySource.internal) {
             querySource.current = QuerySource.typing
@@ -244,7 +252,7 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
               data-testid="asset-search-tag-names"
               className="flex flex-wrap gap-2 whitespace-nowrap px-2 pointer-events-auto"
             >
-              {AssetQuery.tagNames.flatMap(entry => {
+              {(isCloud ? AssetQuery.tagNames : AssetQuery.localTagNames).flatMap(entry => {
                 const [key, tag] = entry
                 return tag == null || isShiftPressed !== tag.startsWith('-')
                   ? []
@@ -263,38 +271,41 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
               })}
             </div>
             {/* Asset labels */}
-            <div data-testid="asset-search-labels" className="flex gap-2 p-2 pointer-events-auto">
-              {labels.map(label => {
-                const negated = query.negativeLabels.some(term =>
-                  array.shallowEqual(term, [label.value])
-                )
-                return (
-                  <Label
-                    key={label.id}
-                    color={label.color}
-                    group={false}
-                    active={
-                      negated || query.labels.some(term => array.shallowEqual(term, [label.value]))
-                    }
-                    negated={negated}
-                    onClick={event => {
-                      querySource.current = QuerySource.internal
-                      setQuery(oldQuery => {
-                        const newQuery = assetQuery.toggleLabel(
-                          oldQuery,
-                          label.value,
-                          event.shiftKey
-                        )
-                        baseQuery.current = newQuery
-                        return newQuery
-                      })
-                    }}
-                  >
-                    {label.value}
-                  </Label>
-                )
-              })}
-            </div>
+            {isCloud && (
+              <div data-testid="asset-search-labels" className="flex gap-2 p-2 pointer-events-auto">
+                {labels.map(label => {
+                  const negated = query.negativeLabels.some(term =>
+                    array.shallowEqual(term, [label.value])
+                  )
+                  return (
+                    <Label
+                      key={label.id}
+                      color={label.color}
+                      group={false}
+                      active={
+                        negated ||
+                        query.labels.some(term => array.shallowEqual(term, [label.value]))
+                      }
+                      negated={negated}
+                      onClick={event => {
+                        querySource.current = QuerySource.internal
+                        setQuery(oldQuery => {
+                          const newQuery = assetQuery.toggleLabel(
+                            oldQuery,
+                            label.value,
+                            event.shiftKey
+                          )
+                          baseQuery.current = newQuery
+                          return newQuery
+                        })
+                      }}
+                    >
+                      {label.value}
+                    </Label>
+                  )
+                })}
+              </div>
+            )}
             {/* Suggestions */}
             <div className="flex flex-col max-h-[16rem] overflow-y-auto">
               {suggestions.map((suggestion, index) => (
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
index f7eda5c97675..dd7fa758df9d 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
@@ -280,12 +280,12 @@ export interface AssetsTableState {
   ) => void
   /** Called when the project is opened via the `ProjectActionButton`. */
   readonly doOpenManually: (projectId: backendModule.ProjectId) => void
-  readonly doOpenIde: (
+  readonly doOpenEditor: (
     project: backendModule.ProjectAsset,
     setProject: React.Dispatch<React.SetStateAction<backendModule.ProjectAsset>>,
     switchPage: boolean
   ) => void
-  readonly doCloseIde: (project: backendModule.ProjectAsset) => void
+  readonly doCloseEditor: (project: backendModule.ProjectAsset) => void
   readonly doCreateLabel: (value: string, color: backendModule.LChColor) => Promise<void>
   readonly doCopy: () => void
   readonly doCut: () => void
@@ -324,12 +324,12 @@ export interface AssetsTableProps {
   readonly setAssetPanelProps: React.Dispatch<
     React.SetStateAction<assetPanel.AssetPanelRequiredProps | null>
   >
-  readonly doOpenIde: (
+  readonly doOpenEditor: (
     project: backendModule.ProjectAsset,
     setProject: React.Dispatch<React.SetStateAction<backendModule.ProjectAsset>>,
     switchPage: boolean
   ) => void
-  readonly doCloseIde: (project: backendModule.ProjectAsset) => void
+  readonly doCloseEditor: (project: backendModule.ProjectAsset) => void
   readonly doCreateLabel: (value: string, color: backendModule.LChColor) => Promise<void>
 }
 
@@ -339,7 +339,7 @@ export default function AssetsTable(props: AssetsTableProps) {
   const { deletedLabelNames, initialProjectName, projectStartupInfo } = props
   const { queuedAssetEvents: rawQueuedAssetEvents } = props
   const { assetListEvents, dispatchAssetListEvent, assetEvents, dispatchAssetEvent } = props
-  const { setAssetPanelProps, doOpenIde, doCloseIde: rawDoCloseIde, doCreateLabel } = props
+  const { setAssetPanelProps, doOpenEditor, doCloseEditor: rawDoCloseEditor, doCreateLabel } = props
 
   const { user, userInfo, accessToken } = authProvider.useNonPartialUserSession()
   const { backend } = backendProvider.useBackend()
@@ -513,14 +513,9 @@ export default function AssetsTable(props: AssetsTableProps) {
       switch (sortColumn) {
         case columnUtils.Column.name: {
           compare = (a, b) => {
-            const aTypeOrder = backendModule.ASSET_TYPE_ORDER[a.item.type]
-            const bTypeOrder = backendModule.ASSET_TYPE_ORDER[b.item.type]
-            const typeDelta = aTypeOrder - bTypeOrder
             const aTitle = a.item.title.toLowerCase()
             const bTitle = b.item.title.toLowerCase()
-            if (typeDelta !== 0) {
-              return typeDelta
-            } else if (aTitle === bTitle) {
+            if (aTitle === bTitle) {
               const delta = a.item.title > b.item.title ? 1 : a.item.title < b.item.title ? -1 : 0
               return multiplier * delta
             } else {
@@ -532,16 +527,9 @@ export default function AssetsTable(props: AssetsTableProps) {
         }
         case columnUtils.Column.modified: {
           compare = (a, b) => {
-            const aTypeOrder = backendModule.ASSET_TYPE_ORDER[a.item.type]
-            const bTypeOrder = backendModule.ASSET_TYPE_ORDER[b.item.type]
-            const typeDelta = aTypeOrder - bTypeOrder
-            if (typeDelta !== 0) {
-              return typeDelta
-            } else {
-              const aOrder = Number(new Date(a.item.modifiedAt))
-              const bOrder = Number(new Date(b.item.modifiedAt))
-              return multiplier * (aOrder - bOrder)
-            }
+            const aOrder = Number(new Date(a.item.modifiedAt))
+            const bOrder = Number(new Date(b.item.modifiedAt))
+            return multiplier * (aOrder - bOrder)
           }
           break
         }
@@ -631,12 +619,12 @@ export default function AssetsTable(props: AssetsTableProps) {
         }
         case 'no':
         case '-has': {
-          setSuggestions(SUGGESTIONS_FOR_NO)
+          setSuggestions(isCloud ? SUGGESTIONS_FOR_NO : [])
           break
         }
         case 'has':
         case '-no': {
-          setSuggestions(SUGGESTIONS_FOR_HAS)
+          setSuggestions(isCloud ? SUGGESTIONS_FOR_HAS : [])
           break
         }
         case 'type': {
@@ -738,24 +726,26 @@ export default function AssetsTable(props: AssetsTableProps) {
         case 'label':
         case '-label': {
           setSuggestions(
-            Array.from(
-              allLabels.values(),
-              (label): assetSearchBar.Suggestion => ({
-                render: () => (
-                  <Label active color={label.color} onClick={() => {}}>
-                    {label.value}
-                  </Label>
-                ),
-                addToQuery: oldQuery =>
-                  oldQuery.addToLastTerm(
-                    negative ? { negativeLabels: [label.value] } : { labels: [label.value] }
-                  ),
-                deleteFromQuery: oldQuery =>
-                  oldQuery.deleteFromLastTerm(
-                    negative ? { negativeLabels: [label.value] } : { labels: [label.value] }
-                  ),
-              })
-            )
+            !isCloud
+              ? []
+              : Array.from(
+                  allLabels.values(),
+                  (label): assetSearchBar.Suggestion => ({
+                    render: () => (
+                      <Label active color={label.color} onClick={() => {}}>
+                        {label.value}
+                      </Label>
+                    ),
+                    addToQuery: oldQuery =>
+                      oldQuery.addToLastTerm(
+                        negative ? { negativeLabels: [label.value] } : { labels: [label.value] }
+                      ),
+                    deleteFromQuery: oldQuery =>
+                      oldQuery.deleteFromLastTerm(
+                        negative ? { negativeLabels: [label.value] } : { labels: [label.value] }
+                      ),
+                  })
+                )
           )
 
           break
@@ -766,7 +756,7 @@ export default function AssetsTable(props: AssetsTableProps) {
         }
       }
     }
-  }, [assetTree, query, visibilities, allLabels, /* should never change */ setSuggestions])
+  }, [isCloud, assetTree, query, visibilities, allLabels, /* should never change */ setSuggestions])
 
   React.useEffect(() => {
     if (rawQueuedAssetEvents.length !== 0) {
@@ -837,13 +827,24 @@ export default function AssetsTable(props: AssetsTableProps) {
     (newSelectedKeys: ReadonlySet<backendModule.AssetId>) => {
       selectedKeysRef.current = newSelectedKeys
       setSelectedKeysRaw(newSelectedKeys)
+      if (!isCloud) {
+        setCanDownloadFiles(newSelectedKeys.size !== 0)
+      } else {
+        setCanDownloadFiles(
+          newSelectedKeys.size !== 0 &&
+            Array.from(newSelectedKeys).every(key => {
+              const node = nodeMapRef.current.get(key)
+              return node?.item.type === backendModule.AssetType.file
+            })
+        )
+      }
     },
-    []
+    [isCloud, /* should never change */ setCanDownloadFiles]
   )
 
   const clearSelectedKeys = React.useCallback(() => {
     setSelectedKeys(new Set())
-  }, [/* should never change */ setSelectedKeys])
+  }, [setSelectedKeys])
 
   const overwriteNodes = React.useCallback(
     (newAssets: backendModule.AnyAsset[]) => {
@@ -1544,16 +1545,13 @@ export default function AssetsTable(props: AssetsTableProps) {
     [/* should never change */ dispatchAssetEvent]
   )
 
-  const doCloseIde = React.useCallback(
+  const doCloseEditor = React.useCallback(
     (project: backendModule.ProjectAsset) => {
       if (project.id === projectStartupInfo?.projectAsset.id) {
-        dispatchAssetEvent({
-          type: AssetEventType.cancelOpeningAllProjects,
-        })
-        rawDoCloseIde(project)
+        rawDoCloseEditor(project)
       }
     },
-    [projectStartupInfo, rawDoCloseIde, /* should never change */ dispatchAssetEvent]
+    [projectStartupInfo, rawDoCloseEditor]
   )
 
   const doCopy = React.useCallback(() => {
@@ -1571,7 +1569,7 @@ export default function AssetsTable(props: AssetsTableProps) {
     setSelectedKeys(new Set())
   }, [
     pasteData,
-    /* should never change */ setSelectedKeys,
+    setSelectedKeys,
     /* should never change */ unsetModal,
     /* should never change */ dispatchAssetEvent,
   ])
@@ -1676,8 +1674,8 @@ export default function AssetsTable(props: AssetsTableProps) {
       nodeMap: nodeMapRef,
       doToggleDirectoryExpansion,
       doOpenManually,
-      doOpenIde,
-      doCloseIde,
+      doOpenEditor: doOpenEditor,
+      doCloseEditor: doCloseEditor,
       doCreateLabel,
       doCopy,
       doCut,
@@ -1695,8 +1693,8 @@ export default function AssetsTable(props: AssetsTableProps) {
       query,
       doToggleDirectoryExpansion,
       doOpenManually,
-      doOpenIde,
-      doCloseIde,
+      doOpenEditor,
+      doCloseEditor,
       doCreateLabel,
       doCopy,
       doCut,
@@ -1760,7 +1758,7 @@ export default function AssetsTable(props: AssetsTableProps) {
     return () => {
       document.removeEventListener('click', onDocumentClick)
     }
-  }, [shortcutManager, /* should never change */ setSelectedKeys])
+  }, [shortcutManager, setSelectedKeys])
 
   React.useEffect(() => {
     if (isLoading) {
@@ -1824,12 +1822,7 @@ export default function AssetsTable(props: AssetsTableProps) {
       }
       setPreviouslySelectedKey(key)
     },
-    [
-      displayItems,
-      previouslySelectedKey,
-      shortcutManager,
-      /* should never change */ setSelectedKeys,
-    ]
+    [displayItems, previouslySelectedKey, shortcutManager, setSelectedKeys]
   )
 
   const columns = columnUtils.getColumnList(backend.type, extraColumns)
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
index aed10375ee51..53f725be51d8 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
@@ -31,6 +31,7 @@ import * as backendModule from '#/services/Backend'
 
 import * as array from '#/utilities/array'
 import type AssetQuery from '#/utilities/AssetQuery'
+import * as download from '#/utilities/download'
 import * as github from '#/utilities/github'
 import LocalStorage from '#/utilities/LocalStorage'
 import * as projectManager from '#/utilities/ProjectManager'
@@ -336,7 +337,7 @@ export default function Drive(props: DriveProps) {
                   if (downloadUrl == null) {
                     toastAndLog('Could not find a download link for the current OS')
                   } else {
-                    window.open(downloadUrl, '_blank')
+                    download.download(downloadUrl)
                   }
                 }}
               >
@@ -405,8 +406,8 @@ export default function Drive(props: DriveProps) {
               assetListEvents={assetListEvents}
               dispatchAssetListEvent={dispatchAssetListEvent}
               setAssetPanelProps={setAssetPanelProps}
-              doOpenIde={doOpenEditor}
-              doCloseIde={doCloseEditor}
+              doOpenEditor={doOpenEditor}
+              doCloseEditor={doCloseEditor}
               doCreateLabel={doCreateLabel}
             />
           </div>
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx
index f3558c8caecd..a46d43e01c3d 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx
@@ -177,9 +177,7 @@ export default function DriveBar(props: DriveBarProps) {
             onClick={event => {
               event.stopPropagation()
               unsetModal()
-              dispatchAssetEvent({
-                type: AssetEventType.downloadSelected,
-              })
+              dispatchAssetEvent({ type: AssetEventType.downloadSelected })
             }}
           />
         </div>
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx
index ea1be45bb4b3..6e1692aeb63a 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx
@@ -21,6 +21,7 @@ import type AssetQuery from '#/utilities/AssetQuery'
 export interface TopBarProps {
   /** Whether the application may have the local backend running. */
   readonly supportsLocalBackend: boolean
+  readonly isCloud: boolean
   readonly page: pageSwitcher.Page
   readonly setPage: (page: pageSwitcher.Page) => void
   readonly projectAsset: backendModule.ProjectAsset | null
@@ -43,7 +44,7 @@ export interface TopBarProps {
 /** The {@link TopBarProps.setQuery} parameter is used to communicate with the parent component,
  * because `searchVal` may change parent component's project list. */
 export default function TopBar(props: TopBarProps) {
-  const { supportsLocalBackend, page, setPage, projectAsset, setProjectAsset } = props
+  const { supportsLocalBackend, isCloud, page, setPage, projectAsset, setProjectAsset } = props
   const { isEditorDisabled, setBackendType, isHelpChatOpen, setIsHelpChatOpen } = props
   const { query, setQuery, labels, suggestions, canToggleAssetPanel } = props
   const { isAssetPanelVisible, setIsAssetPanelVisible, doRemoveSelf, onSignOut } = props
@@ -63,6 +64,7 @@ export default function TopBar(props: TopBarProps) {
       ) : (
         <div className="flex-1 flex flex-wrap justify-around">
           <AssetSearchBar
+            isCloud={isCloud}
             query={query}
             setQuery={setQuery}
             labels={labels}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
index 9c535f5c2bae..c6159a27b84f 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
@@ -17,6 +17,7 @@ import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
 import MenuEntry from '#/components/MenuEntry'
 import Modal from '#/components/Modal'
 
+import * as download from '#/utilities/download'
 import * as github from '#/utilities/github'
 import * as shortcutManager from '#/utilities/ShortcutManager'
 
@@ -88,7 +89,7 @@ export default function UserMenu(props: UserMenuProps) {
                     if (downloadUrl == null) {
                       toastAndLog('Could not find a download link for the current OS')
                     } else {
-                      window.open(downloadUrl, '_blank')
+                      download.download(downloadUrl)
                     }
                   }}
                 />
diff --git a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
index 13faad3bf2eb..557aadd6b250 100644
--- a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
+++ b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
@@ -144,6 +144,7 @@ export default function Dashboard(props: DashboardProps) {
     () => session.user?.rootDirectoryId ?? backendModule.DirectoryId(''),
     [session.user]
   )
+  const isCloud = backend.type === backendModule.BackendType.remote
 
   React.useEffect(() => {
     setInitialized(true)
@@ -207,7 +208,7 @@ export default function Dashboard(props: DashboardProps) {
                   savedProjectStartupInfo.projectAsset.id,
                   savedProjectStartupInfo.projectAsset.title
                 )
-                if (backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[oldProject.state.type]) {
+                if (backendModule.IS_OPENING_OR_OPENED[oldProject.state.type]) {
                   await remoteBackendModule.waitUntilProjectIsReady(
                     remoteBackend,
                     savedProjectStartupInfo.projectAsset,
@@ -378,7 +379,7 @@ export default function Dashboard(props: DashboardProps) {
     [rootDirectoryId, /* should never change */ dispatchAssetListEvent]
   )
 
-  const openEditor = React.useCallback(
+  const doOpenEditor = React.useCallback(
     async (
       newProject: backendModule.ProjectAsset,
       setProjectAsset: React.Dispatch<React.SetStateAction<backendModule.ProjectAsset>>,
@@ -400,7 +401,7 @@ export default function Dashboard(props: DashboardProps) {
     [backend, projectStartupInfo?.project.projectId, session.accessToken]
   )
 
-  const closeEditor = React.useCallback((closingProject: backendModule.ProjectAsset) => {
+  const doCloseEditor = React.useCallback((closingProject: backendModule.ProjectAsset) => {
     setProjectStartupInfo(oldInfo =>
       oldInfo?.projectAsset.id === closingProject.id ? null : oldInfo
     )
@@ -408,10 +409,8 @@ export default function Dashboard(props: DashboardProps) {
 
   const doRemoveSelf = React.useCallback(() => {
     if (projectStartupInfo?.projectAsset != null) {
-      dispatchAssetListEvent({
-        type: AssetListEventType.removeSelf,
-        id: projectStartupInfo.projectAsset.id,
-      })
+      const id = projectStartupInfo.projectAsset.id
+      dispatchAssetListEvent({ type: AssetListEventType.removeSelf, id })
       setProjectStartupInfo(null)
     }
   }, [projectStartupInfo?.projectAsset, /* should never change */ dispatchAssetListEvent])
@@ -439,6 +438,7 @@ export default function Dashboard(props: DashboardProps) {
         >
           <TopBar
             supportsLocalBackend={supportsLocalBackend}
+            isCloud={isCloud}
             projectAsset={projectStartupInfo?.projectAsset ?? null}
             setProjectAsset={projectStartupInfo?.setProjectAsset ?? null}
             page={page}
@@ -480,8 +480,8 @@ export default function Dashboard(props: DashboardProps) {
             dispatchAssetEvent={dispatchAssetEvent}
             setAssetPanelProps={setAssetPanelProps}
             doCreateProject={doCreateProject}
-            doOpenEditor={openEditor}
-            doCloseEditor={closeEditor}
+            doOpenEditor={doOpenEditor}
+            doCloseEditor={doCloseEditor}
           />
           <Editor
             hidden={page !== pageSwitcher.Page.editor}
diff --git a/app/ide-desktop/lib/dashboard/src/services/Backend.ts b/app/ide-desktop/lib/dashboard/src/services/Backend.ts
index 7c4bacd1c190..820539b832bd 100644
--- a/app/ide-desktop/lib/dashboard/src/services/Backend.ts
+++ b/app/ide-desktop/lib/dashboard/src/services/Backend.ts
@@ -124,6 +124,7 @@ export interface CreatedDirectory {
 export enum ProjectState {
   created = 'Created',
   new = 'New',
+  scheduled = 'Scheduled',
   openInProgress = 'OpenInProgress',
   provisioned = 'Provisioned',
   opened = 'Opened',
@@ -152,9 +153,22 @@ export interface ProjectStateType {
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
-export const DOES_PROJECT_STATE_INDICATE_VM_EXISTS: Readonly<Record<ProjectState, boolean>> = {
+export const IS_OPENING: Readonly<Record<ProjectState, boolean>> = {
   [ProjectState.created]: false,
   [ProjectState.new]: false,
+  [ProjectState.scheduled]: true,
+  [ProjectState.openInProgress]: true,
+  [ProjectState.provisioned]: true,
+  [ProjectState.opened]: false,
+  [ProjectState.closed]: false,
+  [ProjectState.placeholder]: true,
+  [ProjectState.closing]: false,
+}
+
+export const IS_OPENING_OR_OPENED: Readonly<Record<ProjectState, boolean>> = {
+  [ProjectState.created]: false,
+  [ProjectState.new]: false,
+  [ProjectState.scheduled]: true,
   [ProjectState.openInProgress]: true,
   [ProjectState.provisioned]: true,
   [ProjectState.opened]: true,
@@ -225,8 +239,8 @@ export interface ProjectStartupInfo {
   readonly accessToken: string | null
 }
 
-/** Metadata describing an uploaded file. */
-export interface File {
+/** Metadata describing the location of an uploaded file. */
+export interface FileLocator {
   readonly fileId: FileId
   readonly fileName: string | null
   readonly path: S3FilePath
@@ -241,9 +255,17 @@ export interface FileInfo {
   readonly project: CreatedProject | null
 }
 
+/** Metadata for a file. */
+export interface FileMetadata {
+  readonly size: number
+}
+
 /** All metadata related to a file. */
 export interface FileDetails {
-  readonly file: File
+  readonly file: FileLocator
+  readonly metadata: FileMetadata
+  /** On the Remote (Cloud) Backend, this is a S3 url that is valid for only 120 seconds. */
+  readonly url?: string
 }
 
 /** A secret environment variable. */
@@ -862,7 +884,6 @@ export interface UpdateProjectRequestBody {
 
 /** HTTP request body for the "open project" endpoint. */
 export interface OpenProjectRequestBody {
-  readonly forceCreate: boolean
   readonly executeAsync: boolean
 }
 
@@ -1091,7 +1112,7 @@ export default abstract class Backend {
   /** Return project memory, processor and storage usage. */
   abstract checkResources(projectId: ProjectId, title: string | null): Promise<ResourceUsage>
   /** Return a list of files accessible by the current user. */
-  abstract listFiles(): Promise<File[]>
+  abstract listFiles(): Promise<FileLocator[]>
   /** Upload a file. */
   abstract uploadFile(params: UploadFileRequestParams, file: Blob): Promise<FileInfo>
   /** Return file details. */
diff --git a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
index 55fa81f68f2a..f8aff3ce0dcd 100644
--- a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
+++ b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
@@ -31,10 +31,7 @@ const STATUS_SERVER_ERROR = 500
 const ONE_DAY_MS = 86_400_000
 
 /** Default HTTP body for an "open project" request. */
-const DEFAULT_OPEN_PROJECT_BODY: backendModule.OpenProjectRequestBody = {
-  forceCreate: false,
-  executeAsync: false,
-}
+const DEFAULT_OPEN_PROJECT_BODY: backendModule.OpenProjectRequestBody = { executeAsync: false }
 
 // =============
 // === Types ===
@@ -71,7 +68,7 @@ export async function waitUntilProjectIsReady(
   abortController: AbortController = new AbortController()
 ) {
   let project = await backend.getProjectDetails(item.id, item.title)
-  if (!backendModule.DOES_PROJECT_STATE_INDICATE_VM_EXISTS[project.state.type]) {
+  if (!backendModule.IS_OPENING_OR_OPENED[project.state.type]) {
     await backend.openProject(item.id, null, item.title)
   }
   let nextCheckTimestamp = 0
@@ -109,7 +106,7 @@ export interface ListProjectsResponseBody {
 
 /** HTTP response body for the "list files" endpoint. */
 export interface ListFilesResponseBody {
-  readonly files: backendModule.File[]
+  readonly files: backendModule.FileLocator[]
 }
 
 /** HTTP response body for the "list secrets" endpoint. */
@@ -641,7 +638,7 @@ export default class RemoteBackend extends Backend {
 
   /** Return a list of files accessible by the current user.
    * @throws An error if a non-successful status code (not 200-299) was received. */
-  override async listFiles(): Promise<backendModule.File[]> {
+  override async listFiles(): Promise<backendModule.FileLocator[]> {
     const path = remoteBackendPaths.LIST_FILES_PATH
     const response = await this.get<ListFilesResponseBody>(path)
     if (!responseIsSuccessful(response)) {
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/AssetQuery.ts b/app/ide-desktop/lib/dashboard/src/utilities/AssetQuery.ts
index 7aa3e14d80d1..cc30cfc1d86b 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/AssetQuery.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/AssetQuery.ts
@@ -63,6 +63,21 @@ export default class AssetQuery {
     ['nos', 'no'],
     ['negativeNos', 'has'],
   ] as const satisfies readonly (readonly [keyof AssetQueryData, string | null])[]
+  /** The subset of {@link AssetQuery.tagNames} that are applicable for the Local Backend. */
+  // `key` MUST be a string literal type.
+  // eslint-disable-next-line no-restricted-syntax
+  static localTagNames = [
+    ['keywords', null],
+    ['negativeKeywords', '-'],
+    ['names', 'name'],
+    ['negativeNames', '-name'],
+    ['types', 'type'],
+    ['negativeTypes', '-type'],
+    ['extensions', 'extension'],
+    ['negativeExtensions', '-extension'],
+    ['modifieds', 'modified'],
+    ['negativeModifieds', '-modified'],
+  ] as const satisfies readonly (readonly [keyof AssetQueryData, string | null])[]
 
   readonly query
 

From 207f6a06e5b0b74ae9cdd1dbda9c795fe4018941 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 01:34:43 +1000
Subject: [PATCH 19/26] Fix E2E tests (#9185)

- Fix #9184
- It turns out the logic for handling macOS was already present elsewhere - and even *in the same file*! It seems like this was an oversight

# Important Notes
None
---
 app/gui2/e2e/componentBrowser.spec.ts | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/app/gui2/e2e/componentBrowser.spec.ts b/app/gui2/e2e/componentBrowser.spec.ts
index ae7093605599..5e7239fcd34d 100644
--- a/app/gui2/e2e/componentBrowser.spec.ts
+++ b/app/gui2/e2e/componentBrowser.spec.ts
@@ -5,7 +5,8 @@ import * as actions from './actions'
 import * as customExpect from './customExpect'
 import * as locate from './locate'
 
-const ACCEPT_SUGGESTION_SHORTCUT = os.platform() === 'darwin' ? 'Meta+Enter' : 'Control+Enter'
+const CONTROL_KEY = os.platform() === 'darwin' ? 'Meta' : 'Control'
+const ACCEPT_SUGGESTION_SHORTCUT = `${CONTROL_KEY}+Enter`
 
 async function deselectAllNodes(page: Page) {
   await page.keyboard.press('Escape')
@@ -155,7 +156,7 @@ test('Editing existing nodes', async ({ page }) => {
   const ADDED_PATH = '"/home/enso/Input.txt"'
 
   // Start node editing
-  await locate.graphNodeIcon(node).click({ modifiers: ['Control'] })
+  await locate.graphNodeIcon(node).click({ modifiers: [CONTROL_KEY] })
   await expect(locate.componentBrowser(page)).toBeVisible()
   const input = locate.componentBrowserInput(page).locator('input')
   await expect(input).toHaveValue('Data.read')

From d71e8c47427f51c22a13bb68ee8a1270bbc02ff0 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 01:50:00 +1000
Subject: [PATCH 20/26] Move "change password" to settings (#9079)

- Close https://github.com/enso-org/cloud-v2/issues/893
- Remove "Change Password" modal
- Remove "Change Password" option from user menu
- Add "Change Password" section to "General -> Account" in settings

# Important Notes
None
---
 .../lib/assets/change_password.svg            |   9 -
 app/ide-desktop/lib/dashboard/e2e/actions.ts  |  46 ++-
 app/ide-desktop/lib/dashboard/e2e/api.ts      |  16 +-
 .../lib/dashboard/e2e/changePassword.spec.ts  |  58 ++++
 .../dashboard/e2e/changePasswordModal.spec.ts |  50 ----
 .../lib/dashboard/src/components/Input.tsx    |  14 +-
 .../layouts/dashboard/ChangePasswordModal.tsx | 103 -------
 .../dashboard/Settings/AccountSettingsTab.tsx | 262 +++++++++++++-----
 .../Settings/OrganizationSettingsTab.tsx      |  97 +++----
 .../src/layouts/dashboard/UserMenu.tsx        |  21 +-
 .../src/utilities/ShortcutManager.ts          |   4 -
 .../lib/dashboard/src/utilities/validation.ts |   1 +
 12 files changed, 325 insertions(+), 356 deletions(-)
 delete mode 100644 app/ide-desktop/lib/assets/change_password.svg
 create mode 100644 app/ide-desktop/lib/dashboard/e2e/changePassword.spec.ts
 delete mode 100644 app/ide-desktop/lib/dashboard/e2e/changePasswordModal.spec.ts
 delete mode 100644 app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChangePasswordModal.tsx

diff --git a/app/ide-desktop/lib/assets/change_password.svg b/app/ide-desktop/lib/assets/change_password.svg
deleted file mode 100644
index 0127a1bf209f..000000000000
--- a/app/ide-desktop/lib/assets/change_password.svg
+++ /dev/null
@@ -1,9 +0,0 @@
-<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <rect opacity="0.2" y="3" width="16" height="10" rx="2" fill="black" />
-    <path d="M10 0H12V16H10V0Z" fill="black" />
-    <path d="M8 0H14V2H8V0Z" fill="black" />
-    <path d="M8 14H14V16H8V14Z" fill="black" />
-    <path d="M2 8L8 8" stroke="black" />
-    <path d="M6.5 10.6L3.5 5.4" stroke="black" />
-    <path d="M3.5 10.6L6.5 5.4" stroke="black" />
-</svg>
\ No newline at end of file
diff --git a/app/ide-desktop/lib/dashboard/e2e/actions.ts b/app/ide-desktop/lib/dashboard/e2e/actions.ts
index 696c7846f65a..de99299df3de 100644
--- a/app/ide-desktop/lib/dashboard/e2e/actions.ts
+++ b/app/ide-desktop/lib/dashboard/e2e/actions.ts
@@ -35,9 +35,9 @@ export function locateConfirmPasswordInput(page: test.Locator | test.Page) {
   return page.getByLabel('Confirm password')
 }
 
-/** Find an "old password" input (if any) on the current page. */
-export function locateOldPasswordInput(page: test.Locator | test.Page) {
-  return page.getByLabel('Old password')
+/** Find a "current password" input (if any) on the current page. */
+export function locateCurrentPasswordInput(page: test.Locator | test.Page) {
+  return page.getByPlaceholder('Enter your current password')
 }
 
 /** Find a "new password" input (if any) on the current page. */
@@ -94,41 +94,34 @@ export function locateAssetRowName(locator: test.Locator) {
 
 // === Button locators ===
 
-/** Find a toast close button (if any) on the current page. */
+/** Find a toast close button (if any) on the current locator. */
 export function locateToastCloseButton(page: test.Locator | test.Page) {
   // There is no other simple way to uniquely identify this element.
   // eslint-disable-next-line no-restricted-properties
   return page.locator('.Toastify__close-button')
 }
 
-/** Find a login button (if any) on the current page. */
+/** Find a "login" button (if any) on the current locator. */
 export function locateLoginButton(page: test.Locator | test.Page) {
   return page.getByRole('button', { name: 'Login', exact: true }).getByText('Login')
 }
 
-/** Find a register button (if any) on the current page. */
+/** Find a "register" button (if any) on the current locator. */
 export function locateRegisterButton(page: test.Locator | test.Page) {
   return page.getByRole('button', { name: 'Register' }).getByText('Register')
 }
 
-/** Find a reset button (if any) on the current page. */
-export function locateResetButton(page: test.Locator | test.Page) {
-  return page.getByRole('button', { name: 'Reset' }).getByText('Reset')
+/** Find a "change" button (if any) on the current locator. */
+export function locateChangeButton(page: test.Locator | test.Page) {
+  return page.getByRole('button', { name: 'Change' }).getByText('Change')
 }
 
-/** Find a user menu button (if any) on the current page. */
+/** Find a user menu button (if any) on the current locator. */
 export function locateUserMenuButton(page: test.Locator | test.Page) {
   return page.getByAltText('Open user menu')
 }
 
-/** Find a change password button (if any) on the current page. */
-export function locateChangePasswordButton(page: test.Locator | test.Page) {
-  return page
-    .getByRole('button', { name: 'Change your password' })
-    .getByText('Change your password')
-}
-
-/** Find a "sign out" button (if any) on the current page. */
+/** Find a "sign out" button (if any) on the current locator. */
 export function locateLogoutButton(page: test.Locator | test.Page) {
   return page.getByRole('button', { name: 'Logout' }).getByText('Logout')
 }
@@ -498,12 +491,6 @@ export function locateCollapsibleDirectories(page: test.Page) {
   return locateAssetRows(page).filter({ has: page.getByAltText('Collapse') })
 }
 
-/** Find a "change password" modal (if any) on the current page. */
-export function locateChangePasswordModal(page: test.Locator | test.Page) {
-  // This has no identifying features.
-  return page.getByTestId('change-password-modal')
-}
-
 /** Find a "confirm delete" modal (if any) on the current page. */
 export function locateConfirmDeleteModal(page: test.Locator | test.Page) {
   // This has no identifying features.
@@ -645,12 +632,11 @@ export async function press(page: test.Page, keyOrShortcut: string) {
     await test.test.step('Detect browser OS', async () => {
       userAgent = await page.evaluate(() => navigator.userAgent)
     })
-    // This should be `Meta` (`Cmd`) on macOS, and `Control` on all other systems
-    const ctrlKey = /\bMac OS\b/i.test(userAgent) ? 'Meta' : 'Control'
-    const deleteKey = /\bMac OS\b/i.test(userAgent) ? 'Backspace' : 'Delete'
-    await page.keyboard.press(
-      keyOrShortcut.replace(/\bMod\b/g, ctrlKey).replace(/\bDelete\b/, deleteKey)
-    )
+    const isMacOS = /\bMac OS\b/i.test(userAgent)
+    const ctrlKey = isMacOS ? 'Meta' : 'Control'
+    const deleteKey = isMacOS ? 'Backspace' : 'Delete'
+    const shortcut = keyOrShortcut.replace(/\bMod\b/, ctrlKey).replace(/\bDelete\b/, deleteKey)
+    await test.test.step(`Press '${shortcut}'`, () => page.keyboard.press(shortcut))
   } else {
     await page.keyboard.press(keyOrShortcut)
   }
diff --git a/app/ide-desktop/lib/dashboard/e2e/api.ts b/app/ide-desktop/lib/dashboard/e2e/api.ts
index 616394e0650f..cdaae4663c2e 100644
--- a/app/ide-desktop/lib/dashboard/e2e/api.ts
+++ b/app/ide-desktop/lib/dashboard/e2e/api.ts
@@ -59,6 +59,7 @@ export async function mockApi({ page }: MockParams) {
     rootDirectoryId: defaultDirectoryId,
   }
   let currentUser: backend.User | null = defaultUser
+  let currentOrganization: backend.OrganizationInfo | null = null
   const assetMap = new Map<backend.AssetId, backend.AnyAsset>()
   const deletedAssets = new Set<backend.AssetId>()
   const assets: backend.AnyAsset[] = []
@@ -578,8 +579,13 @@ export async function mockApi({ page }: MockParams) {
       }
     )
     await page.route(BASE_URL + remoteBackendPaths.USERS_ME_PATH + '*', async route => {
+      await route.fulfill({ json: currentUser })
+    })
+    await page.route(BASE_URL + remoteBackendPaths.GET_ORGANIZATION_PATH + '*', async route => {
       await route.fulfill({
-        json: currentUser,
+        json: currentOrganization,
+        // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+        status: currentOrganization == null ? 404 : 200,
       })
     })
     await page.route(BASE_URL + remoteBackendPaths.CREATE_TAG_PATH + '*', async route => {
@@ -696,6 +702,14 @@ export async function mockApi({ page }: MockParams) {
     setCurrentUser: (user: backend.User | null) => {
       currentUser = user
     },
+    /** Returns the current value of `currentUser`. This is a getter, so its return value
+     * SHOULD NOT be cached. */
+    get currentOrganization() {
+      return currentOrganization
+    },
+    setCurrentOrganization: (user: backend.OrganizationInfo | null) => {
+      currentOrganization = user
+    },
     addAsset,
     deleteAsset,
     undeleteAsset,
diff --git a/app/ide-desktop/lib/dashboard/e2e/changePassword.spec.ts b/app/ide-desktop/lib/dashboard/e2e/changePassword.spec.ts
new file mode 100644
index 000000000000..f8a6e0f5cf1d
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/e2e/changePassword.spec.ts
@@ -0,0 +1,58 @@
+/** @file Test the "change password" modal. */
+import * as test from '@playwright/test'
+
+import * as actions from './actions'
+
+test.test.beforeEach(actions.mockAllAndLogin)
+
+test.test('change password', async ({ page }) => {
+  await actions.press(page, 'Mod+,')
+
+  await actions.locateCurrentPasswordInput(page).fill(actions.VALID_PASSWORD)
+  await actions.locateNewPasswordInput(page).fill(actions.INVALID_PASSWORD)
+  await test
+    .expect(actions.locateChangeButton(page), 'incomplete form should be rejected')
+    .toBeDisabled()
+
+  // Invalid new password
+  await actions.locateCurrentPasswordInput(page).fill(actions.VALID_PASSWORD)
+  await actions.locateNewPasswordInput(page).fill(actions.INVALID_PASSWORD)
+  await actions.locateConfirmNewPasswordInput(page).fill(actions.INVALID_PASSWORD)
+  test
+    .expect(
+      await actions
+        .locateNewPasswordInput(page)
+        .evaluate((element: HTMLInputElement) => element.validity.valid),
+      'invalid new password should be rejected'
+    )
+    .toBe(false)
+  await test
+    .expect(actions.locateChangeButton(page), 'invalid new password should be rejected')
+    .toBeDisabled()
+
+  // Invalid new password confirmation
+  await actions.locateCurrentPasswordInput(page).fill(actions.VALID_PASSWORD)
+  await actions.locateNewPasswordInput(page).fill(actions.VALID_PASSWORD)
+  await actions.locateConfirmNewPasswordInput(page).fill(actions.VALID_PASSWORD + 'a')
+  test
+    .expect(
+      await actions
+        .locateConfirmNewPasswordInput(page)
+        .evaluate((element: HTMLInputElement) => element.validity.valid),
+      'invalid new password confirmation should be rejected'
+    )
+    .toBe(false)
+  await test
+    .expect(
+      actions.locateChangeButton(page),
+      'invalid new password confirmation should be rejected'
+    )
+    .toBeDisabled()
+
+  // After form submission
+  await actions.locateConfirmNewPasswordInput(page).fill(actions.VALID_PASSWORD)
+  await actions.locateChangeButton(page).click()
+  await test.expect(actions.locateCurrentPasswordInput(page)).toHaveText('')
+  await test.expect(actions.locateNewPasswordInput(page)).toHaveText('')
+  await test.expect(actions.locateConfirmNewPasswordInput(page)).toHaveText('')
+})
diff --git a/app/ide-desktop/lib/dashboard/e2e/changePasswordModal.spec.ts b/app/ide-desktop/lib/dashboard/e2e/changePasswordModal.spec.ts
deleted file mode 100644
index 3b753bf6be03..000000000000
--- a/app/ide-desktop/lib/dashboard/e2e/changePasswordModal.spec.ts
+++ /dev/null
@@ -1,50 +0,0 @@
-/** @file Test the "change password" modal. */
-import * as test from '@playwright/test'
-
-import * as actions from './actions'
-
-test.test.beforeEach(actions.mockAllAndLogin)
-
-test.test('change password modal', async ({ page }) => {
-  // Change password modal
-  await actions.locateUserMenuButton(page).click()
-  await actions.locateChangePasswordButton(page).click()
-  await test.expect(actions.locateChangePasswordModal(page)).toBeVisible()
-
-  // Invalid old password
-  await actions.locateOldPasswordInput(page).fill(actions.INVALID_PASSWORD)
-  test
-    .expect(
-      await page.evaluate(() => document.querySelector('form')?.checkValidity()),
-      'form should reject invalid old password'
-    )
-    .toBe(false)
-  await actions.locateResetButton(page).click()
-
-  // Invalid new password
-  await actions.locateOldPasswordInput(page).fill(actions.VALID_PASSWORD)
-  await actions.locateNewPasswordInput(page).fill(actions.INVALID_PASSWORD)
-  test
-    .expect(
-      await page.evaluate(() => document.querySelector('form')?.checkValidity()),
-      'form should reject invalid new password'
-    )
-    .toBe(false)
-  await actions.locateResetButton(page).click()
-
-  // Invalid new password confirmation
-  await actions.locateNewPasswordInput(page).fill(actions.VALID_PASSWORD)
-  await actions.locateConfirmNewPasswordInput(page).fill(actions.INVALID_PASSWORD)
-  test
-    .expect(
-      await page.evaluate(() => document.querySelector('form')?.checkValidity()),
-      'form should reject invalid new password confirmation'
-    )
-    .toBe(false)
-  await actions.locateResetButton(page).click()
-
-  // After form submission
-  await actions.locateConfirmNewPasswordInput(page).fill(actions.VALID_PASSWORD)
-  await actions.locateResetButton(page).click()
-  await test.expect(actions.locateChangePasswordModal(page)).not.toBeAttached()
-})
diff --git a/app/ide-desktop/lib/dashboard/src/components/Input.tsx b/app/ide-desktop/lib/dashboard/src/components/Input.tsx
index a07a881c4999..4f28a05da7f2 100644
--- a/app/ide-desktop/lib/dashboard/src/components/Input.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/Input.tsx
@@ -22,13 +22,14 @@ export interface InputProps extends controlledInput.ControlledInputProps {
 
 /** A styled input that includes an icon. */
 export default function Input(props: InputProps) {
-  const { allowShowingPassword = false, label, icon, footer, ...passthrough } = props
+  const { allowShowingPassword = false, label, icon, type, footer, ...passthrough } = props
   const [isShowingPassword, setIsShowingPassword] = React.useState(false)
+
   const input = (
     <div className="relative">
       <SvgIcon src={icon} />
-      <ControlledInput {...passthrough} type={isShowingPassword ? 'text' : props.type} />
-      {props.type === 'password' && allowShowingPassword && (
+      <ControlledInput {...passthrough} type={isShowingPassword ? 'text' : type} />
+      {type === 'password' && allowShowingPassword && (
         <SvgIcon
           src={isShowingPassword ? EyeIcon : EyeCrossedIcon}
           className="cursor-pointer rounded-full"
@@ -40,13 +41,14 @@ export default function Input(props: InputProps) {
       )}
     </div>
   )
-  return label != null || footer != null ? (
+
+  return label == null && footer == null ? (
+    input
+  ) : (
     <label className="flex flex-col gap-1">
       {label}
       {input}
       {footer}
     </label>
-  ) : (
-    input
   )
 }
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChangePasswordModal.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChangePasswordModal.tsx
deleted file mode 100644
index 94cb89ed5619..000000000000
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChangePasswordModal.tsx
+++ /dev/null
@@ -1,103 +0,0 @@
-/** @file A modal for changing the user's password. */
-import * as React from 'react'
-
-import ArrowRightIcon from 'enso-assets/arrow_right.svg'
-import LockIcon from 'enso-assets/lock.svg'
-
-import * as authProvider from '#/providers/AuthProvider'
-import * as modalProvider from '#/providers/ModalProvider'
-
-import Input from '#/components/Input'
-import Modal from '#/components/Modal'
-import SubmitButton from '#/components/SubmitButton'
-
-import * as string from '#/utilities/string'
-import * as validation from '#/utilities/validation'
-
-// ===========================
-// === ChangePasswordModal ===
-// ===========================
-
-/** A modal for changing the user's password. */
-export default function ChangePasswordModal() {
-  const { user } = authProvider.useNonPartialUserSession()
-  const { changePassword } = authProvider.useAuth()
-  const { unsetModal } = modalProvider.useSetModal()
-
-  const [oldPassword, setOldPassword] = React.useState('')
-  const [newPassword, setNewPassword] = React.useState('')
-  const [confirmNewPassword, setConfirmNewPassword] = React.useState('')
-  const [isSubmitting, setIsSubmitting] = React.useState(false)
-
-  return (
-    <Modal centered className="bg-dim">
-      <form
-        data-testid="change-password-modal"
-        className="flex flex-col gap-6 bg-frame-selected backdrop-blur-3xl rounded-2xl p-8 w-full max-w-md"
-        onSubmit={async event => {
-          event.preventDefault()
-          setIsSubmitting(true)
-          const success = await changePassword(oldPassword, newPassword)
-          setIsSubmitting(false)
-          if (success) {
-            unsetModal()
-          }
-        }}
-        onClick={event => {
-          event.stopPropagation()
-        }}
-      >
-        <div className="self-center text-xl">Change your password</div>
-        <input type="text" autoComplete="username" hidden value={user?.email} />
-        <Input
-          autoFocus
-          required
-          validate
-          allowShowingPassword
-          id="old_password"
-          type="password"
-          name="old_password"
-          autoComplete="current-password"
-          label="Old password"
-          icon={LockIcon}
-          placeholder="Enter your old password"
-          error={validation.PASSWORD_ERROR}
-          value={oldPassword}
-          setValue={setOldPassword}
-          className="text-sm placeholder-gray-500 pl-10 pr-4 rounded-full w-full py-2"
-        />
-        <Input
-          required
-          validate
-          allowShowingPassword
-          type="password"
-          autoComplete="new-password"
-          label="New password"
-          icon={LockIcon}
-          placeholder="Enter your new password"
-          pattern={validation.PASSWORD_PATTERN}
-          error={validation.PASSWORD_ERROR}
-          value={newPassword}
-          setValue={setNewPassword}
-          className="text-sm placeholder-gray-500 pl-10 pr-4 rounded-full w-full py-2"
-        />
-        <Input
-          required
-          validate
-          allowShowingPassword
-          type="password"
-          autoComplete="new-password"
-          label="Confirm new password"
-          icon={LockIcon}
-          placeholder="Confirm your new password"
-          pattern={string.regexEscape(newPassword)}
-          error={validation.CONFIRM_PASSWORD_ERROR}
-          value={confirmNewPassword}
-          setValue={setConfirmNewPassword}
-          className="text-sm placeholder-gray-500 pl-10 pr-4 rounded-full w-full py-2"
-        />
-        <SubmitButton disabled={isSubmitting} text="Reset" icon={ArrowRightIcon} />
-      </form>
-    </Modal>
-  )
-}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
index f468d9c66071..bacced196c7f 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
@@ -2,6 +2,8 @@
 import * as React from 'react'
 
 import DefaultUserIcon from 'enso-assets/default_user.svg'
+import EyeCrossedIcon from 'enso-assets/eye_crossed.svg'
+import EyeIcon from 'enso-assets/eye.svg'
 
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
@@ -9,46 +11,91 @@ import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
+import SvgMask from '#/components/SvgMask'
+
 import * as object from '#/utilities/object'
+import * as uniqueString from '#/utilities/uniqueString'
+import * as validation from '#/utilities/validation'
 
 import ConfirmDeleteUserModal from '../ConfirmDeleteUserModal'
 
-// =================
-// === InfoEntry ===
-// =================
+// =============
+// === Input ===
+// =============
 
-/** Props for a transparent wrapper component. */
-interface InternalTransparentWrapperProps {
-  readonly children: React.ReactNode
+/** Props for an {@link Input}. */
+interface InternalInputProps {
+  readonly originalValue: string
+  readonly type?: string
+  readonly placeholder?: string
+  readonly onChange?: React.ChangeEventHandler<HTMLInputElement>
+  readonly onSubmit?: (value: string) => void
 }
 
-/** A transparent wrapper component */
-// This is a React component even though it does not contain JSX.
-// eslint-disable-next-line no-restricted-syntax
-function Name(props: InternalTransparentWrapperProps) {
-  return props.children
-}
+/** A styled input. */
+function Input(props: InternalInputProps) {
+  const { originalValue, type, placeholder, onChange, onSubmit } = props
+  const [isShowingPassword, setIsShowingPassword] = React.useState(false)
+  const cancelled = React.useRef(false)
 
-/** A transparent wrapper component */
-// This is a React component even though it does not contain JSX.
-// eslint-disable-next-line no-restricted-syntax
-function Value(props: InternalTransparentWrapperProps) {
-  return props.children
-}
+  const onKeyDown = (event: React.KeyboardEvent<HTMLInputElement>) => {
+    switch (event.key) {
+      case 'Escape': {
+        cancelled.current = true
+        event.stopPropagation()
+        event.currentTarget.value = originalValue
+        event.currentTarget.blur()
+        break
+      }
+      case 'Enter': {
+        cancelled.current = false
+        event.stopPropagation()
+        event.currentTarget.blur()
+        break
+      }
+      case 'Tab': {
+        cancelled.current = false
+        event.currentTarget.blur()
+        break
+      }
+      default: {
+        cancelled.current = false
+        break
+      }
+    }
+  }
 
-/** Props for a {@link InfoEntry}. */
-interface InternalInfoEntryProps {
-  readonly children: [React.ReactNode, React.ReactNode]
-}
+  const input = (
+    <input
+      className="rounded-full font-bold leading-5 w-full h-6 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors placeholder-primary/30 invalid:border invalid:border-red-700"
+      type={isShowingPassword ? 'text' : type}
+      size={1}
+      defaultValue={originalValue}
+      placeholder={placeholder}
+      onKeyDown={onKeyDown}
+      onChange={onChange}
+      onBlur={event => {
+        if (!cancelled.current) {
+          onSubmit?.(event.currentTarget.value)
+        }
+      }}
+    />
+  )
 
-/** Styled information display containing key and value. */
-function InfoEntry(props: InternalInfoEntryProps) {
-  const { children } = props
-  const [name, value] = children
-  return (
-    <div className="flex gap-4.75">
-      <span className="leading-5 w-12 h-8 py-1.25">{name}</span>
-      <span className="grow font-bold leading-5 h-8 py-1.25">{value}</span>
+  return type !== 'password' ? (
+    input
+  ) : (
+    <div className="relative">
+      {input}
+      {
+        <SvgMask
+          src={isShowingPassword ? EyeIcon : EyeCrossedIcon}
+          className="absolute cursor-pointer rounded-full right-2 top-1"
+          onClick={() => {
+            setIsShowingPassword(show => !show)
+          }}
+        />
+      }
     </div>
   )
 }
@@ -60,15 +107,24 @@ function InfoEntry(props: InternalInfoEntryProps) {
 /** Settings tab for viewing and editing account information. */
 export default function AccountSettingsTab() {
   const toastAndLog = toastAndLogHooks.useToastAndLog()
-  const { setUser, signOut } = authProvider.useAuth()
+  const { setUser, changePassword, signOut } = authProvider.useAuth()
   const { setModal } = modalProvider.useSetModal()
   const { backend } = backendProvider.useBackend()
-  const { user } = authProvider.useNonPartialUserSession()
-  const nameInputRef = React.useRef<HTMLInputElement>(null)
+  const { user, accessToken } = authProvider.useNonPartialUserSession()
+  const [passwordFormKey, setPasswordFormKey] = React.useState('')
+  const [currentPassword, setCurrentPassword] = React.useState('')
+  const [newPassword, setNewPassword] = React.useState('')
+  const [confirmNewPassword, setConfirmNewPassword] = React.useState('')
+
+  // The shape of the JWT payload is statically known.
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+  const username: string | null =
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-non-null-assertion
+    accessToken != null ? JSON.parse(atob(accessToken.split('.')[1]!)).username : null
+  const canChangePassword = username != null ? !/^Github_|^Google_/.test(username) : false
 
-  const doUpdateName = async () => {
+  const doUpdateName = async (newName: string) => {
     const oldName = user?.name ?? ''
-    const newName = nameInputRef.current?.value ?? ''
     if (newName === oldName) {
       return
     } else {
@@ -77,9 +133,6 @@ export default function AccountSettingsTab() {
         setUser(object.merger({ name: newName }))
       } catch (error) {
         toastAndLog(null, error)
-        if (nameInputRef.current) {
-          nameInputRef.current.value = oldName
-        }
       }
       return
     }
@@ -108,45 +161,106 @@ export default function AccountSettingsTab() {
         <div className="flex flex-col gap-2.5">
           <h3 className="font-bold text-xl h-9.5 py-0.5">User Account</h3>
           <div className="flex flex-col">
-            <InfoEntry>
-              <Name>Name</Name>
-              <Value>
-                <input
-                  ref={nameInputRef}
-                  className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors"
-                  key={user?.name}
-                  type="text"
-                  size={1}
-                  defaultValue={user?.name ?? ''}
-                  onBlur={doUpdateName}
-                  onKeyDown={event => {
-                    switch (event.key) {
-                      case 'Escape': {
-                        event.stopPropagation()
-                        event.currentTarget.value = user?.name ?? ''
-                        event.currentTarget.blur()
-                        break
-                      }
-                      case 'Enter': {
-                        event.stopPropagation()
-                        event.currentTarget.blur()
-                        break
-                      }
-                      case 'Tab': {
-                        event.currentTarget.blur()
-                        break
-                      }
-                    }
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-12 h-8 py-1.25">Name</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
+                <Input originalValue={user?.name ?? ''} onSubmit={doUpdateName} />
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-12 h-8 py-1.25">Email</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">{user?.email ?? ''}</span>
+            </div>
+          </div>
+        </div>
+        {canChangePassword && (
+          <div key={passwordFormKey}>
+            <h3 className="font-bold text-xl h-9.5 py-0.5">Change Password</h3>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-36 h-8 py-1.25">Current Password</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
+                <Input
+                  type="password"
+                  originalValue=""
+                  placeholder="Enter your current password"
+                  onChange={event => {
+                    setCurrentPassword(event.currentTarget.value)
                   }}
                 />
-              </Value>
-            </InfoEntry>
-            <InfoEntry>
-              <Name>Email</Name>
-              <Value>{user?.email ?? ''}</Value>
-            </InfoEntry>
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-36 h-8 py-1.25">New Password</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
+                <Input
+                  type="password"
+                  originalValue=""
+                  placeholder="Enter your new password"
+                  onChange={event => {
+                    const newValue = event.currentTarget.value
+                    setNewPassword(newValue)
+                    event.currentTarget.setCustomValidity(
+                      newValue === '' || validation.PASSWORD_REGEX.test(newValue)
+                        ? ''
+                        : validation.PASSWORD_ERROR
+                    )
+                  }}
+                />
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-36 h-8 py-1.25">Confirm New Password</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
+                <Input
+                  type="password"
+                  originalValue=""
+                  placeholder="Confirm your new password"
+                  onChange={event => {
+                    const newValue = event.currentTarget.value
+                    setConfirmNewPassword(newValue)
+                    event.currentTarget.setCustomValidity(
+                      newValue === '' || newValue === newPassword ? '' : 'Passwords must match.'
+                    )
+                  }}
+                />
+              </span>
+            </div>
+            <div className="flex gap-2">
+              <button
+                disabled={
+                  currentPassword === '' ||
+                  newPassword === '' ||
+                  confirmNewPassword === '' ||
+                  newPassword !== confirmNewPassword ||
+                  !validation.PASSWORD_REGEX.test(newPassword)
+                }
+                type="submit"
+                className="text-white bg-invite font-medium rounded-full h-6 py-px px-2 -my-px disabled:opacity-50"
+                onClick={() => {
+                  setPasswordFormKey(uniqueString.uniqueString())
+                  setCurrentPassword('')
+                  setNewPassword('')
+                  setConfirmNewPassword('')
+                  void changePassword(currentPassword, newPassword)
+                }}
+              >
+                Change
+              </button>
+              <button
+                type="button"
+                className="bg-frame-selected font-medium rounded-full h-6 py-px px-2 -my-px"
+                onClick={() => {
+                  setPasswordFormKey(uniqueString.uniqueString())
+                  setCurrentPassword('')
+                  setNewPassword('')
+                  setConfirmNewPassword('')
+                }}
+              >
+                Cancel
+              </button>
+            </div>
           </div>
-        </div>
+        )}
         <div className="flex flex-col gap-2.5 rounded-2.5xl border-2 border-danger px-4 pt-2.25 pb-3.75">
           <h3 className="text-danger font-bold text-xl h-9.5 py-0.5">Danger Zone</h3>
           <div className="flex gap-2">
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
index 78c8dd0b9eee..19dbc637d16c 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
@@ -13,46 +13,6 @@ import * as backendModule from '#/services/Backend'
 
 import * as object from '#/utilities/object'
 
-// =================
-// === InfoEntry ===
-// =================
-
-/** Props for a transparent wrapper component. */
-interface InternalTransparentWrapperProps {
-  readonly children: React.ReactNode
-}
-
-/** A transparent wrapper component */
-// This is a React component even though it does not contain JSX.
-// eslint-disable-next-line no-restricted-syntax
-function Name(props: InternalTransparentWrapperProps) {
-  return props.children
-}
-
-/** A transparent wrapper component */
-// This is a React component even though it does not contain JSX.
-// eslint-disable-next-line no-restricted-syntax
-function Value(props: InternalTransparentWrapperProps) {
-  return props.children
-}
-
-/** Props for a {@link InfoEntry}. */
-interface InternalInfoEntryProps {
-  readonly children: [React.ReactNode, React.ReactNode]
-}
-
-/** Styled information display containing key and value. */
-function InfoEntry(props: InternalInfoEntryProps) {
-  const { children } = props
-  const [name, value] = children
-  return (
-    <div className="flex gap-4.75">
-      <span className="leading-5 w-40 h-8 py-1.25">{name}</span>
-      <span className="grow font-bold leading-5 h-8 py-1.25">{value}</span>
-    </div>
-  )
-}
-
 // ===============================
 // === OrganizationSettingsTab ===
 // ===============================
@@ -202,9 +162,26 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
         <div className="flex flex-col gap-2.5">
           <h3 className="font-bold text-xl h-9.5 py-0.5">Organization</h3>
           <div className="flex flex-col">
-            <InfoEntry>
-              <Name>Organization display name</Name>
-              <Value>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-40 h-8 py-1.25">Organization display name</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
+                <input
+                  ref={nameRef}
+                  className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors"
+                  key={organization.organization_name}
+                  type="text"
+                  size={1}
+                  defaultValue={organization.organization_name ?? ''}
+                  onBlur={doUpdateName}
+                  onKeyDown={event => {
+                    onKeyDown(event, organization.organization_name ?? '')
+                  }}
+                />
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-40 h-8 py-1.25">Organization display name</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
                 <input
                   ref={nameRef}
                   className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors"
@@ -217,11 +194,11 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
                     onKeyDown(event, organization.organization_name ?? '')
                   }}
                 />
-              </Value>
-            </InfoEntry>
-            <InfoEntry>
-              <Name>Email</Name>
-              <Value>
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-40 h-8 py-1.25">Email</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
                 <input
                   ref={emailRef}
                   className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors invalid:border invalid:border-red-700"
@@ -245,11 +222,11 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
                     )
                   }}
                 />
-              </Value>
-            </InfoEntry>
-            <InfoEntry>
-              <Name>Website</Name>
-              <Value>
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-40 h-8 py-1.25">Website</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
                 <input
                   ref={websiteRef}
                   className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors"
@@ -262,11 +239,11 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
                     onKeyDown(event, organization.website ?? '')
                   }}
                 />
-              </Value>
-            </InfoEntry>
-            <InfoEntry>
-              <Name>Location</Name>
-              <Value>
+              </span>
+            </div>
+            <div className="flex gap-4.75">
+              <span className="leading-5 w-40 h-8 py-1.25">Location</span>
+              <span className="grow font-bold leading-5 h-8 py-1.25">
                 <input
                   ref={locationRef}
                   className="rounded-full font-bold leading-5 w-full h-8 -mx-2 -my-1.25 px-2 py-1.25 bg-transparent hover:bg-frame-selected focus:bg-frame-selected transition-colors"
@@ -279,8 +256,8 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
                     onKeyDown(event, organization.address ?? '')
                   }}
                 />
-              </Value>
-            </InfoEntry>
+              </span>
+            </div>
           </div>
         </div>
       </div>
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
index c6159a27b84f..11eff7089799 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
@@ -11,7 +11,6 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 import * as authProvider from '#/providers/AuthProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
-import ChangePasswordModal from '#/layouts/dashboard/ChangePasswordModal'
 import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
 
 import MenuEntry from '#/components/MenuEntry'
@@ -39,17 +38,10 @@ export default function UserMenu(props: UserMenuProps) {
   const { hidden = false, setPage, supportsLocalBackend, onSignOut } = props
   const navigate = navigateHooks.useNavigate()
   const { signOut } = authProvider.useAuth()
-  const { accessToken, user } = authProvider.useNonPartialUserSession()
-  const { setModal, unsetModal } = modalProvider.useSetModal()
+  const { user } = authProvider.useNonPartialUserSession()
+  const { unsetModal } = modalProvider.useSetModal()
   const toastAndLog = toastAndLogHooks.useToastAndLog()
 
-  // The shape of the JWT payload is statically known.
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-  const username: string | null =
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-non-null-assertion
-    accessToken != null ? JSON.parse(atob(accessToken.split('.')[1]!)).username : null
-  const canChangePassword = username != null ? !/^Github_|^Google_/.test(username) : false
-
   return (
     <Modal hidden={hidden} className="absolute overflow-hidden bg-dim w-full h-full">
       <div
@@ -70,15 +62,6 @@ export default function UserMenu(props: UserMenuProps) {
               <span className="leading-170 h-6 py-px">{user.name}</span>
             </div>
             <div className="flex flex-col">
-              {canChangePassword && (
-                <MenuEntry
-                  action={shortcutManager.KeyboardAction.changeYourPassword}
-                  paddingClassName="p-1"
-                  doAction={() => {
-                    setModal(<ChangePasswordModal />)
-                  }}
-                />
-              )}
               {!supportsLocalBackend && (
                 <MenuEntry
                   action={shortcutManager.KeyboardAction.downloadApp}
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts b/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
index 63289cc5fcfe..0c196d522522 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
@@ -8,7 +8,6 @@ import AddNetworkIcon from 'enso-assets/add_network.svg'
 import AppDownloadIcon from 'enso-assets/app_download.svg'
 import BlankIcon from 'enso-assets/blank_16.svg'
 import CameraIcon from 'enso-assets/camera.svg'
-import ChangePasswordIcon from 'enso-assets/change_password.svg'
 import CloseIcon from 'enso-assets/close.svg'
 import CloudToIcon from 'enso-assets/cloud_to.svg'
 import CopyIcon from 'enso-assets/copy.svg'
@@ -87,7 +86,6 @@ export enum KeyboardAction {
   newDataLink = 'new-data-link',
   closeModal = 'close-modal',
   cancelEditName = 'cancel-edit-name',
-  changeYourPassword = 'change-your-password',
   signIn = 'sign-in',
   signOut = 'sign-out',
   downloadApp = 'download-app',
@@ -471,7 +469,6 @@ const DEFAULT_KEYBOARD_SHORTCUTS: Readonly<Record<KeyboardAction, KeyboardShortc
   ],
   [KeyboardAction.closeModal]: [keybind(KeyboardAction.closeModal, [], 'Escape')],
   [KeyboardAction.cancelEditName]: [keybind(KeyboardAction.cancelEditName, [], 'Escape')],
-  [KeyboardAction.changeYourPassword]: [],
   [KeyboardAction.signIn]: [],
   [KeyboardAction.signOut]: [],
   [KeyboardAction.downloadApp]: [],
@@ -520,7 +517,6 @@ const DEFAULT_KEYBOARD_SHORTCUT_INFO: Readonly<Record<KeyboardAction, ShortcutIn
   // These should not appear in any context menus.
   [KeyboardAction.closeModal]: { name: 'Close', icon: BlankIcon },
   [KeyboardAction.cancelEditName]: { name: 'Cancel Editing', icon: BlankIcon },
-  [KeyboardAction.changeYourPassword]: { name: 'Change Your Password', icon: ChangePasswordIcon },
   [KeyboardAction.signIn]: { name: 'Login', icon: SignInIcon },
   [KeyboardAction.signOut]: { name: 'Logout', icon: SignOutIcon, colorClass: 'text-delete' },
   [KeyboardAction.downloadApp]: { name: 'Download App', icon: AppDownloadIcon },
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/validation.ts b/app/ide-desktop/lib/dashboard/src/utilities/validation.ts
index 5853a057de2b..3c83eb20c81f 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/validation.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/validation.ts
@@ -22,6 +22,7 @@ export const PASSWORD_PATTERN =
 export const PASSWORD_ERROR =
   'Your password must include numbers, letters (both lowercase and uppercase) and symbols, ' +
   'and must be between 6 and 256 characters long.'
+export const PASSWORD_REGEX = new RegExp('^' + PASSWORD_PATTERN + '$')
 
 export const CONFIRM_PASSWORD_ERROR = 'Passwords must match.'
 

From 86d268b198e57ca962e9a92a3514c6f5a455bae2 Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 02:40:52 +1000
Subject: [PATCH 21/26] Fix type error caused by bad merge (#9189)

---
 app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
index f8aff3ce0dcd..b02ecbbc776d 100644
--- a/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
+++ b/app/ide-desktop/lib/dashboard/src/services/RemoteBackend.ts
@@ -882,7 +882,7 @@ export default class RemoteBackend extends Backend {
       { plan } satisfies backendModule.CreateCheckoutSessionRequestBody
     )
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not create checkout session for plan '${plan}'.`)
+      return this.throw(`Could not create checkout session for plan '${plan}'.`, response)
     } else {
       return await response.json()
     }
@@ -896,7 +896,7 @@ export default class RemoteBackend extends Backend {
     const path = remoteBackendPaths.getCheckoutSessionPath(sessionId)
     const response = await this.get<backendModule.CheckoutSessionStatus>(path)
     if (!responseIsSuccessful(response)) {
-      return this.throw(`Could not get checkout session for session ID '${sessionId}'.`)
+      return this.throw(`Could not get checkout session for session ID '${sessionId}'.`, response)
     } else {
       return await response.json()
     }

From a7251eb8d461454231eee61bce117bc298889cef Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 02:49:49 +1000
Subject: [PATCH 22/26] Improve mouse and keyboard UX (#9100)

- Close https://github.com/enso-org/cloud-v2/issues/914
- Add selection brush for selecting multiple assets using mouse
- Port selection brush over from GUI2
- Support <kbd>Ctrl</kbd>-select to select multiple ranges
- Add various actions when *exactly one* asset is selected:
- <kbd>Enter</kbd> for various assets to trigger their double-click actions
- Projects are opened
- Directories are toggled open/closed
- Secrets show the "upsert secret modal"
- <kbd>ArrowLeft</kbd> now collapses the selected folder
- <kbd>ArrowRight</kbd> now expands the selected folder
- <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> change the selected asset to the previous/next asset
- The newly selected asset (technically: any asset that is the only selected asset, whether this is a result of a drag, mouse click, or keypress) is automatically smoothly scrolled to.
- Improvements to the search bar
- <kbd>Escape</kbd> cancels tabbing through suggestions (and discards the selected suggestion)
- <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> behave like <kbd>Shift</kbd>+<kbd>Tab</kbd> and <kbd>Tab</kbd> to move to the previous/next suggestion respectively
- <kbd>Shift</kbd>+<kbd>ArrowUp</kbd> and <kbd>Shift</kbd>+<kbd>ArrowDown</kbd> to select multiple assets using the keyboard
- <kbd>Ctrl</kbd>+<kbd>Space</kbd> to toggle assets using the keyboard
- <kbd>Escape</kbd> to deselect all assets
- Add CSS-only focus ring to highlight most recently selected item, but only when navigating via keyboard
- Enter and double-click to temporarily open the sidebar to edit a Data Link

Optional features that have not yet been implemented:
- Move the "update secret" modal to the sidebar as well

# Important Notes
None
---
 .../src/components/SelectionBrush.tsx         | 184 +++++++
 .../src/components/dashboard/AssetRow.tsx     |  68 +--
 .../dashboard/DataLinkNameColumn.tsx          |   4 +-
 .../src/components/dashboard/column.ts        |   2 +-
 .../lib/dashboard/src/hooks/animationHooks.ts | 115 +++++
 .../src/layouts/dashboard/AssetSearchBar.tsx  |  19 +-
 .../src/layouts/dashboard/AssetsTable.tsx     | 459 +++++++++++++++---
 .../dashboard/src/layouts/dashboard/Drive.tsx |   8 +-
 .../dashboard/Settings/AccountSettingsTab.tsx |   7 +-
 .../Settings/OrganizationSettingsTab.tsx      |   7 +-
 .../layouts/dashboard/UpsertSecretModal.tsx   |   1 +
 .../src/layouts/dashboard/UserBar.tsx         |   1 +
 .../src/layouts/dashboard/UserMenu.tsx        |   7 +-
 .../src/pages/dashboard/Dashboard.tsx         |   8 +-
 .../src/pages/subscribe/Subscribe.tsx         |   2 +-
 .../lib/dashboard/src/tailwind.css            |   2 +-
 .../src/utilities/ShortcutManager.ts          |   2 +-
 .../lib/dashboard/src/utilities/geometry.ts   |  19 +
 .../lib/dashboard/tailwind.config.js          |   5 +-
 19 files changed, 810 insertions(+), 110 deletions(-)
 create mode 100644 app/ide-desktop/lib/dashboard/src/components/SelectionBrush.tsx
 create mode 100644 app/ide-desktop/lib/dashboard/src/hooks/animationHooks.ts
 create mode 100644 app/ide-desktop/lib/dashboard/src/utilities/geometry.ts

diff --git a/app/ide-desktop/lib/dashboard/src/components/SelectionBrush.tsx b/app/ide-desktop/lib/dashboard/src/components/SelectionBrush.tsx
new file mode 100644
index 000000000000..cc9f98a56fd6
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/components/SelectionBrush.tsx
@@ -0,0 +1,184 @@
+/** @file A selection brush to indicate the area being selected by the mouse drag action. */
+import * as React from 'react'
+
+import * as reactDom from 'react-dom'
+
+import * as animationHooks from '#/hooks/animationHooks'
+
+import * as modalProvider from '#/providers/ModalProvider'
+
+import type * as geometry from '#/utilities/geometry'
+
+// ======================
+// === SelectionBrush ===
+// ======================
+
+/** Props for a {@link SelectionBrush}. */
+export interface SelectionBrushProps {
+  readonly onDrag: (rectangle: geometry.DetailedRectangle, event: MouseEvent) => void
+  readonly onDragEnd: (event: MouseEvent) => void
+  readonly onDragCancel: () => void
+}
+
+/** A selection brush to indicate the area being selected by the mouse drag action. */
+export default function SelectionBrush(props: SelectionBrushProps) {
+  const { onDrag, onDragEnd, onDragCancel } = props
+  const { modalRef } = modalProvider.useModalRef()
+  const isMouseDownRef = React.useRef(false)
+  const didMoveWhileDraggingRef = React.useRef(false)
+  const onDragRef = React.useRef(onDrag)
+  const onDragEndRef = React.useRef(onDragEnd)
+  const onDragCancelRef = React.useRef(onDragCancel)
+  const lastMouseEvent = React.useRef<MouseEvent | null>(null)
+  const [anchor, setAnchor] = React.useState<geometry.Coordinate2D | null>(null)
+  // This will be `null` if `anchor` is `null`.
+  const [position, setPosition] = React.useState<geometry.Coordinate2D | null>(null)
+  const [lastSetAnchor, setLastSetAnchor] = React.useState<geometry.Coordinate2D | null>(null)
+  // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+  const anchorAnimFactor = animationHooks.useApproach(anchor != null ? 1 : 0, 60)
+  const hidden =
+    anchor == null ||
+    position == null ||
+    (anchor.left === position.left && anchor.top === position.top)
+
+  React.useEffect(() => {
+    onDragRef.current = onDrag
+  }, [onDrag])
+
+  React.useEffect(() => {
+    onDragEndRef.current = onDragEnd
+  }, [onDragEnd])
+
+  React.useEffect(() => {
+    onDragCancelRef.current = onDragCancel
+  }, [onDragCancel])
+
+  React.useEffect(() => {
+    if (anchor != null) {
+      anchorAnimFactor.skip()
+    }
+  }, [anchorAnimFactor, anchor])
+
+  React.useEffect(() => {
+    const onMouseDown = (event: MouseEvent) => {
+      if (
+        modalRef.current == null &&
+        !(event.target instanceof HTMLInputElement) &&
+        !(event.target instanceof HTMLTextAreaElement) &&
+        (!(event.target instanceof HTMLElement) || !event.target.isContentEditable) &&
+        !(event.target instanceof HTMLButtonElement) &&
+        !(event.target instanceof HTMLAnchorElement)
+      ) {
+        isMouseDownRef.current = true
+        didMoveWhileDraggingRef.current = false
+        lastMouseEvent.current = event
+        const newAnchor = { left: event.pageX, top: event.pageY }
+        setAnchor(newAnchor)
+        setLastSetAnchor(newAnchor)
+        setPosition(newAnchor)
+      }
+    }
+    const onMouseUp = (event: MouseEvent) => {
+      if (didMoveWhileDraggingRef.current) {
+        onDragEndRef.current(event)
+      }
+      // The `setTimeout` is required, otherwise the values are changed before the `onClick` handler
+      // is executed.
+      window.setTimeout(() => {
+        isMouseDownRef.current = false
+        didMoveWhileDraggingRef.current = false
+      })
+      setAnchor(null)
+    }
+    const onMouseMove = (event: MouseEvent) => {
+      if (!(event.buttons & 1)) {
+        isMouseDownRef.current = false
+      }
+      if (isMouseDownRef.current) {
+        // Left click is being held.
+        didMoveWhileDraggingRef.current = true
+        lastMouseEvent.current = event
+        setPosition({ left: event.pageX, top: event.pageY })
+      }
+    }
+    const onClick = (event: MouseEvent) => {
+      if (isMouseDownRef.current && didMoveWhileDraggingRef.current) {
+        event.stopImmediatePropagation()
+      }
+    }
+    const onDragStart = () => {
+      if (isMouseDownRef.current) {
+        isMouseDownRef.current = false
+        onDragCancelRef.current()
+        setAnchor(null)
+      }
+    }
+    document.addEventListener('mousedown', onMouseDown)
+    document.addEventListener('mouseup', onMouseUp)
+    document.addEventListener('dragstart', onDragStart, { capture: true })
+    document.addEventListener('mousemove', onMouseMove)
+    document.addEventListener('click', onClick)
+    return () => {
+      document.removeEventListener('mousedown', onMouseDown)
+      document.removeEventListener('mouseup', onMouseUp)
+      document.removeEventListener('dragstart', onDragStart, { capture: true })
+      document.removeEventListener('mousemove', onMouseMove)
+      document.removeEventListener('click', onClick)
+    }
+  }, [/* should never change */ modalRef])
+
+  const rectangle = React.useMemo(() => {
+    if (position != null && lastSetAnchor != null) {
+      const start: geometry.Coordinate2D = {
+        left:
+          position.left * (1 - anchorAnimFactor.value) +
+          lastSetAnchor.left * anchorAnimFactor.value,
+        top:
+          position.top * (1 - anchorAnimFactor.value) + lastSetAnchor.top * anchorAnimFactor.value,
+      }
+      return {
+        left: Math.min(position.left, start.left),
+        top: Math.min(position.top, start.top),
+        right: Math.max(position.left, start.left),
+        bottom: Math.max(position.top, start.top),
+        width: Math.abs(position.left - start.left),
+        height: Math.abs(position.top - start.top),
+        signedWidth: position.left - start.left,
+        signedHeight: position.top - start.top,
+      }
+    } else {
+      return null
+    }
+  }, [anchorAnimFactor.value, lastSetAnchor, position])
+
+  const selectionRectangle = React.useMemo(() => (hidden ? null : rectangle), [hidden, rectangle])
+
+  React.useEffect(() => {
+    if (selectionRectangle != null && lastMouseEvent.current != null) {
+      onDrag(selectionRectangle, lastMouseEvent.current)
+    }
+    // `onChange` is a callback, not a dependency.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [selectionRectangle])
+
+  const brushStyle =
+    rectangle == null
+      ? {}
+      : {
+          left: `${rectangle.left}px`,
+          top: `${rectangle.top}px`,
+          width: `${rectangle.width}px`,
+          height: `${rectangle.height}px`,
+        }
+
+  return reactDom.createPortal(
+    <div
+      className={`fixed bg-selection-brush pointer-events-none box-content rounded-lg border-transparent z-1 transition-border-margin duration-100 ${
+        hidden ? 'border-0 m-0' : 'border-6 -m-1.5'
+      }`}
+      style={brushStyle}
+    />,
+    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    document.getElementById('enso-dashboard')!
+  )
+}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
index dd5bdb7247a5..d09c3fffefad 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
@@ -40,10 +40,11 @@ import Visibility, * as visibilityModule from '#/utilities/visibility'
 // === Constants ===
 // =================
 
+/** The height of the header row. */
+const HEADER_HEIGHT_PX = 34
 /** The amount of time (in milliseconds) the drag item must be held over this component
  * to make a directory row expand. */
 const DRAG_EXPAND_DELAY_MS = 500
-
 /** Placeholder row for directories that are empty. */
 const EMPTY_DIRECTORY_PLACEHOLDER = <span className="px-2 opacity-75">This folder is empty.</span>
 
@@ -70,7 +71,8 @@ export interface AssetRowProps
   readonly columns: columnUtils.Column[]
   readonly selected: boolean
   readonly setSelected: (selected: boolean) => void
-  readonly isSoleSelectedItem: boolean
+  readonly isSoleSelected: boolean
+  readonly isKeyboardSelected: boolean
   readonly allowContextMenu: boolean
   readonly onClick: (props: AssetRowInnerProps, event: React.MouseEvent) => void
   readonly onContextMenu?: (
@@ -81,10 +83,11 @@ export interface AssetRowProps
 
 /** A row containing an {@link backendModule.AnyAsset}. */
 export default function AssetRow(props: AssetRowProps) {
-  const { item: rawItem, hidden: hiddenRaw, selected, isSoleSelectedItem, setSelected } = props
-  const { allowContextMenu, onContextMenu, state, columns, onClick } = props
+  const { item: rawItem, hidden: hiddenRaw, selected, isSoleSelected, isKeyboardSelected } = props
+  const { setSelected, allowContextMenu, onContextMenu, state, columns, onClick } = props
   const { visibilities, assetEvents, dispatchAssetEvent, dispatchAssetListEvent } = state
   const { setAssetPanelProps, doToggleDirectoryExpansion, doCopy, doCut, doPaste } = state
+  const { setIsAssetPanelTemporarilyVisible, scrollContainerRef } = state
 
   const { user, userInfo } = authProvider.useNonPartialUserSession()
   const { backend } = backendProvider.useBackend()
@@ -149,10 +152,7 @@ export default function AssetRow(props: AssetRowProps) {
       } catch (error) {
         toastAndLog(`Could not copy '${asset.title}'`, error)
         // Delete the new component representing the asset that failed to insert.
-        dispatchAssetListEvent({
-          type: AssetListEventType.delete,
-          key: item.key,
-        })
+        dispatchAssetListEvent({ type: AssetListEventType.delete, key: item.key })
       }
     },
     [
@@ -184,10 +184,7 @@ export default function AssetRow(props: AssetRowProps) {
           item: asset,
         })
         setItem(oldItem =>
-          oldItem.with({
-            directoryKey: nonNullNewParentKey,
-            directoryId: nonNullNewParentId,
-          })
+          oldItem.with({ directoryKey: nonNullNewParentKey, directoryId: nonNullNewParentId })
         )
         setAsset(object.merger({ parentId: nonNullNewParentId }))
         await backend.updateAsset(
@@ -225,10 +222,16 @@ export default function AssetRow(props: AssetRowProps) {
   )
 
   React.useEffect(() => {
-    if (isSoleSelectedItem) {
+    if (isSoleSelected) {
       setAssetPanelProps({ item, setItem })
+      setIsAssetPanelTemporarilyVisible(false)
     }
-  }, [item, isSoleSelectedItem, /* should never change */ setAssetPanelProps])
+  }, [
+    item,
+    isSoleSelected,
+    /* should never change */ setAssetPanelProps,
+    /* should never change */ setIsAssetPanelTemporarilyVisible,
+  ])
 
   const doDelete = React.useCallback(async () => {
     setInsertionVisibility(Visibility.hidden)
@@ -242,10 +245,7 @@ export default function AssetRow(props: AssetRowProps) {
       })
     }
     try {
-      dispatchAssetListEvent({
-        type: AssetListEventType.willDelete,
-        key: item.key,
-      })
+      dispatchAssetListEvent({ type: AssetListEventType.willDelete, key: item.key })
       if (
         asset.type === backendModule.AssetType.project &&
         backend.type === backendModule.BackendType.local
@@ -263,10 +263,7 @@ export default function AssetRow(props: AssetRowProps) {
         }
       }
       await backend.deleteAsset(asset.id, asset.title)
-      dispatchAssetListEvent({
-        type: AssetListEventType.delete,
-        key: item.key,
-      })
+      dispatchAssetListEvent({ type: AssetListEventType.delete, key: item.key })
     } catch (error) {
       setInsertionVisibility(Visibility.visible)
       toastAndLog(
@@ -287,10 +284,7 @@ export default function AssetRow(props: AssetRowProps) {
     setInsertionVisibility(Visibility.hidden)
     try {
       await backend.undoDeleteAsset(asset.id, asset.title)
-      dispatchAssetListEvent({
-        type: AssetListEventType.delete,
-        key: item.key,
-      })
+      dispatchAssetListEvent({ type: AssetListEventType.delete, key: item.key })
     } catch (error) {
       setInsertionVisibility(Visibility.visible)
       toastAndLog(`Unable to restore ${backendModule.ASSET_TYPE_NAME[asset.type]}`, error)
@@ -558,9 +552,25 @@ export default function AssetRow(props: AssetRowProps) {
             <tr
               draggable
               tabIndex={-1}
-              className={`h-8 transition duration-300 ease-in-out ${
+              ref={element => {
+                if (isSoleSelected && element != null && scrollContainerRef.current != null) {
+                  const rect = element.getBoundingClientRect()
+                  const scrollRect = scrollContainerRef.current.getBoundingClientRect()
+                  const scrollUp = rect.top - (scrollRect.top + HEADER_HEIGHT_PX)
+                  const scrollDown = rect.bottom - scrollRect.bottom
+                  if (scrollUp < 0 || scrollDown > 0) {
+                    scrollContainerRef.current.scrollBy({
+                      top: scrollUp < 0 ? scrollUp : scrollDown,
+                      behavior: 'smooth',
+                    })
+                  }
+                }
+              }}
+              className={`h-8 transition duration-300 ease-in-out rounded-full outline-2 -outline-offset-2 outline-prmary ${
                 visibilityModule.CLASS_NAME[visibility]
-              } ${isDraggedOver || selected ? 'selected' : ''}`}
+              } ${isKeyboardSelected ? 'outline' : ''} ${
+                isDraggedOver || selected ? 'selected' : ''
+              }`}
               onClick={event => {
                 unsetModal()
                 onClick(innerProps, event)
@@ -690,7 +700,7 @@ export default function AssetRow(props: AssetRowProps) {
                       setItem={setItem}
                       selected={selected}
                       setSelected={setSelected}
-                      isSoleSelectedItem={isSoleSelectedItem}
+                      isSoleSelected={isSoleSelected}
                       state={state}
                       rowState={rowState}
                       setRowState={setRowState}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
index 1273af36a4d6..cba02c1d9a8e 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
@@ -36,7 +36,7 @@ export interface DataLinkNameColumnProps extends column.AssetColumnProps {}
  * This should never happen. */
 export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
   const { item, setItem, selected, state, rowState, setRowState } = props
-  const { assetEvents, dispatchAssetListEvent } = state
+  const { assetEvents, dispatchAssetListEvent, setIsAssetPanelTemporarilyVisible } = state
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
   const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
@@ -130,7 +130,7 @@ export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
           setRowState(object.merger({ isEditingName: true }))
         } else if (eventModule.isDoubleClick(event)) {
           event.stopPropagation()
-          // FIXME: Open sidebar and show DataLinkInput populated with the current value
+          setIsAssetPanelTemporarilyVisible(true)
         }
       }}
     >
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts b/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
index 539d66b94004..59ee46de6909 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
@@ -24,7 +24,7 @@ export interface AssetColumnProps {
   readonly setItem: React.Dispatch<React.SetStateAction<AssetTreeNode>>
   readonly selected: boolean
   readonly setSelected: (selected: boolean) => void
-  readonly isSoleSelectedItem: boolean
+  readonly isSoleSelected: boolean
   readonly state: assetsTable.AssetsTableState
   readonly rowState: assetsTable.AssetRowState
   readonly setRowState: React.Dispatch<React.SetStateAction<assetsTable.AssetRowState>>
diff --git a/app/ide-desktop/lib/dashboard/src/hooks/animationHooks.ts b/app/ide-desktop/lib/dashboard/src/hooks/animationHooks.ts
new file mode 100644
index 000000000000..e63f94c7b971
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/hooks/animationHooks.ts
@@ -0,0 +1,115 @@
+/** @file React Hooks for running a callback on every frame, and smooth interpolation. */
+import * as React from 'react'
+
+// ==============
+// === useRaf ===
+// ==============
+
+/** Details for a callback used in {@link useRaf}. */
+interface RafCallback {
+  readonly fn: (t: number, dt: number) => void
+  readonly priority: number
+}
+
+const RAF_CALLBACKS: RafCallback[] = []
+
+/**
+ * Use `requestAnimationFrame` API to perform animation. The callback will be called every frame
+ * while the `active` watch source returns true value.
+ *
+ * For performing simple easing animations, see [`useApproach`].
+ * @param active - As long as it returns true value, the `fn` callback will be called every frame.
+ * @param fn - The callback to call every animation frame.
+ * @param priority - When multiple callbacks are registered, the one with the lowest priority number
+ * will be called first. Default priority is 0. For callbacks with the same priority, the order of
+ * execution matches the order of registration.
+ */
+export function useRaf(active: boolean, fn: (t: number, dt: number) => void, priority = 0): void {
+  const callback = React.useMemo(() => ({ fn, priority }), [fn, priority])
+  React.useEffect(() => {
+    if (active) {
+      const idx = RAF_CALLBACKS.findIndex(cb => cb.priority > priority)
+      if (idx >= 0) {
+        RAF_CALLBACKS.splice(idx, 0, callback)
+      } else {
+        RAF_CALLBACKS.push(callback)
+        runRaf()
+      }
+      return () => {
+        const i = RAF_CALLBACKS.indexOf(callback)
+        if (i >= 0) {
+          RAF_CALLBACKS.splice(i, 1)
+        }
+      }
+    } else {
+      return
+    }
+  }, [active, callback, priority])
+}
+
+let animTime = 0
+let rafRunning = false
+
+/** Run all callbacks registered by {@link useRaf} in a continuous loop. */
+function tick(time: number) {
+  const lastTime = animTime
+  const delta = Math.max(0, time - lastTime)
+  animTime = time
+  if (RAF_CALLBACKS.length > 0) {
+    requestAnimationFrame(tick)
+    for (const callback of RAF_CALLBACKS) {
+      callback.fn(time, delta)
+    }
+  } else {
+    rafRunning = false
+  }
+}
+
+/** Run the continuous loop using {@link tick}, if it is not already running. */
+function runRaf() {
+  if (!rafRunning) {
+    rafRunning = true
+    animTime = window.performance.now()
+    requestAnimationFrame(tick)
+  }
+}
+
+// ===================
+// === useApproach ===
+// ===================
+
+/**
+ * Animate value over time using exponential approach.
+ * http://badladns.com/stories/exp-approach
+ * @param target - Target value to approach.
+ * @param timeHorizon - Time at which the approach will be at 63% of the target value. Effectively
+ * represents a speed of the approach. Lower values means faster animation.
+ * @param epsilon - The approach will stop when the difference between the current value and the
+ * target value is less than `epsilon`. This is to prevent the animation from running forever.
+ */
+export function useApproach(
+  target: number,
+  // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+  timeHorizon: number = 100,
+  // eslint-disable-next-line @typescript-eslint/no-magic-numbers
+  epsilon = 0.005
+) {
+  const [value, setValue] = React.useState(target)
+  const targetRef = React.useRef(target)
+
+  React.useEffect(() => {
+    setValue(target)
+    targetRef.current = target
+  }, [target])
+
+  useRaf(target !== value, (_, dt) => {
+    const diff = value - target
+    setValue(Math.abs(diff) <= epsilon ? target : target + diff / Math.exp(dt / timeHorizon))
+  })
+
+  const skip = React.useCallback(() => {
+    setValue(targetRef.current)
+  }, [])
+
+  return { value, skip }
+}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
index 37f3499ac55b..976e4884c3e3 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
@@ -125,12 +125,14 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
     const onKeyDown = (event: KeyboardEvent) => {
       setIsShiftPressed(event.shiftKey)
       if (areSuggestionsVisibleRef.current) {
-        if (event.key === 'Tab') {
+        if (event.key === 'Tab' || event.key === 'ArrowUp' || event.key === 'ArrowDown') {
           event.preventDefault()
+          event.stopImmediatePropagation()
           querySource.current = QuerySource.tabbing
+          const reverse = (event.key === 'Tab' && event.shiftKey) || event.key === 'ArrowUp'
           setSelectedIndex(oldIndex => {
             const length = Math.max(1, suggestionsRef.current.length)
-            if (event.shiftKey) {
+            if (reverse) {
               return oldIndex == null ? length - 1 : (oldIndex + length - 1) % length
             } else {
               return oldIndex == null ? 0 : (oldIndex + 1) % length
@@ -153,7 +155,13 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
         }
       }
       if (event.key === 'Escape') {
-        searchRef.current?.blur()
+        if (querySource.current === QuerySource.tabbing) {
+          querySource.current = QuerySource.external
+          setQuery(baseQuery.current)
+          setAreSuggestionsVisible(false)
+        } else {
+          searchRef.current?.blur()
+        }
       }
       // Allow `alt` key to be pressed in case it is being used to enter special characters.
       if (
@@ -161,7 +169,8 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
         !(event.target instanceof HTMLTextAreaElement) &&
         (!(event.target instanceof HTMLElement) || !event.target.isContentEditable) &&
         (!(event.target instanceof Node) || rootRef.current?.contains(event.target) !== true) &&
-        shortcutManager.isTextInputEvent(event)
+        shortcutManager.isTextInputEvent(event) &&
+        event.key !== ' '
       ) {
         searchRef.current?.focus()
       }
@@ -182,7 +191,7 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
       document.removeEventListener('keydown', onKeyDown)
       document.removeEventListener('keyup', onKeyUp)
     }
-  }, [])
+  }, [setQuery])
 
   // Reset `querySource` after all other effects have run.
   React.useEffect(() => {
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
index dd7fa758df9d..152a33e9bfe2 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
@@ -23,6 +23,7 @@ import type * as assetSearchBar from '#/layouts/dashboard/AssetSearchBar'
 import AssetsTableContextMenu from '#/layouts/dashboard/AssetsTableContextMenu'
 import Category from '#/layouts/dashboard/CategorySwitcher/Category'
 import DuplicateAssetsModal from '#/layouts/dashboard/DuplicateAssetsModal'
+import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
 
 import Button from '#/components/Button'
 import type * as assetRow from '#/components/dashboard/AssetRow'
@@ -33,6 +34,7 @@ import NameColumn from '#/components/dashboard/column/NameColumn'
 import * as columnHeading from '#/components/dashboard/columnHeading'
 import Label from '#/components/dashboard/Label'
 import DragModal from '#/components/DragModal'
+import SelectionBrush from '#/components/SelectionBrush'
 import Spinner, * as spinner from '#/components/Spinner'
 
 import * as backendModule from '#/services/Backend'
@@ -44,6 +46,7 @@ import AssetTreeNode from '#/utilities/AssetTreeNode'
 import * as dateTime from '#/utilities/dateTime'
 import * as drag from '#/utilities/drag'
 import * as fileInfo from '#/utilities/fileInfo'
+import type * as geometry from '#/utilities/geometry'
 import LocalStorage from '#/utilities/LocalStorage'
 import type * as pasteDataModule from '#/utilities/pasteData'
 import PasteType from '#/utilities/PasteType'
@@ -78,8 +81,21 @@ LocalStorage.registerKey('extraColumns', {
 // === Constants ===
 // =================
 
+/** If the drag pointer is less than this distance away from the top or bottom of the
+ * scroll container, then the scroll container automatically scrolls upwards if the cursor is near
+ * the top of the scroll container, or downwards if the cursor is near the bottom. */
+const AUTOSCROLL_THRESHOLD_PX = 50
+/** An arbitrary constant that controls the speed of autoscroll. */
+const AUTOSCROLL_SPEED = 100
+/** The autoscroll speed is `AUTOSCROLL_SPEED / (distance + AUTOSCROLL_DAMPENING)`. */
+const AUTOSCROLL_DAMPENING = 10
+/** The height of the header row. */
+const HEADER_HEIGHT_PX = 34
+/** The height of each row in the table body. MUST be identical to the value as set by the
+ * Tailwind styling. */
+const ROW_HEIGHT_PX = 32
 /** The size of the loading spinner. */
-const LOADING_SPINNER_SIZE = 36
+const LOADING_SPINNER_SIZE_PX = 36
 /** The number of pixels the header bar should shrink when the extra column selector is visible. */
 const TABLE_HEADER_WIDTH_SHRINKAGE_PX = 116
 /** The default placeholder row. */
@@ -135,9 +151,14 @@ const SUGGESTIONS_FOR_TYPE: assetSearchBar.Suggestion[] = [
     deleteFromQuery: query => query.deleteFromLastTerm({ types: ['file'] }),
   },
   {
-    render: () => 'type:connector',
-    addToQuery: query => query.addToLastTerm({ types: ['connector'] }),
-    deleteFromQuery: query => query.deleteFromLastTerm({ types: ['connector'] }),
+    render: () => 'type:secret',
+    addToQuery: query => query.addToLastTerm({ types: ['secret'] }),
+    deleteFromQuery: query => query.deleteFromLastTerm({ types: ['secret'] }),
+  },
+  {
+    render: () => 'type:datalink',
+    addToQuery: query => query.addToLastTerm({ types: ['datalink'] }),
+    deleteFromQuery: query => query.deleteFromLastTerm({ types: ['datalink'] }),
   },
 ]
 const SUGGESTIONS_FOR_NEGATIVE_TYPE: assetSearchBar.Suggestion[] = [
@@ -234,6 +255,17 @@ function insertArbitraryAssetTreeNodeChildren(
   return newNodes === nodes ? item : item.with({ children: newNodes })
 }
 
+// =========================
+// === DragSelectionInfo ===
+// =========================
+
+/** Information related to a drag selection. */
+interface DragSelectionInfo {
+  readonly initialIndex: number
+  readonly start: number
+  readonly end: number
+}
+
 // =============================
 // === Category to filter by ===
 // =============================
@@ -251,6 +283,7 @@ const CATEGORY_TO_FILTER_BY: Readonly<Record<Category, backendModule.FilterBy |
 /** State passed through from a {@link AssetsTable} to every cell. */
 export interface AssetsTableState {
   readonly selectedKeys: React.MutableRefObject<ReadonlySet<backendModule.AssetId>>
+  readonly scrollContainerRef: React.RefObject<HTMLElement>
   readonly visibilities: ReadonlyMap<backendModule.AssetId, Visibility>
   readonly category: Category
   readonly labels: Map<backendModule.LabelName, backendModule.Label>
@@ -266,9 +299,8 @@ export interface AssetsTableState {
   readonly dispatchAssetListEvent: (event: assetListEvent.AssetListEvent) => void
   readonly assetEvents: assetEvent.AssetEvent[]
   readonly dispatchAssetEvent: (event: assetEvent.AssetEvent) => void
-  readonly setAssetPanelProps: React.Dispatch<
-    React.SetStateAction<assetPanel.AssetPanelRequiredProps | null>
-  >
+  readonly setAssetPanelProps: (props: assetPanel.AssetPanelRequiredProps | null) => void
+  readonly setIsAssetPanelTemporarilyVisible: (visible: boolean) => void
   readonly nodeMap: Readonly<
     React.MutableRefObject<ReadonlyMap<backendModule.AssetId, AssetTreeNode>>
   >
@@ -305,6 +337,7 @@ export interface AssetRowState {
 
 /** Props for a {@link AssetsTable}. */
 export interface AssetsTableProps {
+  readonly hidden: boolean
   readonly query: AssetQuery
   readonly setQuery: React.Dispatch<React.SetStateAction<AssetQuery>>
   readonly setCanDownloadFiles: (canDownloadFiles: boolean) => void
@@ -321,9 +354,8 @@ export interface AssetsTableProps {
   readonly dispatchAssetListEvent: (event: assetListEvent.AssetListEvent) => void
   readonly assetEvents: assetEvent.AssetEvent[]
   readonly dispatchAssetEvent: (event: assetEvent.AssetEvent) => void
-  readonly setAssetPanelProps: React.Dispatch<
-    React.SetStateAction<assetPanel.AssetPanelRequiredProps | null>
-  >
+  readonly setAssetPanelProps: (props: assetPanel.AssetPanelRequiredProps | null) => void
+  readonly setIsAssetPanelTemporarilyVisible: (visible: boolean) => void
   readonly doOpenEditor: (
     project: backendModule.ProjectAsset,
     setProject: React.Dispatch<React.SetStateAction<backendModule.ProjectAsset>>,
@@ -335,11 +367,12 @@ export interface AssetsTableProps {
 
 /** The table of project assets. */
 export default function AssetsTable(props: AssetsTableProps) {
-  const { query, setQuery, setCanDownloadFiles, category, allLabels, setSuggestions } = props
-  const { deletedLabelNames, initialProjectName, projectStartupInfo } = props
+  const { hidden, query, setQuery, setCanDownloadFiles, category, allLabels } = props
+  const { setSuggestions, deletedLabelNames, initialProjectName, projectStartupInfo } = props
   const { queuedAssetEvents: rawQueuedAssetEvents } = props
   const { assetListEvents, dispatchAssetListEvent, assetEvents, dispatchAssetEvent } = props
   const { setAssetPanelProps, doOpenEditor, doCloseEditor: rawDoCloseEditor, doCreateLabel } = props
+  const { setIsAssetPanelTemporarilyVisible } = props
 
   const { user, userInfo, accessToken } = authProvider.useNonPartialUserSession()
   const { backend } = backendProvider.useBackend()
@@ -407,8 +440,8 @@ export default function AssetsTable(props: AssetsTableProps) {
         const assetType =
           node.item.type === backendModule.AssetType.directory
             ? 'folder'
-            : node.item.type === backendModule.AssetType.secret
-            ? 'connector'
+            : node.item.type === backendModule.AssetType.dataLink
+            ? 'datalink'
             : String(node.item.type)
         const assetExtension =
           node.item.type !== backendModule.AssetType.file
@@ -561,6 +594,10 @@ export default function AssetsTable(props: AssetsTableProps) {
     processNode(assetTree)
     return map
   }, [assetTree, filter])
+  const visibleItems = React.useMemo(
+    () => displayItems.filter(item => visibilities.get(item.key) !== Visibility.hidden),
+    [displayItems, visibilities]
+  )
 
   React.useEffect(() => {
     if (category === Category.trash) {
@@ -848,6 +885,8 @@ export default function AssetsTable(props: AssetsTableProps) {
 
   const overwriteNodes = React.useCallback(
     (newAssets: backendModule.AnyAsset[]) => {
+      mostRecentlySelectedIndexRef.current = null
+      selectionStartIndexRef.current = null
       // This is required, otherwise we are using an outdated
       // `nameOfProjectToImmediatelyOpen`.
       setNameOfProjectToImmediatelyOpen(oldNameOfProjectToImmediatelyOpen => {
@@ -1072,8 +1111,13 @@ export default function AssetsTable(props: AssetsTableProps) {
   React.useEffect(() => {
     if (selectedKeysRef.current.size !== 1) {
       setAssetPanelProps(null)
+      setIsAssetPanelTemporarilyVisible(false)
     }
-  }, [selectedKeysRef.current.size, /* should never change */ setAssetPanelProps])
+  }, [
+    selectedKeysRef.current.size,
+    /* should never change */ setAssetPanelProps,
+    /* should never change */ setIsAssetPanelTemporarilyVisible,
+  ])
 
   const directoryListAbortControllersRef = React.useRef(
     new Map<backendModule.DirectoryId, AbortController>()
@@ -1180,6 +1224,168 @@ export default function AssetsTable(props: AssetsTableProps) {
     [category, backend]
   )
 
+  const [spinnerState, setSpinnerState] = React.useState(spinner.SpinnerState.initial)
+  const [keyboardSelectedIndex, setKeyboardSelectedIndexRaw] = React.useState<number | null>(null)
+  const mostRecentlySelectedIndexRef = React.useRef<number | null>(null)
+  const selectionStartIndexRef = React.useRef<number | null>(null)
+  const bodyRef = React.useRef<HTMLTableSectionElement>(null)
+
+  const setMostRecentlySelectedIndex = React.useCallback(
+    (index: number | null, isKeyboard = false) => {
+      mostRecentlySelectedIndexRef.current = index
+      setKeyboardSelectedIndexRaw(isKeyboard ? index : null)
+    },
+    []
+  )
+
+  React.useEffect(() => {
+    // This is not a React component, even though it contains JSX.
+    // eslint-disable-next-line no-restricted-syntax
+    const onKeyDown = (event: KeyboardEvent) => {
+      const prevIndex = mostRecentlySelectedIndexRef.current
+      const item = prevIndex == null ? null : visibleItems[prevIndex]
+      if (selectedKeysRef.current.size === 1 && item != null) {
+        switch (event.key) {
+          case 'Enter':
+          case ' ': {
+            if (event.key === ' ' && event.ctrlKey) {
+              const keys = selectedKeysRef.current
+              setSelectedKeys(set.withPresence(keys, item.key, !keys.has(item.key)))
+            } else {
+              switch (item.item.type) {
+                case backendModule.AssetType.directory: {
+                  event.preventDefault()
+                  event.stopPropagation()
+                  doToggleDirectoryExpansion(item.item.id, item.key)
+                  break
+                }
+                case backendModule.AssetType.project: {
+                  event.preventDefault()
+                  event.stopPropagation()
+                  dispatchAssetEvent({
+                    type: AssetEventType.openProject,
+                    id: item.item.id,
+                    runInBackground: false,
+                    shouldAutomaticallySwitchPage: true,
+                  })
+                  break
+                }
+                case backendModule.AssetType.dataLink: {
+                  event.preventDefault()
+                  event.stopPropagation()
+                  setIsAssetPanelTemporarilyVisible(true)
+                  break
+                }
+                case backendModule.AssetType.secret: {
+                  event.preventDefault()
+                  event.stopPropagation()
+                  const id = item.item.id
+                  setModal(
+                    <UpsertSecretModal
+                      id={item.item.id}
+                      name={item.item.title}
+                      doCreate={async (_name, value) => {
+                        try {
+                          await backend.updateSecret(id, { value }, item.item.title)
+                        } catch (error) {
+                          toastAndLog(null, error)
+                        }
+                      }}
+                    />
+                  )
+                  break
+                }
+                default: {
+                  break
+                }
+              }
+            }
+            break
+          }
+          case 'ArrowLeft': {
+            if (item.item.type === backendModule.AssetType.directory && item.children != null) {
+              event.preventDefault()
+              event.stopPropagation()
+              doToggleDirectoryExpansion(item.item.id, item.key, null, false)
+            }
+            break
+          }
+          case 'ArrowRight': {
+            if (item.item.type === backendModule.AssetType.directory && item.children == null) {
+              event.preventDefault()
+              event.stopPropagation()
+              doToggleDirectoryExpansion(item.item.id, item.key, null, true)
+            }
+            break
+          }
+        }
+      }
+      switch (event.key) {
+        case ' ': {
+          if (event.ctrlKey && item != null) {
+            const keys = selectedKeysRef.current
+            setSelectedKeys(set.withPresence(keys, item.key, !keys.has(item.key)))
+          }
+          break
+        }
+        case 'Escape': {
+          setSelectedKeys(new Set())
+          setMostRecentlySelectedIndex(null)
+          selectionStartIndexRef.current = null
+          break
+        }
+        case 'ArrowUp':
+        case 'ArrowDown': {
+          event.preventDefault()
+          event.stopPropagation()
+          if (!event.shiftKey) {
+            selectionStartIndexRef.current = null
+          }
+          const index =
+            prevIndex == null
+              ? 0
+              : event.key === 'ArrowUp'
+              ? Math.max(0, prevIndex - 1)
+              : Math.min(visibleItems.length - 1, prevIndex + 1)
+          setMostRecentlySelectedIndex(index, true)
+          if (event.shiftKey) {
+            // On Windows, Ctrl+Shift+Arrow behaves the same as Shift+Arrow.
+            if (selectionStartIndexRef.current == null) {
+              selectionStartIndexRef.current = prevIndex ?? 0
+            }
+            const startIndex = Math.min(index, selectionStartIndexRef.current)
+            const endIndex = Math.max(index, selectionStartIndexRef.current) + 1
+            const selection = visibleItems.slice(startIndex, endIndex)
+            setSelectedKeys(new Set(selection.map(newItem => newItem.key)))
+          } else if (event.ctrlKey) {
+            selectionStartIndexRef.current = null
+          } else {
+            const newItem = visibleItems[index]
+            if (newItem != null) {
+              setSelectedKeys(new Set([newItem.key]))
+            }
+            selectionStartIndexRef.current = null
+          }
+          break
+        }
+      }
+    }
+    document.addEventListener('keydown', onKeyDown)
+    return () => {
+      document.removeEventListener('keydown', onKeyDown)
+    }
+  }, [
+    visibleItems,
+    backend,
+    doToggleDirectoryExpansion,
+    /* should never change */ toastAndLog,
+    /* should never change */ setModal,
+    /* should never change */ setMostRecentlySelectedIndex,
+    /* should never change */ setSelectedKeys,
+    /* should never change */ setIsAssetPanelTemporarilyVisible,
+    /* should never change */ dispatchAssetEvent,
+  ])
+
   const getNewProjectName = React.useCallback(
     (templateName: string | null, parentKey: backendModule.DirectoryId | null) => {
       const prefix = `${templateName ?? 'New Project'} `
@@ -1656,6 +1862,7 @@ export default function AssetsTable(props: AssetsTableProps) {
     (): AssetsTableState => ({
       visibilities,
       selectedKeys: selectedKeysRef,
+      scrollContainerRef,
       category,
       labels: allLabels,
       deletedLabelNames,
@@ -1671,6 +1878,7 @@ export default function AssetsTable(props: AssetsTableProps) {
       dispatchAssetEvent,
       dispatchAssetListEvent,
       setAssetPanelProps,
+      setIsAssetPanelTemporarilyVisible,
       nodeMap: nodeMapRef,
       doToggleDirectoryExpansion,
       doOpenManually,
@@ -1700,17 +1908,13 @@ export default function AssetsTable(props: AssetsTableProps) {
       doCut,
       doPaste,
       /* should never change */ setAssetPanelProps,
+      /* should never change */ setIsAssetPanelTemporarilyVisible,
       /* should never change */ setQuery,
       /* should never change */ dispatchAssetEvent,
       /* should never change */ dispatchAssetListEvent,
     ]
   )
 
-  const [spinnerState, setSpinnerState] = React.useState(spinner.SpinnerState.initial)
-  const [previouslySelectedKey, setPreviouslySelectedKey] =
-    React.useState<backendModule.AssetId | null>(null)
-  const bodyRef = React.useRef<HTMLTableSectionElement>(null)
-
   // This is required to prevent the table body from overlapping the table header, because
   // the table header is transparent.
   React.useEffect(() => {
@@ -1752,13 +1956,18 @@ export default function AssetsTable(props: AssetsTableProps) {
         selectedKeysRef.current.size !== 0
       ) {
         setSelectedKeys(new Set())
+        setMostRecentlySelectedIndex(null)
       }
     }
     document.addEventListener('click', onDocumentClick)
     return () => {
       document.removeEventListener('click', onDocumentClick)
     }
-  }, [shortcutManager, setSelectedKeys])
+  }, [
+    shortcutManager,
+    /* should never change */ setSelectedKeys,
+    /* should never change */ setMostRecentlySelectedIndex,
+  ])
 
   React.useEffect(() => {
     if (isLoading) {
@@ -1772,38 +1981,24 @@ export default function AssetsTable(props: AssetsTableProps) {
     }
   }, [isLoading])
 
-  const onRowClick = React.useCallback(
-    (innerRowProps: assetRow.AssetRowInnerProps, event: React.MouseEvent) => {
-      const { key } = innerRowProps
+  const calculateNewKeys = React.useCallback(
+    (
+      event: MouseEvent | React.MouseEvent,
+      keys: backendModule.AssetId[],
+      getRange: () => backendModule.AssetId[]
+    ) => {
       event.stopPropagation()
-      const getNewlySelectedKeys = () => {
-        if (previouslySelectedKey == null) {
-          return [key]
-        } else {
-          const index1 = displayItems.findIndex(
-            innerItem => AssetTreeNode.getKey(innerItem) === previouslySelectedKey
-          )
-          const index2 = displayItems.findIndex(
-            innerItem => AssetTreeNode.getKey(innerItem) === key
-          )
-          const selectedItems =
-            index1 <= index2
-              ? displayItems.slice(index1, index2 + 1)
-              : displayItems.slice(index2, index1 + 1)
-          return selectedItems.map(AssetTreeNode.getKey)
-        }
-      }
       if (
         shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.selectRange, event)
       ) {
-        setSelectedKeys(new Set(getNewlySelectedKeys()))
+        return new Set(getRange())
       } else if (
         shortcutManager.matchesMouseAction(
           shortcutManagerModule.MouseAction.selectAdditionalRange,
           event
         )
       ) {
-        setSelectedKeys(new Set([...selectedKeysRef.current, ...getNewlySelectedKeys()]))
+        return new Set([...selectedKeysRef.current, ...getRange()])
       } else if (
         shortcutManager.matchesMouseAction(
           shortcutManagerModule.MouseAction.selectAdditional,
@@ -1811,18 +2006,148 @@ export default function AssetsTable(props: AssetsTableProps) {
         )
       ) {
         const newSelectedKeys = new Set(selectedKeysRef.current)
-        if (selectedKeysRef.current.has(key)) {
-          newSelectedKeys.delete(key)
-        } else {
-          newSelectedKeys.add(key)
+        let count = 0
+        for (const key of keys) {
+          if (selectedKeysRef.current.has(key)) {
+            count += 1
+          }
+        }
+        for (const key of keys) {
+          const add = count * 2 < keys.length
+          set.setPresence(newSelectedKeys, key, add)
         }
-        setSelectedKeys(newSelectedKeys)
+        return newSelectedKeys
       } else {
-        setSelectedKeys(new Set([key]))
+        return new Set(keys)
       }
-      setPreviouslySelectedKey(key)
     },
-    [displayItems, previouslySelectedKey, shortcutManager, setSelectedKeys]
+    [shortcutManager]
+  )
+
+  // Only non-`null` when it is different to`selectedKeys`.
+  const [visuallySelectedKeysOverride, setVisuallySelectedKeysOverride] =
+    React.useState<ReadonlySet<backendModule.AssetId> | null>(null)
+
+  const dragSelectionChangeLoopHandle = React.useRef(0)
+  const dragSelectionRangeRef = React.useRef<DragSelectionInfo | null>(null)
+  const onSelectionDrag = React.useCallback(
+    (rectangle: geometry.DetailedRectangle, event: MouseEvent) => {
+      if (mostRecentlySelectedIndexRef.current != null) {
+        setKeyboardSelectedIndexRaw(null)
+      }
+      cancelAnimationFrame(dragSelectionChangeLoopHandle.current)
+      const scrollContainer = scrollContainerRef.current
+      if (scrollContainer != null) {
+        const rect = scrollContainer.getBoundingClientRect()
+        if (rectangle.signedHeight <= 0 && scrollContainer.scrollTop > 0) {
+          const distanceToTop = Math.max(0, rectangle.top - rect.top - HEADER_HEIGHT_PX)
+          if (distanceToTop < AUTOSCROLL_THRESHOLD_PX) {
+            scrollContainer.scrollTop -= Math.floor(
+              AUTOSCROLL_SPEED / (distanceToTop + AUTOSCROLL_DAMPENING)
+            )
+            dragSelectionChangeLoopHandle.current = requestAnimationFrame(() => {
+              onSelectionDrag(rectangle, event)
+            })
+          }
+        }
+        if (
+          rectangle.signedHeight >= 0 &&
+          scrollContainer.scrollTop + rect.height < scrollContainer.scrollHeight
+        ) {
+          const distanceToBottom = Math.max(0, rect.bottom - rectangle.bottom)
+          if (distanceToBottom < AUTOSCROLL_THRESHOLD_PX) {
+            scrollContainer.scrollTop += Math.floor(
+              AUTOSCROLL_SPEED / (distanceToBottom + AUTOSCROLL_DAMPENING)
+            )
+            dragSelectionChangeLoopHandle.current = requestAnimationFrame(() => {
+              onSelectionDrag(rectangle, event)
+            })
+          }
+        }
+        const overlapsHorizontally = rect.right > rectangle.left && rect.left < rectangle.right
+        const selectionTop = Math.max(0, rectangle.top - rect.top - HEADER_HEIGHT_PX)
+        const selectionBottom = Math.max(
+          0,
+          Math.min(rect.height, rectangle.bottom - rect.top - HEADER_HEIGHT_PX)
+        )
+        const range = dragSelectionRangeRef.current
+        if (!overlapsHorizontally) {
+          dragSelectionRangeRef.current = null
+        } else if (range == null) {
+          const topIndex = (selectionTop + scrollContainer.scrollTop) / ROW_HEIGHT_PX
+          const bottomIndex = (selectionBottom + scrollContainer.scrollTop) / ROW_HEIGHT_PX
+          dragSelectionRangeRef.current = {
+            initialIndex: rectangle.signedHeight < 0 ? bottomIndex : topIndex,
+            start: Math.floor(topIndex),
+            end: Math.ceil(bottomIndex),
+          }
+        } else {
+          const topIndex = (selectionTop + scrollContainer.scrollTop) / ROW_HEIGHT_PX
+          const bottomIndex = (selectionBottom + scrollContainer.scrollTop) / ROW_HEIGHT_PX
+          const endIndex = rectangle.signedHeight < 0 ? topIndex : bottomIndex
+          dragSelectionRangeRef.current = {
+            initialIndex: range.initialIndex,
+            start: Math.floor(Math.min(range.initialIndex, endIndex)),
+            end: Math.ceil(Math.max(range.initialIndex, endIndex)),
+          }
+        }
+        if (range == null) {
+          setVisuallySelectedKeysOverride(null)
+        } else {
+          const keys = displayItems.slice(range.start, range.end).map(node => node.key)
+          setVisuallySelectedKeysOverride(calculateNewKeys(event, keys, () => []))
+        }
+      }
+    },
+    [displayItems, calculateNewKeys]
+  )
+
+  const onSelectionDragEnd = React.useCallback(
+    (event: MouseEvent) => {
+      const range = dragSelectionRangeRef.current
+      if (range != null) {
+        const keys = displayItems.slice(range.start, range.end).map(node => node.key)
+        setSelectedKeys(calculateNewKeys(event, keys, () => []))
+      }
+      setVisuallySelectedKeysOverride(null)
+      dragSelectionRangeRef.current = null
+    },
+    [displayItems, calculateNewKeys, /* should never change */ setSelectedKeys]
+  )
+
+  const onSelectionDragCancel = React.useCallback(() => {
+    setVisuallySelectedKeysOverride(null)
+    dragSelectionRangeRef.current = null
+  }, [])
+
+  const onRowClick = React.useCallback(
+    (innerRowProps: assetRow.AssetRowInnerProps, event: React.MouseEvent) => {
+      const { key } = innerRowProps
+      event.stopPropagation()
+      const newIndex = visibleItems.findIndex(innerItem => AssetTreeNode.getKey(innerItem) === key)
+      const getRange = () => {
+        if (mostRecentlySelectedIndexRef.current == null) {
+          return [key]
+        } else {
+          const index1 = mostRecentlySelectedIndexRef.current
+          const index2 = newIndex
+          const startIndex = Math.min(index1, index2)
+          const endIndex = Math.max(index1, index2) + 1
+          return visibleItems.slice(startIndex, endIndex).map(AssetTreeNode.getKey)
+        }
+      }
+      setSelectedKeys(calculateNewKeys(event, [key], getRange))
+      setMostRecentlySelectedIndex(newIndex)
+      if (!event.shiftKey) {
+        selectionStartIndexRef.current = null
+      }
+    },
+    [
+      visibleItems,
+      calculateNewKeys,
+      /* should never change */ setSelectedKeys,
+      /* should never change */ setMostRecentlySelectedIndex,
+    ]
   )
 
   const columns = columnUtils.getColumnList(backend.type, extraColumns)
@@ -1849,15 +2174,15 @@ export default function AssetsTable(props: AssetsTableProps) {
     <tr className="h-8">
       <td colSpan={columns.length} className="bg-transparent">
         <div className="grid justify-around w-container">
-          <Spinner size={LOADING_SPINNER_SIZE} state={spinnerState} />
+          <Spinner size={LOADING_SPINNER_SIZE_PX} state={spinnerState} />
         </div>
       </td>
     </tr>
   ) : (
     displayItems.map(item => {
       const key = AssetTreeNode.getKey(item)
-      const isSelected = selectedKeys.has(key)
-      const isSoleSelectedItem = selectedKeys.size === 1 && isSelected
+      const isSelected = (visuallySelectedKeysOverride ?? selectedKeys).has(key)
+      const isSoleSelected = selectedKeys.size === 1 && isSelected
       return (
         <AssetRow
           key={key}
@@ -1869,21 +2194,26 @@ export default function AssetsTable(props: AssetsTableProps) {
           setSelected={selected => {
             setSelectedKeys(set.withPresence(selectedKeysRef.current, key, selected))
           }}
-          isSoleSelectedItem={isSoleSelectedItem}
-          allowContextMenu={selectedKeysRef.current.size === 0 || !isSelected || isSoleSelectedItem}
+          isSoleSelected={isSoleSelected}
+          isKeyboardSelected={
+            keyboardSelectedIndex != null && item === visibleItems[keyboardSelectedIndex]
+          }
+          allowContextMenu={selectedKeysRef.current.size === 0 || !isSelected || isSoleSelected}
           onClick={onRowClick}
           onContextMenu={(_innerProps, event) => {
             if (!isSelected) {
               event.preventDefault()
               event.stopPropagation()
-              setPreviouslySelectedKey(key)
+              setMostRecentlySelectedIndex(visibleItems.indexOf(item))
+              selectionStartIndexRef.current = null
               setSelectedKeys(new Set([key]))
             }
           }}
           onDragStart={event => {
             let newSelectedKeys = selectedKeysRef.current
-            if (!selectedKeysRef.current.has(key)) {
-              setPreviouslySelectedKey(key)
+            if (!newSelectedKeys.has(key)) {
+              setMostRecentlySelectedIndex(visibleItems.indexOf(item))
+              selectionStartIndexRef.current = null
               newSelectedKeys = new Set([key])
               setSelectedKeys(newSelectedKeys)
             }
@@ -1911,7 +2241,7 @@ export default function AssetsTable(props: AssetsTableProps) {
                     item={node.with({ depth: 0 })}
                     state={state}
                     // Default states.
-                    isSoleSelectedItem={false}
+                    isSoleSelected={false}
                     selected={false}
                     rowState={assetRowUtils.INITIAL_ROW_STATE}
                     // The drag placeholder cannot be interacted with.
@@ -2024,9 +2354,9 @@ export default function AssetsTable(props: AssetsTableProps) {
             category={category}
             pasteData={pasteData}
             selectedKeys={selectedKeys}
+            clearSelectedKeys={clearSelectedKeys}
             nodeMapRef={nodeMapRef}
             event={event}
-            clearSelectedKeys={clearSelectedKeys}
             dispatchAssetEvent={dispatchAssetEvent}
             dispatchAssetListEvent={dispatchAssetListEvent}
             doCopy={doCopy}
@@ -2099,6 +2429,13 @@ export default function AssetsTable(props: AssetsTableProps) {
 
   return (
     <div ref={scrollContainerRef} className="container-size flex-1 overflow-auto">
+      {!hidden && (
+        <SelectionBrush
+          onDrag={onSelectionDrag}
+          onDragEnd={onSelectionDragEnd}
+          onDragCancel={onSelectionDragCancel}
+        />
+      )}
       <div className="flex flex-col w-min min-w-full h-full">
         {isCloud && (
           <div className="sticky top-0 h-0 flex flex-col">
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
index 53f725be51d8..83a96cb2fd00 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
@@ -93,9 +93,8 @@ export interface DriveProps {
   readonly setLabels: React.Dispatch<React.SetStateAction<backendModule.Label[]>>
   readonly setSuggestions: (suggestions: assetSearchBar.Suggestion[]) => void
   readonly projectStartupInfo: backendModule.ProjectStartupInfo | null
-  readonly setAssetPanelProps: React.Dispatch<
-    React.SetStateAction<assetPanel.AssetPanelRequiredProps | null>
-  >
+  readonly setAssetPanelProps: (props: assetPanel.AssetPanelRequiredProps | null) => void
+  readonly setIsAssetPanelTemporarilyVisible: (visible: boolean) => void
   readonly doCreateProject: (templateId: string | null) => void
   readonly doOpenEditor: (
     project: backendModule.ProjectAsset,
@@ -111,6 +110,7 @@ export default function Drive(props: DriveProps) {
   const { query, setQuery, labels, setLabels, setSuggestions, projectStartupInfo } = props
   const { assetListEvents, dispatchAssetListEvent, assetEvents, dispatchAssetEvent } = props
   const { setAssetPanelProps, doOpenEditor, doCloseEditor } = props
+  const { setIsAssetPanelTemporarilyVisible } = props
 
   const navigate = navigateHooks.useNavigate()
   const toastAndLog = toastAndLogHooks.useToastAndLog()
@@ -391,6 +391,7 @@ export default function Drive(props: DriveProps) {
               </div>
             )}
             <AssetsTable
+              hidden={hidden}
               query={query}
               setQuery={setQuery}
               setCanDownloadFiles={setCanDownloadFiles}
@@ -406,6 +407,7 @@ export default function Drive(props: DriveProps) {
               assetListEvents={assetListEvents}
               dispatchAssetListEvent={dispatchAssetListEvent}
               setAssetPanelProps={setAssetPanelProps}
+              setIsAssetPanelTemporarilyVisible={setIsAssetPanelTemporarilyVisible}
               doOpenEditor={doOpenEditor}
               doCloseEditor={doCloseEditor}
               doCreateLabel={doCreateLabel}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
index bacced196c7f..fcadb3b2cdd1 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
@@ -291,7 +291,12 @@ export default function AccountSettingsTab() {
         <h3 className="font-bold text-xl h-9.5 py-0.5">Profile picture</h3>
         <label className="flex items-center cursor-pointer rounded-full overflow-clip h-32 w-32 hover:bg-frame transition-colors">
           <input type="file" className="hidden" accept="image/*" onChange={doUploadUserPicture} />
-          <img src={user?.profilePicture ?? DefaultUserIcon} width={128} height={128} />
+          <img
+            src={user?.profilePicture ?? DefaultUserIcon}
+            width={128}
+            height={128}
+            className="pointer-events-none"
+          />
         </label>
         <span className="py-1 w-64">
           Your profile picture should not be irrelevant, abusive or vulgar. It should not be a
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
index 19dbc637d16c..16d701f22594 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
@@ -270,7 +270,12 @@ export default function OrganizationSettingsTab(props: OrganizationSettingsTabPr
             accept="image/*"
             onChange={doUploadOrganizationPicture}
           />
-          <img src={organization.picture ?? DefaultUserIcon} width={128} height={128} />
+          <img
+            src={organization.picture ?? DefaultUserIcon}
+            width={128}
+            height={128}
+            className="pointer-events-none"
+          />
         </label>
         <span className="py-1 w-64">
           Your organization&apos;s profile picture should not be irrelevant, abusive or vulgar. It
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx
index b3f09286bc43..bf4ec5e42725 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx
@@ -79,6 +79,7 @@ export default function UpsertSecretModal(props: UpsertSecretModalProps) {
         <label className="relative flex">
           <div className="w-12 h-6 py-1">Value</div>
           <input
+            autoFocus={!isNameEditable}
             placeholder="Enter the value of the secret"
             className="grow bg-transparent border border-black/10 rounded-full leading-170 h-6 px-4 py-px"
             onInput={event => {
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx
index bfdf2cee09be..8868728ba8a0 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx
@@ -118,6 +118,7 @@ export default function UserBar(props: UserBarProps) {
         <img
           src={user?.profilePicture ?? DefaultUserIcon}
           alt="Open user menu"
+          className="pointer-events-none"
           height={28}
           width={28}
         />
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
index 11eff7089799..42b048dd8896 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
@@ -57,7 +57,12 @@ export default function UserMenu(props: UserMenuProps) {
           <>
             <div className="flex items-center gap-3 px-1">
               <div className="flex items-center rounded-full overflow-clip w-7.25 h-7.25">
-                <img src={user.profilePicture ?? DefaultUserIcon} height={28} width={28} />
+                <img
+                  src={user.profilePicture ?? DefaultUserIcon}
+                  height={28}
+                  width={28}
+                  className="pointer-events-none"
+                />
               </div>
               <span className="leading-170 h-6 py-px">{user.name}</span>
             </div>
diff --git a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
index 557aadd6b250..a5d6bb1a81ac 100644
--- a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
+++ b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
@@ -139,6 +139,7 @@ export default function Dashboard(props: DashboardProps) {
   const [isAssetPanelVisible, setIsAssetPanelVisible] = React.useState(
     () => localStorage.get('isAssetPanelVisible') ?? false
   )
+  const [isAssetPanelTemporarilyVisible, setIsAssetPanelTemporarilyVisible] = React.useState(false)
   const [initialProjectName, setInitialProjectName] = React.useState(rawInitialProjectName)
   const rootDirectoryId = React.useMemo(
     () => session.user?.rootDirectoryId ?? backendModule.DirectoryId(''),
@@ -479,6 +480,7 @@ export default function Dashboard(props: DashboardProps) {
             assetEvents={assetEvents}
             dispatchAssetEvent={dispatchAssetEvent}
             setAssetPanelProps={setAssetPanelProps}
+            setIsAssetPanelTemporarilyVisible={setIsAssetPanelTemporarilyVisible}
             doCreateProject={doCreateProject}
             doOpenEditor={doOpenEditor}
             doCloseEditor={doCloseEditor}
@@ -511,10 +513,12 @@ export default function Dashboard(props: DashboardProps) {
         </div>
         <div
           className={`flex flex-col duration-500 transition-min-width ease-in-out overflow-hidden ${
-            isAssetPanelVisible && assetPanelProps != null ? 'min-w-120' : 'min-w-0 invisible'
+            (isAssetPanelVisible || isAssetPanelTemporarilyVisible) && assetPanelProps != null
+              ? 'min-w-120'
+              : 'min-w-0 invisible'
           }`}
         >
-          {assetPanelProps && isAssetPanelVisible && (
+          {assetPanelProps && (isAssetPanelVisible || isAssetPanelTemporarilyVisible) && (
             <AssetPanel
               supportsLocalBackend={supportsLocalBackend}
               key={assetPanelProps.item.item.id}
diff --git a/app/ide-desktop/lib/dashboard/src/pages/subscribe/Subscribe.tsx b/app/ide-desktop/lib/dashboard/src/pages/subscribe/Subscribe.tsx
index c0e85024936d..88e6b6d489cb 100644
--- a/app/ide-desktop/lib/dashboard/src/pages/subscribe/Subscribe.tsx
+++ b/app/ide-desktop/lib/dashboard/src/pages/subscribe/Subscribe.tsx
@@ -156,7 +156,7 @@ export default function Subscribe() {
             </stripeReact.EmbeddedCheckoutProvider>
           </div>
         ) : (
-          <div className="h-155 transition-all"></div>
+          <div className="h-155 transition-all" />
         )}
       </div>
     </Modal>
diff --git a/app/ide-desktop/lib/dashboard/src/tailwind.css b/app/ide-desktop/lib/dashboard/src/tailwind.css
index 417eac70158d..8d0ee0b79a97 100644
--- a/app/ide-desktop/lib/dashboard/src/tailwind.css
+++ b/app/ide-desktop/lib/dashboard/src/tailwind.css
@@ -49,7 +49,7 @@ body::before {
 
 .enso-dashboard *:focus,
 .enso-chat *:focus {
-  outline: none !important;
+  outline: none;
 }
 
 /* Must be kept in sync with app/gui/view/graph-editor/src/builtin/visualization/java_script/helpers/scrollable.js. */
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts b/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
index 0c196d522522..31edcfc71cd2 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
@@ -291,7 +291,7 @@ export default class ShortcutManager {
     const button: number = shortcut.button
     return (
       button === event.button &&
-      event.detail >= shortcut.clicks &&
+      Math.max(event.detail, 1) >= shortcut.clicks &&
       modifiersMatchEvent(shortcut, event)
     )
   }
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/geometry.ts b/app/ide-desktop/lib/dashboard/src/utilities/geometry.ts
new file mode 100644
index 000000000000..130c40e63f2b
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/utilities/geometry.ts
@@ -0,0 +1,19 @@
+/** @file A 2D coordinate. */
+
+/** A 2D coordinate. */
+export interface Coordinate2D {
+  readonly left: number
+  readonly top: number
+}
+
+/** A rectangle, including all common measurements. */
+export interface DetailedRectangle {
+  readonly left: number
+  readonly top: number
+  readonly right: number
+  readonly bottom: number
+  readonly width: number
+  readonly height: number
+  readonly signedWidth: number
+  readonly signedHeight: number
+}
diff --git a/app/ide-desktop/lib/dashboard/tailwind.config.js b/app/ide-desktop/lib/dashboard/tailwind.config.js
index ed2ca5663c06..44ac5d2fe7ef 100644
--- a/app/ide-desktop/lib/dashboard/tailwind.config.js
+++ b/app/ide-desktop/lib/dashboard/tailwind.config.js
@@ -29,6 +29,8 @@ export default /** @satisfies {import('tailwindcss').Config} */ ({
         youtube: '#c62421',
         discord: '#404796',
         danger: '#d33b0b',
+        // Equivalent to `lch(70% 0 0 / 0.5)`
+        'selection-brush': 'rgba(171 171 171 / 0.5)',
         dim: 'rgba(0, 0, 0, 0.25)',
         'dim-darker': 'rgba(0, 0, 0, 0.40)',
         frame: 'rgba(255, 255, 255, 0.40)',
@@ -136,7 +138,7 @@ export default /** @satisfies {import('tailwindcss').Config} */ ({
       backdropBlur: {
         xs: '2px',
       },
-      borderWidth: { 0.5: '0.5px' },
+      borderWidth: { 0.5: '0.5px', 6: '6px' },
       boxShadow: {
         soft: `0 0.5px 2.2px 0px #00000008, 0 1.2px 5.3px 0px #0000000b, \
 0 2.3px 10px 0 #0000000e, 0 4px 18px 0 #00000011, 0 7.5px 33.4px 0 #00000014, \
@@ -150,6 +152,7 @@ export default /** @satisfies {import('tailwindcss').Config} */ ({
         'min-width': 'min-width',
         'stroke-dasharray': 'stroke-dasharray',
         'grid-template-rows': 'grid-template-rows',
+        'border-margin': 'border, margin',
       },
       transitionDuration: {
         400: '400ms',

From f48caac586b427e514d33d4664c0eb5dd3888c33 Mon Sep 17 00:00:00 2001
From: Pavel Marek <pavel.marek@enso.org>
Date: Mon, 26 Feb 2024 20:25:37 +0100
Subject: [PATCH 23/26] Upload native-image argfiles (#9094)

In PR #8953, in commit https://github.com/enso-org/enso/pull/8953/commits/ba0a69de6e715340dfc912368054dfbc9c48ad57, I have introduced argument files to the `native-image`. In this PR, let's try to upload these argfiles as artifacts on GH, so that we can inspect them later.
---
 build/build/paths.yaml                        | 11 ++++++-
 build/build/src/engine/context.rs             | 31 +++++++++++++++++++
 .../downloader/http/HttpDownloaderTest.java   |  7 +++--
 3 files changed, 46 insertions(+), 3 deletions(-)

diff --git a/build/build/paths.yaml b/build/build/paths.yaml
index ce96cb12213f..0d8fa691fd38 100644
--- a/build/build/paths.yaml
+++ b/build/build/paths.yaml
@@ -1,5 +1,5 @@
 # This file is used to generate `target/<profile>/build/enso-build-<hash>/out/paths.rs`.
-# Generation logic is in `ci_utils/src/paths.rs`.
+# Generation logic is in `build/macros/lib/src/paths.rs`.
 
 <repo_root>/:
   .github/:
@@ -89,8 +89,13 @@
         test/:
           resources/:
             Factorial.enso:
+      target/:
+        native-image-args.txt:
     runtime/:
       target/:
+    launcher/:
+      target/:
+        native-image-args.txt:
     runtime-benchmarks/:
       bench-report.xml:
   lib/:
@@ -98,6 +103,10 @@
       parser/:
         generate-java/:
           java/:
+    scala/:
+      project-manager/:
+        target/:
+          native-image-args.txt:
   target/:
     ensogl-pack/:
       dist/: # Here ensogl-pack outputs its artifacts
diff --git a/build/build/src/engine/context.rs b/build/build/src/engine/context.rs
index 93d576a10bc1..e8a8aef846ba 100644
--- a/build/build/src/engine/context.rs
+++ b/build/build/src/engine/context.rs
@@ -216,6 +216,35 @@ impl RunContext {
         Ok(())
     }
 
+    /// During the native-image build, the engine generates arg files. This function uploads them as
+    /// artifacts on the CI, so we can inspect them later.
+    /// Note that if something goes wrong, the native image arg files may not be present.
+    async fn upload_native_image_arg_files(&self) -> Result {
+        debug!("Uploading Native Image Arg Files");
+        let engine_runner_ni_argfile =
+            &self.repo_root.engine.runner.target.native_image_args_txt.path;
+        let launcher_ni_argfile = &self.repo_root.engine.launcher.target.native_image_args_txt.path;
+        let project_manager_ni_argfile =
+            &self.repo_root.lib.scala.project_manager.target.native_image_args_txt.path;
+        let native_image_arg_files = [
+            (engine_runner_ni_argfile, "Engine Runner native-image-args"),
+            (launcher_ni_argfile, "Launcher native-image-args"),
+            (project_manager_ni_argfile, "Project Manager native-image-args"),
+        ];
+        for (argfile, artifact_name) in native_image_arg_files {
+            if argfile.exists() {
+                ide_ci::actions::artifacts::upload_single_file(&argfile, artifact_name).await?;
+            } else {
+                warn!(
+                    "Native Image Arg File for {} not found at {}",
+                    artifact_name,
+                    argfile.display()
+                );
+            }
+        }
+        Ok(())
+    }
+
     pub async fn build(&self) -> Result<BuiltArtifacts> {
         self.prepare_build_env().await?;
         if ide_ci::ci::run_in_ci() {
@@ -475,6 +504,8 @@ impl RunContext {
 
         // If we were running any benchmarks, they are complete by now. Upload the report.
         if is_in_env() {
+            self.upload_native_image_arg_files().await?;
+
             for bench in &self.config.execute_benchmarks {
                 match bench {
                     Benchmarks::Runtime => {
diff --git a/lib/scala/downloader/src/test/java/org/enso/downloader/http/HttpDownloaderTest.java b/lib/scala/downloader/src/test/java/org/enso/downloader/http/HttpDownloaderTest.java
index 8db53023614f..8bf5a21df4f7 100644
--- a/lib/scala/downloader/src/test/java/org/enso/downloader/http/HttpDownloaderTest.java
+++ b/lib/scala/downloader/src/test/java/org/enso/downloader/http/HttpDownloaderTest.java
@@ -162,6 +162,9 @@ public void done(Try<APIResponse> result) {
     task.addProgressListener(progressListener);
     var resp = task.force();
     assertThat(resp.content(), containsString("Hello"));
+    assertThat("Done was called exactly once", doneCalls[0], is(1));
+    assertThat(
+        "Progress reported was called at least once", progressUpdateCalls[0], greaterThan(0));
   }
 
   private static class TextHandler extends SimpleHttpHandler {
@@ -188,9 +191,9 @@ protected void doHandle(HttpExchange exchange) throws IOException {
   }
 
   private static class BigFileHandler extends SimpleHttpHandler {
-    private static final long BIG_FILE_SIZE = 10 * 1024;
-    private static final byte[] BIG_FILE_BYTES = new byte[Math.toIntExact(BIG_FILE_SIZE)];
     private static final int CHUNK_SIZE = 1024;
+    private static final long BIG_FILE_SIZE = 10 * CHUNK_SIZE;
+    private static final byte[] BIG_FILE_BYTES = new byte[Math.toIntExact(BIG_FILE_SIZE)];
 
     static {
       var rnd = new Random(42);

From e4383cb3bd0d0fb8c83e7b2a863c2a92eed55b30 Mon Sep 17 00:00:00 2001
From: Kaz Wesley <kaz@lambdaverse.org>
Date: Mon, 26 Feb 2024 15:41:47 -0500
Subject: [PATCH 24/26] Fix CB reloading when vis-selector opened (#9192)

Fixes a bug blocking #8570.
---
 app/ide-desktop/lib/dashboard/src/App.tsx | 13 ++++++++++++-
 1 file changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/ide-desktop/lib/dashboard/src/App.tsx b/app/ide-desktop/lib/dashboard/src/App.tsx
index 139411eb1b54..bfc3090ed015 100644
--- a/app/ide-desktop/lib/dashboard/src/App.tsx
+++ b/app/ide-desktop/lib/dashboard/src/App.tsx
@@ -195,7 +195,18 @@ function AppRouter(props: AppProps) {
         !(event.target instanceof HTMLTextAreaElement) &&
         !(event.target instanceof HTMLElement && event.target.isContentEditable)
       ) {
-        document.getSelection()?.removeAllRanges()
+        const selection = document.getSelection()
+        const app = document.getElementById('app')
+        const appContainsSelection =
+          app != null &&
+          selection != null &&
+          selection.anchorNode != null &&
+          app.contains(selection.anchorNode) &&
+          selection.focusNode != null &&
+          app.contains(selection.focusNode)
+        if (selection != null && !appContainsSelection) {
+          selection.removeAllRanges()
+        }
       }
     }
     const onSelectStart = () => {

From 259ad09957ca2dc262e9da4e2a644e70d0d02f42 Mon Sep 17 00:00:00 2001
From: AdRiley <riley.ad@gmail.com>
Date: Tue, 27 Feb 2024 10:15:03 +0000
Subject: [PATCH 25/26] Update dry run warning messages (#9183)

---
 .../lib/Standard/Base/0.0.0-dev/src/System/File.enso      | 2 +-
 .../Database/0.0.0-dev/src/Internal/Upload_Table.enso     | 8 ++++----
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/distribution/lib/Standard/Base/0.0.0-dev/src/System/File.enso b/distribution/lib/Standard/Base/0.0.0-dev/src/System/File.enso
index 5b93f30e4f79..70e53e5118e5 100644
--- a/distribution/lib/Standard/Base/0.0.0-dev/src/System/File.enso
+++ b/distribution/lib/Standard/Base/0.0.0-dev/src/System/File.enso
@@ -118,7 +118,7 @@ type File
                         temp.delete_if_exists
 
             ## Attach a warning to the file that it is a dry run
-            warning = Dry_Run_Operation.Warning "Only a dry run has occurred, with data written to a temporary file."
+            warning = Dry_Run_Operation.Warning "Only a dry run has occurred, with data written to a temporary file.  Press the Record Once button ❙⬤❙ to write the actual file."
             Warning.attach warning temp
 
     ## ALIAS current directory
diff --git a/distribution/lib/Standard/Database/0.0.0-dev/src/Internal/Upload_Table.enso b/distribution/lib/Standard/Database/0.0.0-dev/src/Internal/Upload_Table.enso
index ee135b47694b..fc234b01a0dd 100644
--- a/distribution/lib/Standard/Database/0.0.0-dev/src/Internal/Upload_Table.enso
+++ b/distribution/lib/Standard/Database/0.0.0-dev/src/Internal/Upload_Table.enso
@@ -52,7 +52,7 @@ create_table_implementation connection table_name structure primary_key temporar
                     internal_create_table_structure connection effective_table_name structure primary_key effective_temporary on_problems
                 if dry_run.not then connection.query (SQL_Query.Table_Name created_table_name) else
                     created_table = connection.base_connection.internal_allocate_dry_run_table created_table_name
-                    warning = Dry_Run_Operation.Warning "Only a dry run of `create_table` has occurred, creating a temporary table ("+created_table_name.pretty+") instead of the actual one."
+                    warning = Dry_Run_Operation.Warning "Only a dry run of `create_table` has occurred, creating a temporary table ("+created_table_name.pretty+").  Press the Record Once button ❙⬤❙ to create the actual one."
                     Warning.attach warning created_table
 
 ## PRIVATE
@@ -119,7 +119,7 @@ select_into_table_implementation source_table connection table_name primary_key
                                 connection.drop_table tmp_table_name if_exists=True
                                 internal_upload_table source_table connection tmp_table_name primary_key temporary=True on_problems=on_problems row_limit=dry_run_row_limit
                             temporary_table = connection.base_connection.internal_allocate_dry_run_table table.name
-                            warning = Dry_Run_Operation.Warning "Only a dry run of `select_into_database_table` was performed - a temporary table ("+tmp_table_name+") was created, containing a sample of the data."
+                            warning = Dry_Run_Operation.Warning "Only a dry run of `select_into_database_table` was performed - a temporary table ("+tmp_table_name+") was created, containing a sample of the data.  Press the Record Once button ❙⬤❙ to write to the actual table."
                             Warning.attach warning temporary_table
 
 ## PRIVATE
@@ -345,7 +345,7 @@ common_update_table (source_table : DB_Table | Table) (target_table : DB_Table)
                                above fails, the whole transaction will be rolled back.
                             connection.drop_table tmp_table.name
                             if dry_run.not then resulting_table else
-                                warning = Dry_Run_Operation.Warning "Only a dry run of `update_rows` was performed - the target table has been returned unchanged."
+                                warning = Dry_Run_Operation.Warning "Only a dry run of `update_rows` was performed - the target table has been returned unchanged.  Press the Record Once button ❙⬤❙ to update the actual table."
                                 Warning.attach warning resulting_table
 
 ## PRIVATE
@@ -550,7 +550,7 @@ common_delete_rows target_table key_values_to_delete key_columns allow_duplicate
                         source.drop_temporary_table connection
                         if dry_run.not then affected_row_count else
                             suffix = source.dry_run_message_suffix
-                            warning = Dry_Run_Operation.Warning "Only a dry run of `delete_rows` was performed - the target table has not been changed."+suffix
+                            warning = Dry_Run_Operation.Warning "Only a dry run of `delete_rows` was performed - the target table has not been changed. Press the Record Once button ❙⬤❙ to update the actual table."+suffix
                             Warning.attach warning affected_row_count
 
 ## PRIVATE

From e59b422612390c591e08b63ad0564611c204fa5d Mon Sep 17 00:00:00 2001
From: somebody1234 <ehern.lee@gmail.com>
Date: Tue, 27 Feb 2024 22:52:21 +1000
Subject: [PATCH 26/26] "Keyboard shortcuts" settings page (#9071)

- Close https://github.com/enso-org/cloud-v2/issues/896
- Add new settings page for viewing and editing keyboard shortcuts
- Refactor shortcut manager to resemble GUI2's shortcuts module
- Minor refactor moving `dashboard/layouts/dashboard` to `dashboard/layouts`; and moving all moals to `dashboard/modals`

# Important Notes
- The modal for capturing keyboard shortcuts has not been tested on macOS.
---
 app/ide-desktop/lib/assets/cross.svg          |   2 +-
 .../lib/assets/keyboard_shortcuts.svg         |  14 +
 .../lib/assets/reload_in_circle.svg           |  16 +
 app/ide-desktop/lib/assets/tick.svg           |   2 +-
 app/ide-desktop/lib/dashboard/.prettierrc.cjs |   4 +
 .../lib/dashboard/e2e/createAsset.spec.ts     |   8 +-
 app/ide-desktop/lib/dashboard/src/App.tsx     | 121 ++-
 .../dashboard/src/components/EditableSpan.tsx |  31 +-
 .../dashboard/src/components/MenuEntry.tsx    |  46 +-
 .../lib/dashboard/src/components/SvgMask.tsx  |   7 +-
 .../src/components/dashboard/AssetRow.tsx     |   9 +-
 .../dashboard/AssetRow/assetRowUtils.tsx      |   2 +-
 .../dashboard/DataLinkNameColumn.tsx          |  19 +-
 .../dashboard/DirectoryNameColumn.tsx         |  19 +-
 .../components/dashboard/FileNameColumn.tsx   |  19 +-
 ...boardShortcut.tsx => KeyboardShortcut.tsx} |  40 +-
 .../dashboard/ProjectNameColumn.tsx           |  52 +-
 .../components/dashboard/SecretNameColumn.tsx |  23 +-
 .../src/components/dashboard/column.ts        |   2 +-
 .../dashboard/column/LabelsColumn.tsx         |   8 +-
 .../dashboard/column/SharedWithColumn.tsx     |   5 +-
 .../src/configurations/inputBindings.ts       | 104 +++
 .../{dashboard => }/AssetContextMenu.tsx      |  60 +-
 .../layouts/{dashboard => }/AssetPanel.tsx    |  10 +-
 .../{dashboard => }/AssetProperties.tsx       |   4 +-
 .../{dashboard => }/AssetSearchBar.tsx        |  10 +-
 .../layouts/{dashboard => }/AssetVersion.tsx  |   0
 .../layouts/{dashboard => }/AssetVersions.tsx |   2 +-
 .../layouts/{dashboard => }/AssetsTable.tsx   | 143 ++--
 .../AssetsTableContextMenu.tsx                |  36 +-
 .../{dashboard => }/BackendSwitcher.tsx       |   0
 .../{dashboard => }/CategorySwitcher.tsx      |   2 +-
 .../CategorySwitcher/Category.ts              |   0
 .../src/layouts/{dashboard => }/Chat.tsx      |   2 +-
 .../{dashboard => }/ChatPlaceholder.tsx       |   4 +-
 .../layouts/{dashboard => }/DataLinkInput.tsx |   0
 .../src/layouts/{dashboard => }/Drive.tsx     |  14 +-
 .../src/layouts/{dashboard => }/DriveBar.tsx  |  23 +-
 .../src/layouts/{dashboard => }/Editor.tsx    |   0
 .../{dashboard => }/GlobalContextMenu.tsx     |  24 +-
 .../src/layouts/{dashboard => }/Home.tsx      |   4 +-
 .../src/layouts/{dashboard => }/Labels.tsx    |  10 +-
 .../layouts/{dashboard => }/PageSwitcher.tsx  |   0
 .../src/layouts/{dashboard => }/Samples.tsx   |   0
 .../src/layouts/{dashboard => }/Settings.tsx  |  19 +-
 .../Settings/AccountSettingsTab.tsx           |   4 +-
 .../Settings/KeyboardShortcutsSettingsTab.tsx | 182 +++++
 .../Settings/MembersSettingsTab.tsx           |   4 +-
 .../Settings/OrganizationSettingsTab.tsx      |   0
 .../{dashboard => }/Settings/SettingsTab.ts   |   0
 .../{dashboard => }/SettingsSidebar.tsx       |  14 +-
 .../src/layouts/{dashboard => }/TopBar.tsx    |  10 +-
 .../src/layouts/{dashboard => }/UserBar.tsx   |   9 +-
 .../src/layouts/{dashboard => }/UserMenu.tsx  |  11 +-
 .../src/layouts/{dashboard => }/WhatsNew.tsx  |   0
 .../modals/CaptureKeyboardShortcutModal.tsx   | 136 ++++
 .../ConfirmDeleteModal.tsx                    |  12 +-
 .../ConfirmDeleteUserModal.tsx                |   0
 .../src/{components => modals}/DragModal.tsx  |   0
 .../DuplicateAssetsModal.tsx                  |   0
 .../dashboard => modals}/InviteUsersModal.tsx |   0
 .../ManageLabelsModal.tsx                     |   0
 .../ManagePermissionsModal.tsx                |   0
 .../dashboard => modals}/NewLabelModal.tsx    |   0
 .../UpsertDataLinkModal.tsx                   |   2 +-
 .../UpsertSecretModal.tsx                     |   0
 .../src/pages/dashboard/Dashboard.tsx         |  90 +--
 .../src/providers/InputBindingsProvider.tsx   |  46 ++
 .../src/providers/ShortcutManagerProvider.tsx |  54 --
 .../src/utilities/ShortcutManager.ts          | 538 -------------
 .../__tests__/ShortcutManager.test.ts         | 185 -----
 .../src/utilities/__tests__/shortcuts.test.ts |  59 ++
 .../lib/dashboard/src/utilities/event.ts      |  28 +
 .../dashboard/src/utilities/inputBindings.ts  | 711 ++++++++++++++++++
 .../lib/dashboard/src/utilities/object.ts     |   2 +-
 .../src/utilities/sanitizedEventTargets.ts    |  56 ++
 .../lib/dashboard/src/utilities/string.ts     |   6 +
 .../lib/dashboard/tailwind.config.js          |   2 +
 78 files changed, 1877 insertions(+), 1204 deletions(-)
 create mode 100644 app/ide-desktop/lib/assets/keyboard_shortcuts.svg
 create mode 100644 app/ide-desktop/lib/assets/reload_in_circle.svg
 rename app/ide-desktop/lib/dashboard/src/components/dashboard/{keyboardShortcut.tsx => KeyboardShortcut.tsx} (62%)
 create mode 100644 app/ide-desktop/lib/dashboard/src/configurations/inputBindings.ts
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetContextMenu.tsx (87%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetPanel.tsx (94%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetProperties.tsx (98%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetSearchBar.tsx (97%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetVersion.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetVersions.tsx (96%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetsTable.tsx (96%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/AssetsTableContextMenu.tsx (86%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/BackendSwitcher.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/CategorySwitcher.tsx (98%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/CategorySwitcher/Category.ts (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Chat.tsx (99%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/ChatPlaceholder.tsx (95%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/DataLinkInput.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Drive.tsx (97%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/DriveBar.tsx (89%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Editor.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/GlobalContextMenu.tsx (88%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Home.tsx (92%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Labels.tsx (95%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/PageSwitcher.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Samples.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Settings.tsx (78%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Settings/AccountSettingsTab.tsx (99%)
 create mode 100644 app/ide-desktop/lib/dashboard/src/layouts/Settings/KeyboardShortcutsSettingsTab.tsx
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Settings/MembersSettingsTab.tsx (97%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Settings/OrganizationSettingsTab.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/Settings/SettingsTab.ts (100%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/SettingsSidebar.tsx (91%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/TopBar.tsx (91%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/UserBar.tsx (94%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/UserMenu.tsx (91%)
 rename app/ide-desktop/lib/dashboard/src/layouts/{dashboard => }/WhatsNew.tsx (100%)
 create mode 100644 app/ide-desktop/lib/dashboard/src/modals/CaptureKeyboardShortcutModal.tsx
 rename app/ide-desktop/lib/dashboard/src/{components/dashboard => modals}/ConfirmDeleteModal.tsx (84%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/ConfirmDeleteUserModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{components => modals}/DragModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/DuplicateAssetsModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/InviteUsersModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/ManageLabelsModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/ManagePermissionsModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/NewLabelModal.tsx (100%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/UpsertDataLinkModal.tsx (98%)
 rename app/ide-desktop/lib/dashboard/src/{layouts/dashboard => modals}/UpsertSecretModal.tsx (100%)
 create mode 100644 app/ide-desktop/lib/dashboard/src/providers/InputBindingsProvider.tsx
 delete mode 100644 app/ide-desktop/lib/dashboard/src/providers/ShortcutManagerProvider.tsx
 delete mode 100644 app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
 delete mode 100644 app/ide-desktop/lib/dashboard/src/utilities/__tests__/ShortcutManager.test.ts
 create mode 100644 app/ide-desktop/lib/dashboard/src/utilities/__tests__/shortcuts.test.ts
 create mode 100644 app/ide-desktop/lib/dashboard/src/utilities/inputBindings.ts
 create mode 100644 app/ide-desktop/lib/dashboard/src/utilities/sanitizedEventTargets.ts

diff --git a/app/ide-desktop/lib/assets/cross.svg b/app/ide-desktop/lib/assets/cross.svg
index 9c90f46ac77d..8e7072587d77 100644
--- a/app/ide-desktop/lib/assets/cross.svg
+++ b/app/ide-desktop/lib/assets/cross.svg
@@ -2,5 +2,5 @@
     <circle cx="8" cy="8" r="8" fill="#3e515fe5" fill-opacity="0.1" />
     <path
         d="M4.8 6.2L6.6 8 4.8 9.8A.5.5 0 1 0 6.2 11.2L8 9.4 9.8 11.2A.5.5 0 1 0 11.2 9.8L9.4 8 11.2 6.2A.5.5 0 1 0 9.8 4.8L8 6.6 6.2 4.8A.5.5 0 1 0 4.8 6.2Z"
-        fill="#3e515fe5" />
+        fill="#3e515fe5" fill-opacity="0.66" />
 </svg>
\ No newline at end of file
diff --git a/app/ide-desktop/lib/assets/keyboard_shortcuts.svg b/app/ide-desktop/lib/assets/keyboard_shortcuts.svg
new file mode 100644
index 000000000000..c21ad89b5f9c
--- /dev/null
+++ b/app/ide-desktop/lib/assets/keyboard_shortcuts.svg
@@ -0,0 +1,14 @@
+<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <g opacity="0.5">
+        <rect x="4" y="10.5" width="8" height="3" fill="black" />
+        <rect x="13" y="10.5" width="3" height="3" fill="black" />
+        <rect y="2.5" width="3" height="3" fill="black" />
+        <rect x="4" y="2.5" width="3" height="3" fill="black" />
+        <rect x="8" y="2.5" width="3" height="3" fill="black" />
+        <rect x="8" y="6.5" width="8" height="3" fill="black" />
+        <rect x="12" y="2.5" width="4" height="4" fill="black" />
+    </g>
+    <rect y="10.5" width="3" height="3" fill="black" />
+    <rect y="6.5" width="3" height="3" fill="black" />
+    <rect x="4" y="6.5" width="3" height="3" fill="black" />
+</svg>
\ No newline at end of file
diff --git a/app/ide-desktop/lib/assets/reload_in_circle.svg b/app/ide-desktop/lib/assets/reload_in_circle.svg
new file mode 100644
index 000000000000..81d6ce3b3bab
--- /dev/null
+++ b/app/ide-desktop/lib/assets/reload_in_circle.svg
@@ -0,0 +1,16 @@
+<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_22795_32405)">
+<path d="M9 18C13.9706 18 18 13.9706 18 9C18 4.02944 13.9706 0 9 0C4.02944 0 0 4.02944 0 9C0 13.9706 4.02944 18 9 18Z" fill="#3E515F" fill-opacity="0.0898039"/>
+<g opacity="0.6">
+<path d="M9.39065 2.27937L8.32999 3.34003L10.8049 5.8149L11.8655 4.75424L9.39065 2.27937Z" fill="#3E515F"/>
+<path d="M10.8049 3.68513L8.32999 6.16L9.39065 7.22066L11.8655 4.74579L10.8049 3.68513Z" fill="#3E515F"/>
+<path d="M14 9C14 9.98891 13.7068 10.9556 13.1573 11.7779C12.6079 12.6001 11.827 13.241 10.9134 13.6194C9.99979 13.9978 8.99445 14.0969 8.02455 13.9039C7.05464 13.711 6.16373 13.2348 5.46447 12.5355C4.7652 11.8363 4.289 10.9454 4.09607 9.97545C3.90315 9.00555 4.00216 8.00021 4.3806 7.08658C4.75904 6.17295 5.3999 5.39206 6.22215 4.84265C7.04439 4.29324 8.01109 4 9 4L9 5.5C8.30777 5.5 7.63108 5.70527 7.0555 6.08986C6.47993 6.47444 6.03133 7.02107 5.76642 7.66061C5.50151 8.30015 5.4322 9.00388 5.56725 9.68282C5.7023 10.3617 6.03564 10.9854 6.52513 11.4749C7.01461 11.9644 7.63825 12.2977 8.31718 12.4327C8.99612 12.5678 9.69985 12.4985 10.3394 12.2336C10.9789 11.9687 11.5256 11.5201 11.9101 10.9445C12.2947 10.3689 12.5 9.69223 12.5 9H14Z" fill="#3E515F"/>
+<rect x="9" y="4" width="1" height="2" fill="#3E515F"/>
+</g>
+</g>
+<defs>
+<clipPath id="clip0_22795_32405">
+<rect width="18" height="18" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/app/ide-desktop/lib/assets/tick.svg b/app/ide-desktop/lib/assets/tick.svg
index 6d0455cac8b4..f28f2c5e71d8 100644
--- a/app/ide-desktop/lib/assets/tick.svg
+++ b/app/ide-desktop/lib/assets/tick.svg
@@ -1,5 +1,5 @@
 <svg height="16" width="16" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
     <circle cx="8" cy="8" r="8" fill="#3e515fe5" fill-opacity="0.1" />
     <path d="M3.4 9.2L5.7 11.5A1 1 0 0 0 7.3 11.5L12.6 6.2A.5.5 0 1 0 11.2 4.8L6.5 9.5 4.8 7.8A.5.5 0 1 0 3.4 9.2"
-        fill="#3e515fe5" />
+        fill="#3e515fe5" fill-opacity="0.66" />
 </svg>
\ No newline at end of file
diff --git a/app/ide-desktop/lib/dashboard/.prettierrc.cjs b/app/ide-desktop/lib/dashboard/.prettierrc.cjs
index a3c7a74a8aa0..07f5f9a4bdea 100644
--- a/app/ide-desktop/lib/dashboard/.prettierrc.cjs
+++ b/app/ide-desktop/lib/dashboard/.prettierrc.cjs
@@ -25,6 +25,8 @@ module.exports = {
           '^#[/]App',
           '^#[/]appUtils',
           '',
+          '^#[/]configurations[/]',
+          '',
           '^#[/]data[/]',
           '',
           '^#[/]hooks[/]',
@@ -39,6 +41,8 @@ module.exports = {
           '',
           '^#[/]components[/]',
           '',
+          '^#[/]modals[/]',
+          '',
           '^#[/]services[/]',
           '',
           '^#[/]utilities[/]',
diff --git a/app/ide-desktop/lib/dashboard/e2e/createAsset.spec.ts b/app/ide-desktop/lib/dashboard/e2e/createAsset.spec.ts
index a5e2cd7ce1a7..e87140d7ddbc 100644
--- a/app/ide-desktop/lib/dashboard/e2e/createAsset.spec.ts
+++ b/app/ide-desktop/lib/dashboard/e2e/createAsset.spec.ts
@@ -32,13 +32,7 @@ test.test('upload file', async ({ page }) => {
   const fileChooser = await fileChooserPromise
   const name = 'foo.txt'
   const content = 'hello world'
-  await fileChooser.setFiles([
-    {
-      name,
-      buffer: Buffer.from(content),
-      mimeType: 'text/plain',
-    },
-  ])
+  await fileChooser.setFiles([{ name, buffer: Buffer.from(content), mimeType: 'text/plain' }])
 
   await test.expect(assetRows).toHaveCount(1)
   await test.expect(assetRows.nth(0)).toBeVisible()
diff --git a/app/ide-desktop/lib/dashboard/src/App.tsx b/app/ide-desktop/lib/dashboard/src/App.tsx
index bfc3090ed015..e75967249241 100644
--- a/app/ide-desktop/lib/dashboard/src/App.tsx
+++ b/app/ide-desktop/lib/dashboard/src/App.tsx
@@ -42,16 +42,18 @@ import * as detect from 'enso-common/src/detect'
 
 import * as appUtils from '#/appUtils'
 
+import * as inputBindingsModule from '#/configurations/inputBindings'
+
 import * as navigateHooks from '#/hooks/navigateHooks'
 
 import AuthProvider, * as authProvider from '#/providers/AuthProvider'
 import BackendProvider from '#/providers/BackendProvider'
-import LocalStorageProvider from '#/providers/LocalStorageProvider'
+import InputBindingsProvider from '#/providers/InputBindingsProvider'
+import LocalStorageProvider, * as localStorageProvider from '#/providers/LocalStorageProvider'
 import LoggerProvider from '#/providers/LoggerProvider'
 import type * as loggerProvider from '#/providers/LoggerProvider'
 import ModalProvider from '#/providers/ModalProvider'
 import SessionProvider from '#/providers/SessionProvider'
-import ShortcutManagerProvider from '#/providers/ShortcutManagerProvider'
 
 import ConfirmRegistration from '#/pages/authentication/ConfirmRegistration'
 import EnterOfflineMode from '#/pages/authentication/EnterOfflineMode'
@@ -66,10 +68,39 @@ import Subscribe from '#/pages/subscribe/Subscribe'
 import type Backend from '#/services/Backend'
 import LocalBackend from '#/services/LocalBackend'
 
-import ShortcutManager, * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import LocalStorage from '#/utilities/LocalStorage'
 
 import * as authServiceModule from '#/authentication/service'
 
+// ============================
+// === Global configuration ===
+// ============================
+
+declare module '#/utilities/LocalStorage' {
+  /** */
+  interface LocalStorageData {
+    readonly inputBindings: Partial<
+      Readonly<Record<inputBindingsModule.DashboardBindingKey, string[]>>
+    >
+  }
+}
+
+LocalStorage.registerKey('inputBindings', {
+  tryParse: value =>
+    typeof value !== 'object' || value == null
+      ? null
+      : Object.fromEntries(
+          // This is SAFE, as it is a readonly upcast.
+          // eslint-disable-next-line no-restricted-syntax
+          Object.entries(value as Readonly<Record<string, unknown>>).flatMap(kv => {
+            const [k, v] = kv
+            return Array.isArray(v) && v.every((item): item is string => typeof item === 'string')
+              ? [[k, v]]
+              : []
+          })
+        ),
+})
+
 // ======================
 // === getMainPageUrl ===
 // ======================
@@ -113,8 +144,9 @@ export default function App(props: AppProps) {
   // This is a React component even though it does not contain JSX.
   // eslint-disable-next-line no-restricted-syntax
   const Router = detect.isOnElectron() ? router.MemoryRouter : router.BrowserRouter
-  /** Note that the `Router` must be the parent of the `AuthProvider`, because the `AuthProvider`
-   * will redirect the user between the login/register pages and the dashboard. */
+  // Both `BackendProvider` and `InputBindingsProvider` depend on `LocalStorageProvider`.
+  // Note that the `Router` must be the parent of the `AuthProvider`, because the `AuthProvider`
+  // will redirect the user between the login/register pages and the dashboard.
   return (
     <>
       <toastify.ToastContainer
@@ -127,7 +159,9 @@ export default function App(props: AppProps) {
         limit={3}
       />
       <Router basename={getMainPageUrl().pathname}>
-        <AppRouter {...props} />
+        <LocalStorageProvider>
+          <AppRouter {...props} />
+        </LocalStorageProvider>
       </Router>
     </>
   )
@@ -145,32 +179,67 @@ export default function App(props: AppProps) {
 function AppRouter(props: AppProps) {
   const { logger, supportsLocalBackend, isAuthenticationDisabled, shouldShowDashboard } = props
   const { onAuthenticated, projectManagerUrl } = props
+  const { localStorage } = localStorageProvider.useLocalStorage()
   const navigate = navigateHooks.useNavigate()
   if (detect.IS_DEV_MODE) {
     // @ts-expect-error This is used exclusively for debugging.
     window.navigate = navigate
   }
-  const [shortcutManager] = React.useState(() => ShortcutManager.createWithDefaults())
+  const [inputBindingsRaw] = React.useState(() => inputBindingsModule.createBindings())
   React.useEffect(() => {
-    const onKeyDown = (event: KeyboardEvent) => {
-      const isTargetEditable =
-        event.target instanceof HTMLInputElement ||
-        (event.target instanceof HTMLElement && event.target.isContentEditable)
-      const shouldHandleEvent = isTargetEditable
-        ? !shortcutManagerModule.isTextInputEvent(event)
-        : true
-      if (shouldHandleEvent && shortcutManager.handleKeyboardEvent(event)) {
-        event.preventDefault()
-        // This is required to prevent the event from propagating to the event handler
-        // that focuses the search input.
-        event.stopImmediatePropagation()
+    const savedInputBindings = localStorage.get('inputBindings')
+    for (const k in savedInputBindings) {
+      // This is UNSAFE, hence the `?? []` below.
+      // eslint-disable-next-line no-restricted-syntax
+      const bindingKey = k as inputBindingsModule.DashboardBindingKey
+      // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+      for (const oldBinding of inputBindingsRaw.metadata[bindingKey].bindings ?? []) {
+        inputBindingsRaw.delete(bindingKey, oldBinding)
+      }
+      for (const newBinding of savedInputBindings[bindingKey] ?? []) {
+        inputBindingsRaw.add(bindingKey, newBinding)
       }
     }
-    document.body.addEventListener('keydown', onKeyDown)
-    return () => {
-      document.body.removeEventListener('keydown', onKeyDown)
+  }, [/* should never change */ localStorage, /* should never change */ inputBindingsRaw])
+  const inputBindings = React.useMemo(() => {
+    const updateLocalStorage = () => {
+      localStorage.set(
+        'inputBindings',
+        Object.fromEntries(
+          Object.entries(inputBindingsRaw.metadata).map(kv => {
+            const [k, v] = kv
+            return [k, v.bindings]
+          })
+        )
+      )
     }
-  }, [shortcutManager])
+    return {
+      /** Transparently pass through `handler()`. */
+      get handler() {
+        return inputBindingsRaw.handler
+      },
+      /** Transparently pass through `attach()`. */
+      get attach() {
+        return inputBindingsRaw.attach
+      },
+      reset: (bindingKey: inputBindingsModule.DashboardBindingKey) => {
+        inputBindingsRaw.reset(bindingKey)
+        updateLocalStorage()
+      },
+      add: (bindingKey: inputBindingsModule.DashboardBindingKey, binding: string) => {
+        inputBindingsRaw.add(bindingKey, binding)
+        updateLocalStorage()
+      },
+      delete: (bindingKey: inputBindingsModule.DashboardBindingKey, binding: string) => {
+        inputBindingsRaw.delete(bindingKey, binding)
+        updateLocalStorage()
+      },
+      /** Transparently pass through `metadata`. */
+      get metadata() {
+        return inputBindingsRaw.metadata
+      },
+    }
+  }, [/* should never change */ localStorage, /* should never change */ inputBindingsRaw])
   const mainPageUrl = getMainPageUrl()
   const authService = React.useMemo(() => {
     const authConfig = { navigate, ...props }
@@ -253,9 +322,7 @@ function AppRouter(props: AppProps) {
     </router.Routes>
   )
   let result = routes
-  result = (
-    <ShortcutManagerProvider shortcutManager={shortcutManager}>{result}</ShortcutManagerProvider>
-  )
+  result = <InputBindingsProvider inputBindings={inputBindings}>{result}</InputBindingsProvider>
   result = <ModalProvider>{result}</ModalProvider>
   result = (
     <AuthProvider
@@ -269,8 +336,6 @@ function AppRouter(props: AppProps) {
     </AuthProvider>
   )
   result = <BackendProvider initialBackend={initialBackend}>{result}</BackendProvider>
-  /** {@link BackendProvider} depends on {@link LocalStorageProvider}. */
-  result = <LocalStorageProvider>{result}</LocalStorageProvider>
   result = (
     <SessionProvider
       mainPageUrl={mainPageUrl}
diff --git a/app/ide-desktop/lib/dashboard/src/components/EditableSpan.tsx b/app/ide-desktop/lib/dashboard/src/components/EditableSpan.tsx
index b8c5be959b09..e5c9208bbb20 100644
--- a/app/ide-desktop/lib/dashboard/src/components/EditableSpan.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/EditableSpan.tsx
@@ -4,9 +4,9 @@ import * as React from 'react'
 import CrossIcon from 'enso-assets/cross.svg'
 import TickIcon from 'enso-assets/tick.svg'
 
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import * as sanitizedEventTargets from '#/utilities/sanitizedEventTargets'
 
 // ====================
 // === EditableSpan ===
@@ -31,7 +31,7 @@ export interface EditableSpanProps {
 export default function EditableSpan(props: EditableSpanProps) {
   const { 'data-testid': dataTestId, className, editable = false, children } = props
   const { checkSubmittable, onSubmit, onCancel, inputPattern, inputTitle } = props
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const [isSubmittable, setIsSubmittable] = React.useState(true)
   const inputRef = React.useRef<HTMLInputElement>(null)
   const cancelled = React.useRef(false)
@@ -44,8 +44,8 @@ export default function EditableSpan(props: EditableSpanProps) {
 
   React.useEffect(() => {
     if (editable) {
-      return shortcutManager.registerKeyboardHandlers({
-        [shortcutManagerModule.KeyboardAction.cancelEditName]: () => {
+      return inputBindings.attach(sanitizedEventTargets.document.body, 'keydown', {
+        cancelEditName: () => {
           onCancel()
           cancelled.current = true
           inputRef.current?.blur()
@@ -54,7 +54,7 @@ export default function EditableSpan(props: EditableSpanProps) {
     } else {
       return
     }
-  }, [editable, shortcutManager, onCancel])
+  }, [editable, onCancel, /* should never change */ inputBindings])
 
   React.useEffect(() => {
     cancelled.current = false
@@ -86,21 +86,12 @@ export default function EditableSpan(props: EditableSpanProps) {
               event.currentTarget.form?.requestSubmit()
             }
           }}
+          onContextMenu={event => {
+            event.stopPropagation()
+          }}
           onKeyDown={event => {
-            if (
-              !event.isPropagationStopped() &&
-              ((event.ctrlKey &&
-                !event.shiftKey &&
-                !event.altKey &&
-                !event.metaKey &&
-                /^[xcvzy]$/.test(event.key)) ||
-                (event.ctrlKey &&
-                  event.shiftKey &&
-                  !event.altKey &&
-                  !event.metaKey &&
-                  /[Z]/.test(event.key)))
-            ) {
-              // This is an event that will be handled by the input.
+            if (event.key !== 'Escape') {
+              // The input may handle the event.
               event.stopPropagation()
             }
           }}
diff --git a/app/ide-desktop/lib/dashboard/src/components/MenuEntry.tsx b/app/ide-desktop/lib/dashboard/src/components/MenuEntry.tsx
index 6052d9399820..8ea009c07b38 100644
--- a/app/ide-desktop/lib/dashboard/src/components/MenuEntry.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/MenuEntry.tsx
@@ -1,12 +1,16 @@
 /** @file An entry in a menu. */
 import * as React from 'react'
 
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import BlankIcon from 'enso-assets/blank.svg'
 
-import KeyboardShortcut from '#/components/dashboard/keyboardShortcut'
+import type * as inputBindings from '#/configurations/inputBindings'
+
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
+
+import KeyboardShortcut from '#/components/dashboard/KeyboardShortcut'
 import SvgMask from '#/components/SvgMask'
 
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import * as sanitizedEventTargets from '#/utilities/sanitizedEventTargets'
 
 // =================
 // === MenuEntry ===
@@ -15,7 +19,9 @@ import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 /** Props for a {@link MenuEntry}. */
 export interface MenuEntryProps {
   readonly hidden?: boolean
-  readonly action: shortcutManagerModule.KeyboardAction
+  readonly action: inputBindings.DashboardBindingKey
+  /** Overrides the text for the menu entry. */
+  readonly label?: string
   /** When true, the button is not clickable. */
   readonly disabled?: boolean
   readonly title?: string
@@ -25,19 +31,22 @@ export interface MenuEntryProps {
 
 /** An item in a menu. */
 export default function MenuEntry(props: MenuEntryProps) {
-  const { hidden = false, action, disabled = false, title, paddingClassName, doAction } = props
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
-  const info = shortcutManager.keyboardShortcutInfo[action]
+  const { hidden = false, action, label, disabled = false, title, paddingClassName } = props
+  const { doAction } = props
+  const inputBindings = inputBindingsProvider.useInputBindings()
+  const info = inputBindings.metadata[action]
   React.useEffect(() => {
-    // This is slower than registering every shortcut in the context menu at once.
-    if (!disabled) {
-      return shortcutManager.registerKeyboardHandlers({
+    // This is slower (but more convenient) than registering every shortcut in the context menu
+    // at once.
+    if (disabled) {
+      return
+    } else {
+      return inputBindings.attach(sanitizedEventTargets.document.body, 'keydown', {
         [action]: doAction,
       })
-    } else {
-      return
     }
-  }, [disabled, shortcutManager, action, doAction])
+  }, [disabled, inputBindings, action, doAction])
+
   return hidden ? null : (
     <button
       disabled={disabled}
@@ -51,15 +60,8 @@ export default function MenuEntry(props: MenuEntryProps) {
       }}
     >
       <div className="flex items-center gap-3">
-        <SvgMask
-          style={{
-            width: shortcutManagerModule.ICON_SIZE_PX,
-            height: shortcutManagerModule.ICON_SIZE_PX,
-          }}
-          src={info.icon}
-          className={info.colorClass}
-        />
-        {info.name}
+        <SvgMask src={info.icon ?? BlankIcon} color={info.color} className="w-4 h-4" />
+        {label ?? info.name}
       </div>
       <KeyboardShortcut action={action} />
     </button>
diff --git a/app/ide-desktop/lib/dashboard/src/components/SvgMask.tsx b/app/ide-desktop/lib/dashboard/src/components/SvgMask.tsx
index ac1900345a28..5e418082bc93 100644
--- a/app/ide-desktop/lib/dashboard/src/components/SvgMask.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/SvgMask.tsx
@@ -12,6 +12,9 @@ export interface SvgMaskProps {
   readonly src: string
   readonly title?: string
   readonly style?: React.CSSProperties
+  // Allowing `undefined` is fine here as this prop has a fallback.
+  // eslint-disable-next-line no-restricted-syntax
+  readonly color?: string | undefined
   // Allowing `undefined` is fine here as this prop is being transparently passed through to the
   // underlying `div`.
   // eslint-disable-next-line no-restricted-syntax
@@ -21,7 +24,7 @@ export interface SvgMaskProps {
 
 /** Use an SVG as a mask. This lets the SVG use the text color (`currentColor`). */
 export default function SvgMask(props: SvgMaskProps) {
-  const { alt, src, title, style, className, onClick } = props
+  const { alt, src, title, style, color, className, onClick } = props
   const urlSrc = `url(${JSON.stringify(src)})`
 
   return (
@@ -29,7 +32,7 @@ export default function SvgMask(props: SvgMaskProps) {
       title={title}
       style={{
         ...(style ?? {}),
-        backgroundColor: 'currentcolor',
+        backgroundColor: color ?? 'currentcolor',
         mask: urlSrc,
         // The names come from a third-party API and cannot be changed.
         // eslint-disable-next-line @typescript-eslint/naming-convention
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
index d09c3fffefad..61afc1b7fd36 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow.tsx
@@ -14,8 +14,8 @@ import * as modalProvider from '#/providers/ModalProvider'
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import AssetContextMenu from '#/layouts/dashboard/AssetContextMenu'
-import type * as assetsTable from '#/layouts/dashboard/AssetsTable'
+import AssetContextMenu from '#/layouts/AssetContextMenu'
+import type * as assetsTable from '#/layouts/AssetsTable'
 
 import * as assetRowUtils from '#/components/dashboard/AssetRow/assetRowUtils'
 import * as columnModule from '#/components/dashboard/column'
@@ -403,10 +403,7 @@ export default function AssetRow(props: AssetRowProps) {
               resourceId: asset.id,
               userSubjects: [userInfo.id],
             })
-            dispatchAssetListEvent({
-              type: AssetListEventType.delete,
-              key: item.key,
-            })
+            dispatchAssetListEvent({ type: AssetListEventType.delete, key: item.key })
           } catch (error) {
             setInsertionVisibility(Visibility.visible)
             toastAndLog(null, error)
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow/assetRowUtils.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow/assetRowUtils.tsx
index 568f86155bbd..32b3d751e196 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow/assetRowUtils.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/AssetRow/assetRowUtils.tsx
@@ -1,5 +1,5 @@
 /** @file Utilities related to `AssetRow`s. */
-import type * as assetsTable from '#/layouts/dashboard/AssetsTable'
+import type * as assetsTable from '#/layouts/AssetsTable'
 
 import * as set from '#/utilities/set'
 
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
index cba02c1d9a8e..437142c4e8e8 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/DataLinkNameColumn.tsx
@@ -8,7 +8,7 @@ import * as setAssetHooks from '#/hooks/setAssetHooks'
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as backendProvider from '#/providers/BackendProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
@@ -21,7 +21,6 @@ import * as backendModule from '#/services/Backend'
 import * as eventModule from '#/utilities/event'
 import * as indent from '#/utilities/indent'
 import * as object from '#/utilities/object'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import Visibility from '#/utilities/visibility'
 
 // =====================
@@ -39,7 +38,7 @@ export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
   const { assetEvents, dispatchAssetListEvent, setIsAssetPanelTemporarilyVisible } = state
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const asset = item.item
   if (asset.type !== backendModule.AssetType.dataLink) {
     // eslint-disable-next-line no-restricted-syntax
@@ -111,6 +110,12 @@ export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
     }
   })
 
+  const handleClick = inputBindings.handler({
+    editName: () => {
+      setRowState(object.merger({ isEditingName: true }))
+    },
+  })
+
   return (
     <div
       className={`flex text-left items-center whitespace-nowrap rounded-l-full gap-1 px-1.5 py-1 min-w-max ${indent.indentClass(
@@ -122,11 +127,9 @@ export default function DataLinkNameColumn(props: DataLinkNameColumnProps) {
         }
       }}
       onClick={event => {
-        if (
-          eventModule.isSingleClick(event) &&
-          (selected ||
-            shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.editName, event))
-        ) {
+        if (handleClick(event)) {
+          // Already handled.
+        } else if (eventModule.isSingleClick(event) && selected) {
           setRowState(object.merger({ isEditingName: true }))
         } else if (eventModule.isDoubleClick(event)) {
           event.stopPropagation()
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
index cc63ca8ff181..750345f26150 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/DirectoryNameColumn.tsx
@@ -9,7 +9,7 @@ import * as setAssetHooks from '#/hooks/setAssetHooks'
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as backendProvider from '#/providers/BackendProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
@@ -23,7 +23,6 @@ import * as backendModule from '#/services/Backend'
 import * as eventModule from '#/utilities/event'
 import * as indent from '#/utilities/indent'
 import * as object from '#/utilities/object'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import * as string from '#/utilities/string'
 import Visibility from '#/utilities/visibility'
 
@@ -43,7 +42,7 @@ export default function DirectoryNameColumn(props: DirectoryNameColumnProps) {
   const { doToggleDirectoryExpansion } = state
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const asset = item.item
   if (asset.type !== backendModule.AssetType.directory) {
     // eslint-disable-next-line no-restricted-syntax
@@ -123,6 +122,12 @@ export default function DirectoryNameColumn(props: DirectoryNameColumnProps) {
     }
   })
 
+  const handleClick = inputBindings.handler({
+    editName: () => {
+      setRowState(object.merger({ isEditingName: true }))
+    },
+  })
+
   return (
     <div
       className={`group flex text-left items-center whitespace-nowrap rounded-l-full gap-1 px-1.5 py-1 min-w-max ${indent.indentClass(
@@ -134,10 +139,12 @@ export default function DirectoryNameColumn(props: DirectoryNameColumnProps) {
         }
       }}
       onClick={event => {
-        if (
+        if (handleClick(event)) {
+          // Already handled.
+        } else if (
           eventModule.isSingleClick(event) &&
-          ((selected && selectedKeys.current.size === 1) ||
-            shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.editName, event))
+          selected &&
+          selectedKeys.current.size === 1
         ) {
           event.stopPropagation()
           setRowState(object.merger({ isEditingName: true }))
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
index 0198e946df86..b223fb913f0f 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/FileNameColumn.tsx
@@ -6,7 +6,7 @@ import * as setAssetHooks from '#/hooks/setAssetHooks'
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as backendProvider from '#/providers/BackendProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
@@ -21,7 +21,6 @@ import * as eventModule from '#/utilities/event'
 import * as fileIcon from '#/utilities/fileIcon'
 import * as indent from '#/utilities/indent'
 import * as object from '#/utilities/object'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import Visibility from '#/utilities/visibility'
 
 // ================
@@ -39,7 +38,7 @@ export default function FileNameColumn(props: FileNameColumnProps) {
   const { nodeMap, assetEvents, dispatchAssetListEvent } = state
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const asset = item.item
   if (asset.type !== backendModule.AssetType.file) {
     // eslint-disable-next-line no-restricted-syntax
@@ -113,6 +112,12 @@ export default function FileNameColumn(props: FileNameColumnProps) {
     }
   })
 
+  const handleClick = inputBindings.handler({
+    editName: () => {
+      setRowState(object.merger({ isEditingName: true }))
+    },
+  })
+
   return (
     <div
       className={`flex text-left items-center align-middle whitespace-nowrap rounded-l-full gap-1 px-1.5 py-1 min-w-max ${indent.indentClass(
@@ -124,11 +129,9 @@ export default function FileNameColumn(props: FileNameColumnProps) {
         }
       }}
       onClick={event => {
-        if (
-          eventModule.isSingleClick(event) &&
-          (selected ||
-            shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.editName, event))
-        ) {
+        if (handleClick(event)) {
+          // Already handled.
+        } else if (eventModule.isSingleClick(event) && selected) {
           setRowState(object.merger({ isEditingName: true }))
         }
       }}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/keyboardShortcut.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/KeyboardShortcut.tsx
similarity index 62%
rename from app/ide-desktop/lib/dashboard/src/components/dashboard/keyboardShortcut.tsx
rename to app/ide-desktop/lib/dashboard/src/components/dashboard/KeyboardShortcut.tsx
index 1bffe6f43972..e853b31cdd3d 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/keyboardShortcut.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/KeyboardShortcut.tsx
@@ -8,11 +8,13 @@ import ShiftKeyIcon from 'enso-assets/shift_key.svg'
 import WindowsKeyIcon from 'enso-assets/windows_key.svg'
 import * as detect from 'enso-common/src/detect'
 
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import type * as dashboardInputBindings from '#/configurations/inputBindings'
+
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
 import SvgMask from '#/components/SvgMask'
 
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import * as inputBindingsModule from '#/utilities/inputBindings'
 
 // ========================
 // === KeyboardShortcut ===
@@ -25,7 +27,7 @@ const ICON_STYLE = { width: ICON_SIZE_PX, height: ICON_SIZE_PX }
 
 /** Icons for modifier keys (if they exist). */
 const MODIFIER_MAPPINGS: Readonly<
-  Record<detect.Platform, Partial<Record<shortcutManagerModule.ModifierKey, React.ReactNode>>>
+  Record<detect.Platform, Partial<Record<inputBindingsModule.ModifierKey, React.ReactNode>>>
 > = {
   // The names are intentionally not in `camelCase`, as they are case-sensitive.
   /* eslint-disable @typescript-eslint/naming-convention */
@@ -57,22 +59,34 @@ const MODIFIER_MAPPINGS: Readonly<
   /* eslint-enable @typescript-eslint/naming-convention */
 }
 
-/** Props for a {@link KeyboardShortcut} */
-export interface KeyboardShortcutProps {
-  readonly action: shortcutManagerModule.KeyboardAction
+/** Props for a {@link KeyboardShortcut}, specifying the keyboard action. */
+export interface KeyboardShortcutActionProps {
+  readonly action: dashboardInputBindings.DashboardBindingKey
+}
+
+/** Props for a {@link KeyboardShortcut}, specifying the shortcut string. */
+export interface KeyboardShortcutShortcutProps {
+  readonly shortcut: string
 }
 
+/** Props for a {@link KeyboardShortcut}. */
+export type KeyboardShortcutProps = KeyboardShortcutActionProps | KeyboardShortcutShortcutProps
+
 /** A visual representation of a keyboard shortcut. */
 export default function KeyboardShortcut(props: KeyboardShortcutProps) {
-  const { action } = props
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
-  const shortcut = shortcutManager.keyboardShortcuts[action][0]
-  if (shortcut == null) {
+  const inputBindings = inputBindingsProvider.useInputBindings()
+  const shortcutString =
+    'shortcut' in props ? props.shortcut : inputBindings.metadata[props.action].bindings[0]
+  if (shortcutString == null) {
     return null
   } else {
+    const shortcut = inputBindingsModule.decomposeKeybindString(shortcutString)
+    const modifiers = [...shortcut.modifiers]
+      .sort(inputBindingsModule.compareModifiers)
+      .map(inputBindingsModule.toModifierKey)
     return (
       <div className={`flex items-center h-6 ${detect.isOnMacOS() ? 'gap-0.5' : 'gap-0.75'}`}>
-        {shortcutManagerModule.getModifierKeysOfShortcut(shortcut).map(
+        {modifiers.map(
           modifier =>
             MODIFIER_MAPPINGS[detect.platform()][modifier] ?? (
               <span key={modifier} className="leading-170 h-6 py-px">
@@ -80,7 +94,9 @@ export default function KeyboardShortcut(props: KeyboardShortcutProps) {
               </span>
             )
         )}
-        <span className="leading-170 h-6 py-px">{shortcut.key}</span>
+        <span className="leading-170 h-6 py-px">
+          {shortcut.key === ' ' ? 'Space' : shortcut.key}
+        </span>
       </div>
     )
   }
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
index c4b39fd41761..ed40bb6723f4 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/ProjectNameColumn.tsx
@@ -9,7 +9,7 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
@@ -25,7 +25,6 @@ import * as eventModule from '#/utilities/event'
 import * as indent from '#/utilities/indent'
 import * as object from '#/utilities/object'
 import * as permissions from '#/utilities/permissions'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import * as string from '#/utilities/string'
 import * as validation from '#/utilities/validation'
 import Visibility from '#/utilities/visibility'
@@ -47,7 +46,7 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { backend } = backendProvider.useBackend()
   const { user } = authProvider.useNonPartialUserSession()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const asset = item.item
   if (asset.type !== backendModule.AssetType.project) {
     // eslint-disable-next-line no-restricted-syntax
@@ -241,6 +240,28 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
     }
   })
 
+  const handleClick = inputBindings.handler({
+    open: () => {
+      dispatchAssetEvent({
+        type: AssetEventType.openProject,
+        id: asset.id,
+        shouldAutomaticallySwitchPage: true,
+        runInBackground: false,
+      })
+    },
+    run: () => {
+      dispatchAssetEvent({
+        type: AssetEventType.openProject,
+        id: asset.id,
+        shouldAutomaticallySwitchPage: false,
+        runInBackground: true,
+      })
+    },
+    editName: () => {
+      setRowState(object.merger({ isEditingName: true }))
+    },
+  })
+
   return (
     <div
       className={`flex text-left items-center whitespace-nowrap rounded-l-full gap-1 px-1.5 py-1 min-w-max ${indent.indentClass(
@@ -254,30 +275,13 @@ export default function ProjectNameColumn(props: ProjectNameColumnProps) {
       onClick={event => {
         if (rowState.isEditingName || isOtherUserUsingProject) {
           // The project should neither be edited nor opened in these cases.
-        } else if (
-          shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.open, event)
-        ) {
-          // It is a double click; open the project.
-          dispatchAssetEvent({
-            type: AssetEventType.openProject,
-            id: asset.id,
-            shouldAutomaticallySwitchPage: true,
-            runInBackground: false,
-          })
-        } else if (
-          shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.run, event)
-        ) {
-          dispatchAssetEvent({
-            type: AssetEventType.openProject,
-            id: asset.id,
-            shouldAutomaticallySwitchPage: false,
-            runInBackground: true,
-          })
+        } else if (handleClick(event)) {
+          // Already handled.
         } else if (
           !isRunning &&
           eventModule.isSingleClick(event) &&
-          ((selected && selectedKeys.current.size === 1) ||
-            shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.editName, event))
+          selected &&
+          selectedKeys.current.size === 1
         ) {
           setRowState(object.merger({ isEditingName: true }))
         }
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
index 8998874fcb9d..d8dbc70be74c 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/SecretNameColumn.tsx
@@ -8,23 +8,22 @@ import * as setAssetHooks from '#/hooks/setAssetHooks'
 import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as backendProvider from '#/providers/BackendProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 import * as modalProvider from '#/providers/ModalProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
-
 import type * as column from '#/components/dashboard/column'
 import SvgMask from '#/components/SvgMask'
 
+import UpsertSecretModal from '#/modals/UpsertSecretModal'
+
 import * as backendModule from '#/services/Backend'
 
 import * as eventModule from '#/utilities/event'
 import * as indent from '#/utilities/indent'
 import * as object from '#/utilities/object'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import Visibility from '#/utilities/visibility'
 
 // =====================
@@ -43,7 +42,7 @@ export default function SecretNameColumn(props: SecretNameColumnProps) {
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { setModal } = modalProvider.useSetModal()
   const { backend } = backendProvider.useBackend()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const asset = item.item
   if (asset.type !== backendModule.AssetType.secret) {
     // eslint-disable-next-line no-restricted-syntax
@@ -107,6 +106,12 @@ export default function SecretNameColumn(props: SecretNameColumnProps) {
     }
   })
 
+  const handleClick = inputBindings.handler({
+    editName: () => {
+      setRowState(object.merger({ isEditingName: true }))
+    },
+  })
+
   return (
     <div
       className={`flex text-left items-center whitespace-nowrap rounded-l-full gap-1 px-1.5 py-1 min-w-max ${indent.indentClass(
@@ -118,11 +123,9 @@ export default function SecretNameColumn(props: SecretNameColumnProps) {
         }
       }}
       onClick={event => {
-        if (
-          eventModule.isSingleClick(event) &&
-          (selected ||
-            shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.editName, event))
-        ) {
+        if (handleClick(event)) {
+          // Already handled.
+        } else if (eventModule.isSingleClick(event) && selected) {
           setRowState(object.merger({ isEditingName: true }))
         } else if (eventModule.isDoubleClick(event)) {
           event.stopPropagation()
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts b/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
index 59ee46de6909..0d107e79c2d5 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/column.ts
@@ -1,5 +1,5 @@
 /** @file Column types and column display modes. */
-import type * as assetsTable from '#/layouts/dashboard/AssetsTable'
+import type * as assetsTable from '#/layouts/AssetsTable'
 
 import * as columnUtils from '#/components/dashboard/column/columnUtils'
 import DocsColumn from '#/components/dashboard/column/DocsColumn'
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/column/LabelsColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/column/LabelsColumn.tsx
index 1722c6254432..e61e2aedf0bd 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/column/LabelsColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/column/LabelsColumn.tsx
@@ -9,8 +9,7 @@ import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import ManageLabelsModal from '#/layouts/dashboard/ManageLabelsModal'
+import Category from '#/layouts/CategorySwitcher/Category'
 
 import ContextMenu from '#/components/ContextMenu'
 import ContextMenus from '#/components/ContextMenus'
@@ -19,12 +18,13 @@ import Label from '#/components/dashboard/Label'
 import * as labelUtils from '#/components/dashboard/Label/labelUtils'
 import MenuEntry from '#/components/MenuEntry'
 
+import ManageLabelsModal from '#/modals/ManageLabelsModal'
+
 import type * as backendModule from '#/services/Backend'
 
 import * as assetQuery from '#/utilities/AssetQuery'
 import * as object from '#/utilities/object'
 import * as permissions from '#/utilities/permissions'
-import * as shortcutManager from '#/utilities/ShortcutManager'
 import * as uniqueString from '#/utilities/uniqueString'
 
 // ====================
@@ -100,7 +100,7 @@ export default function LabelsColumn(props: column.AssetColumnProps) {
               setModal(
                 <ContextMenus key={`label-${label}`} event={event}>
                   <ContextMenu>
-                    <MenuEntry action={shortcutManager.KeyboardAction.delete} doAction={doDelete} />
+                    <MenuEntry action="delete" doAction={doDelete} />
                   </ContextMenu>
                 </ContextMenus>
               )
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/column/SharedWithColumn.tsx b/app/ide-desktop/lib/dashboard/src/components/dashboard/column/SharedWithColumn.tsx
index 2849324aaba2..e752d9fabb43 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/column/SharedWithColumn.tsx
+++ b/app/ide-desktop/lib/dashboard/src/components/dashboard/column/SharedWithColumn.tsx
@@ -8,12 +8,13 @@ import * as modalProvider from '#/providers/ModalProvider'
 
 import AssetEventType from '#/events/AssetEventType'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import ManagePermissionsModal from '#/layouts/dashboard/ManagePermissionsModal'
+import Category from '#/layouts/CategorySwitcher/Category'
 
 import type * as column from '#/components/dashboard/column'
 import PermissionDisplay from '#/components/dashboard/PermissionDisplay'
 
+import ManagePermissionsModal from '#/modals/ManagePermissionsModal'
+
 import type * as backendModule from '#/services/Backend'
 
 import * as object from '#/utilities/object'
diff --git a/app/ide-desktop/lib/dashboard/src/configurations/inputBindings.ts b/app/ide-desktop/lib/dashboard/src/configurations/inputBindings.ts
new file mode 100644
index 000000000000..156874ac0535
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/configurations/inputBindings.ts
@@ -0,0 +1,104 @@
+/** @file Shortcuts for the dashboard application. */
+
+import AddConnectorIcon from 'enso-assets/add_connector.svg'
+import AddFolderIcon from 'enso-assets/add_folder.svg'
+import AddKeyIcon from 'enso-assets/add_key.svg'
+import AddNetworkIcon from 'enso-assets/add_network.svg'
+import AppDownloadIcon from 'enso-assets/app_download.svg'
+import CameraIcon from 'enso-assets/camera.svg'
+import CloseIcon from 'enso-assets/close.svg'
+import CloudToIcon from 'enso-assets/cloud_to.svg'
+import CopyIcon from 'enso-assets/copy.svg'
+import DataDownloadIcon from 'enso-assets/data_download.svg'
+import DataUploadIcon from 'enso-assets/data_upload.svg'
+import DuplicateIcon from 'enso-assets/duplicate.svg'
+import OpenIcon from 'enso-assets/open.svg'
+import PasteIcon from 'enso-assets/paste.svg'
+import PenIcon from 'enso-assets/pen.svg'
+import PeopleIcon from 'enso-assets/people.svg'
+import Play2Icon from 'enso-assets/play2.svg'
+import ScissorsIcon from 'enso-assets/scissors.svg'
+import SettingsIcon from 'enso-assets/settings.svg'
+import SignInIcon from 'enso-assets/sign_in.svg'
+import SignOutIcon from 'enso-assets/sign_out.svg'
+import TagIcon from 'enso-assets/tag.svg'
+import TrashIcon from 'enso-assets/trash.svg'
+import UntrashIcon from 'enso-assets/untrash.svg'
+import * as detect from 'enso-common/src/detect'
+
+import * as inputBindings from '#/utilities/inputBindings'
+
+export type * from '#/utilities/inputBindings'
+
+// ======================
+// === Input bindings ===
+// ======================
+
+/** The type of the keybind and mousebind namespace for the dashboard. */
+export interface DashboardBindingNamespace extends ReturnType<typeof createBindings> {}
+
+/** The nameof a dashboard binding */
+export type DashboardBindingKey = keyof typeof BINDINGS
+
+/** Create a keybind and mousebind namespace. */
+export function createBindings() {
+  return inputBindings.defineBindingNamespace('dashboard', BINDINGS)
+}
+
+export const BINDINGS = inputBindings.defineBindings({
+  settings: { name: 'Settings', bindings: ['Mod+,'], icon: SettingsIcon },
+  open: { name: 'Open', bindings: ['Enter'], icon: OpenIcon },
+  run: { name: 'Run', bindings: ['Shift+Enter'], icon: Play2Icon },
+  close: { name: 'Close', bindings: [], icon: CloseIcon },
+  uploadToCloud: { name: 'Upload To Cloud', bindings: [], icon: CloudToIcon },
+  rename: { name: 'Rename', bindings: ['Mod+R'], icon: PenIcon },
+  edit: { name: 'Edit', bindings: ['Mod+E'], icon: PenIcon },
+  snapshot: { name: 'Snapshot', bindings: ['Mod+S'], icon: CameraIcon },
+  delete: {
+    name: 'Delete',
+    bindings: ['OsDelete'],
+    icon: TrashIcon,
+    color: 'rgb(243 24 10 / 0.87)',
+  },
+  undelete: { name: 'Undelete', bindings: ['Mod+R'], icon: UntrashIcon },
+  share: { name: 'Share', bindings: ['Mod+Enter'], icon: PeopleIcon },
+  label: { name: 'Label', bindings: ['Mod+L'], icon: TagIcon },
+  duplicate: { name: 'Duplicate', bindings: ['Mod+D'], icon: DuplicateIcon },
+  copy: { name: 'Copy', bindings: ['Mod+C'], icon: CopyIcon },
+  cut: { name: 'Cut', bindings: ['Mod+X'], icon: ScissorsIcon },
+  paste: { name: 'Paste', bindings: ['Mod+V'], icon: PasteIcon },
+  download: { name: 'Download', bindings: ['Mod+Shift+S'], icon: DataDownloadIcon },
+  uploadFiles: { name: 'Upload Files', bindings: ['Mod+U'], icon: DataUploadIcon },
+  uploadProjects: { name: 'Upload Projects', bindings: ['Mod+U'], icon: DataUploadIcon },
+  newProject: { name: 'New Project', bindings: ['Mod+N'], icon: AddNetworkIcon },
+  newFolder: { name: 'New Folder', bindings: ['Mod+Shift+N'], icon: AddFolderIcon },
+  // FIXME [sb]: Platform detection should be handled directly in `shortcuts.ts`.
+  newSecret: {
+    name: 'New Secret',
+    bindings: !detect.isOnMacOS() ? ['Mod+Alt+N'] : ['Mod+Alt+N', 'Mod+Alt+~'],
+    icon: AddKeyIcon,
+  },
+  newDataLink: {
+    name: 'New Data Link',
+    bindings: !detect.isOnMacOS() ? ['Mod+Alt+Shift+N'] : ['Mod+Alt+Shift+N', 'Mod+Alt+Shift+~'],
+    icon: AddConnectorIcon,
+  },
+  signIn: { name: 'Login', bindings: [], icon: SignInIcon },
+  signOut: { name: 'Logout', bindings: [], icon: SignOutIcon, color: 'rgb(243 24 10 / 0.87)' },
+  // These should not appear in any menus.
+  closeModal: { name: 'Close Modal', bindings: ['Escape'], rebindable: false },
+  cancelEditName: { name: 'Cancel Editing', bindings: ['Escape'], rebindable: false },
+  downloadApp: { name: 'Download App', bindings: [], icon: AppDownloadIcon, rebindable: false },
+  cancelCut: { name: 'Cancel Cut', bindings: ['Escape'], rebindable: false },
+  // TODO: support handlers for double click; make single click handlers not work on double click events
+  // [MouseAction.open]: [mousebind(MouseAction.open, [], MouseButton.left, 2)],
+  // [MouseAction.run]: [mousebind(MouseAction.run, ['Shift'], MouseButton.left, 2)],
+  editName: { name: 'Edit Name', bindings: ['Mod+PointerMain'], rebindable: false },
+  selectAdditional: { name: 'Select Additional', bindings: ['Mod+PointerMain'], rebindable: false },
+  selectRange: { name: 'Select Range', bindings: ['Shift+PointerMain'], rebindable: false },
+  selectAdditionalRange: {
+    name: 'Select Additional Range',
+    bindings: ['Mod+Shift+PointerMain'],
+    rebindable: false,
+  },
+})
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetContextMenu.tsx
similarity index 87%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetContextMenu.tsx
index 37e434b69662..975e6c0b72b7 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetContextMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetContextMenu.tsx
@@ -13,26 +13,26 @@ import * as modalProvider from '#/providers/ModalProvider'
 import AssetEventType from '#/events/AssetEventType'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import GlobalContextMenu from '#/layouts/dashboard/GlobalContextMenu'
-import ManageLabelsModal from '#/layouts/dashboard/ManageLabelsModal'
-import ManagePermissionsModal from '#/layouts/dashboard/ManagePermissionsModal'
-import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
+import Category from '#/layouts/CategorySwitcher/Category'
+import GlobalContextMenu from '#/layouts/GlobalContextMenu'
 
 import ContextMenu from '#/components/ContextMenu'
 import ContextMenus from '#/components/ContextMenus'
 import ContextMenuSeparator from '#/components/ContextMenuSeparator'
 import type * as assetRow from '#/components/dashboard/AssetRow'
-import ConfirmDeleteModal from '#/components/dashboard/ConfirmDeleteModal'
 import MenuEntry from '#/components/MenuEntry'
 
+import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
+import ManageLabelsModal from '#/modals/ManageLabelsModal'
+import ManagePermissionsModal from '#/modals/ManagePermissionsModal'
+import UpsertSecretModal from '#/modals/UpsertSecretModal'
+
 import * as backendModule from '#/services/Backend'
 import RemoteBackend from '#/services/RemoteBackend'
 
 import HttpClient from '#/utilities/HttpClient'
 import * as object from '#/utilities/object'
 import * as permissions from '#/utilities/permissions'
-import * as shortcutManager from '#/utilities/ShortcutManager'
 
 // ========================
 // === AssetContextMenu ===
@@ -104,7 +104,8 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         <ContextMenu hidden={hidden}>
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.restoreFromTrash}
+            action="undelete"
+            label="Restore From Trash"
             doAction={() => {
               unsetModal()
               dispatchAssetEvent({
@@ -125,7 +126,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
           !isOtherUserUsingProject && (
             <MenuEntry
               hidden={hidden}
-              action={shortcutManager.KeyboardAction.open}
+              action="open"
               doAction={() => {
                 unsetModal()
                 dispatchAssetEvent({
@@ -140,7 +141,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {asset.type === backendModule.AssetType.project && isCloud && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.run}
+            action="run"
             doAction={() => {
               unsetModal()
               dispatchAssetEvent({
@@ -158,7 +159,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
           !isOtherUserUsingProject && (
             <MenuEntry
               hidden={hidden}
-              action={shortcutManager.KeyboardAction.close}
+              action="close"
               doAction={() => {
                 unsetModal()
                 dispatchAssetEvent({
@@ -171,7 +172,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {asset.type === backendModule.AssetType.project && !isCloud && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.uploadToCloud}
+            action="uploadToCloud"
             doAction={async () => {
               unsetModal()
               if (accessToken == null) {
@@ -211,7 +212,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
               asset.type !== backendModule.AssetType.project &&
               asset.type !== backendModule.AssetType.directory
             }
-            action={shortcutManager.KeyboardAction.rename}
+            action="rename"
             doAction={() => {
               setRowState(object.merger({ isEditingName: true }))
               unsetModal()
@@ -221,7 +222,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {asset.type === backendModule.AssetType.secret && canEditThisAsset && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.edit}
+            action="edit"
             doAction={() => {
               setModal(
                 <UpsertSecretModal
@@ -243,7 +244,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
           <MenuEntry
             hidden={hidden}
             disabled
-            action={shortcutManager.KeyboardAction.snapshot}
+            action="snapshot"
             doAction={() => {
               // No backend support yet.
             }}
@@ -252,11 +253,8 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {ownsThisAsset && !isRunningProject && !isOtherUserUsingProject && (
           <MenuEntry
             hidden={hidden}
-            action={
-              backend.type === backendModule.BackendType.local
-                ? shortcutManager.KeyboardAction.delete
-                : shortcutManager.KeyboardAction.moveToTrash
-            }
+            action="delete"
+            label={backend.type === backendModule.BackendType.local ? 'Delete' : 'Move To Trash'}
             doAction={() => {
               if (backend.type === backendModule.BackendType.remote) {
                 unsetModal()
@@ -264,7 +262,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
               } else {
                 setModal(
                   <ConfirmDeleteModal
-                    description={`the ${asset.type} '${asset.title}'`}
+                    actionText={`delete the ${asset.type} '${asset.title}'`}
                     doDelete={doDelete}
                   />
                 )
@@ -276,7 +274,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {isCloud && managesThisAsset && self != null && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.share}
+            action="share"
             doAction={() => {
               setModal(
                 <ManagePermissionsModal
@@ -298,7 +296,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {isCloud && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.label}
+            action="label"
             doAction={() => {
               setModal(
                 <ManageLabelsModal
@@ -316,7 +314,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         <MenuEntry
           hidden={hidden}
           disabled={!isCloud}
-          action={shortcutManager.KeyboardAction.duplicate}
+          action="duplicate"
           doAction={() => {
             unsetModal()
             dispatchAssetListEvent({
@@ -327,20 +325,14 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
             })
           }}
         />
-        {isCloud && (
-          <MenuEntry
-            hidden={hidden}
-            action={shortcutManager.KeyboardAction.copy}
-            doAction={doCopy}
-          />
-        )}
+        {isCloud && <MenuEntry hidden={hidden} action="copy" doAction={doCopy} />}
         {isCloud && !isOtherUserUsingProject && (
-          <MenuEntry hidden={hidden} action={shortcutManager.KeyboardAction.cut} doAction={doCut} />
+          <MenuEntry hidden={hidden} action="cut" doAction={doCut} />
         )}
         <MenuEntry
           hidden={hidden}
           disabled={isCloud && asset.type !== backendModule.AssetType.file}
-          action={shortcutManager.KeyboardAction.download}
+          action="download"
           doAction={() => {
             unsetModal()
             dispatchAssetEvent({
@@ -352,7 +344,7 @@ export default function AssetContextMenu(props: AssetContextMenuProps) {
         {hasPasteData && (
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.paste}
+            action="paste"
             doAction={() => {
               const [directoryKey, directoryId] =
                 item.item.type === backendModule.AssetType.directory
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetPanel.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetPanel.tsx
similarity index 94%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetPanel.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetPanel.tsx
index 2658908980fc..3eee2ad87021 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetPanel.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetPanel.tsx
@@ -5,11 +5,11 @@ import * as localStorageProvider from '#/providers/LocalStorageProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
 
-import AssetProperties from '#/layouts/dashboard/AssetProperties'
-import AssetVersions from '#/layouts/dashboard/AssetVersions'
-import type Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import type * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
-import UserBar from '#/layouts/dashboard/UserBar'
+import AssetProperties from '#/layouts/AssetProperties'
+import AssetVersions from '#/layouts/AssetVersions'
+import type Category from '#/layouts/CategorySwitcher/Category'
+import type * as pageSwitcher from '#/layouts/PageSwitcher'
+import UserBar from '#/layouts/UserBar'
 
 import AssetInfoBar from '#/components/dashboard/AssetInfoBar'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetProperties.tsx
similarity index 98%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetProperties.tsx
index 257487ca45b6..6109a8c49a96 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetProperties.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetProperties.tsx
@@ -12,8 +12,8 @@ import * as backendProvider from '#/providers/BackendProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
 
-import type Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import DataLinkInput from '#/layouts/dashboard/DataLinkInput'
+import type Category from '#/layouts/CategorySwitcher/Category'
+import DataLinkInput from '#/layouts/DataLinkInput'
 
 import Button from '#/components/Button'
 import SharedWithColumn from '#/components/dashboard/column/SharedWithColumn'
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetSearchBar.tsx
similarity index 97%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetSearchBar.tsx
index 976e4884c3e3..223168fc4c0c 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetSearchBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetSearchBar.tsx
@@ -2,6 +2,7 @@
 import * as React from 'react'
 
 import FindIcon from 'enso-assets/find.svg'
+import * as detect from 'enso-common/src/detect'
 
 import Label from '#/components/dashboard/Label'
 
@@ -9,7 +10,7 @@ import type * as backend from '#/services/Backend'
 
 import * as array from '#/utilities/array'
 import AssetQuery, * as assetQuery from '#/utilities/AssetQuery'
-import * as shortcutManager from '#/utilities/ShortcutManager'
+import * as eventModule from '#/utilities/event'
 
 // =============
 // === Types ===
@@ -169,15 +170,16 @@ export default function AssetSearchBar(props: AssetSearchBarProps) {
         !(event.target instanceof HTMLTextAreaElement) &&
         (!(event.target instanceof HTMLElement) || !event.target.isContentEditable) &&
         (!(event.target instanceof Node) || rootRef.current?.contains(event.target) !== true) &&
-        shortcutManager.isTextInputEvent(event) &&
-        event.key !== ' '
+        eventModule.isTextInputEvent(event) &&
+        event.key !== ' ' &&
+        (!detect.isOnMacOS() || event.key !== 'Delete')
       ) {
         searchRef.current?.focus()
       }
       if (
         event.target instanceof Node &&
         rootRef.current?.contains(event.target) === true &&
-        shortcutManager.isPotentiallyShortcut(event)
+        eventModule.isPotentiallyShortcut(event)
       ) {
         searchRef.current?.focus()
       }
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetVersion.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetVersion.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetVersion.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetVersion.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetVersions.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetVersions.tsx
similarity index 96%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetVersions.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetVersions.tsx
index 80851c1c967e..21d28d1fd09c 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetVersions.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetVersions.tsx
@@ -5,7 +5,7 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as backendProvider from '#/providers/BackendProvider'
 
-import AssetVersion from '#/layouts/dashboard/AssetVersion'
+import AssetVersion from '#/layouts/AssetVersion'
 
 import type * as backend from '#/services/Backend'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetsTable.tsx
similarity index 96%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetsTable.tsx
index 152a33e9bfe2..78e1a5b82e25 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTable.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetsTable.tsx
@@ -9,21 +9,19 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 
 import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 import * as localStorageProvider from '#/providers/LocalStorageProvider'
 import * as modalProvider from '#/providers/ModalProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
 import AssetEventType from '#/events/AssetEventType'
 import type * as assetListEvent from '#/events/assetListEvent'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import type * as assetPanel from '#/layouts/dashboard/AssetPanel'
-import type * as assetSearchBar from '#/layouts/dashboard/AssetSearchBar'
-import AssetsTableContextMenu from '#/layouts/dashboard/AssetsTableContextMenu'
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import DuplicateAssetsModal from '#/layouts/dashboard/DuplicateAssetsModal'
-import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
+import type * as assetPanel from '#/layouts/AssetPanel'
+import type * as assetSearchBar from '#/layouts/AssetSearchBar'
+import AssetsTableContextMenu from '#/layouts/AssetsTableContextMenu'
+import Category from '#/layouts/CategorySwitcher/Category'
 
 import Button from '#/components/Button'
 import type * as assetRow from '#/components/dashboard/AssetRow'
@@ -33,10 +31,13 @@ import * as columnUtils from '#/components/dashboard/column/columnUtils'
 import NameColumn from '#/components/dashboard/column/NameColumn'
 import * as columnHeading from '#/components/dashboard/columnHeading'
 import Label from '#/components/dashboard/Label'
-import DragModal from '#/components/DragModal'
 import SelectionBrush from '#/components/SelectionBrush'
 import Spinner, * as spinner from '#/components/Spinner'
 
+import DragModal from '#/modals/DragModal'
+import DuplicateAssetsModal from '#/modals/DuplicateAssetsModal'
+import UpsertSecretModal from '#/modals/UpsertSecretModal'
+
 import * as backendModule from '#/services/Backend'
 
 import * as array from '#/utilities/array'
@@ -47,12 +48,13 @@ import * as dateTime from '#/utilities/dateTime'
 import * as drag from '#/utilities/drag'
 import * as fileInfo from '#/utilities/fileInfo'
 import type * as geometry from '#/utilities/geometry'
+import * as inputBindingsModule from '#/utilities/inputBindings'
 import LocalStorage from '#/utilities/LocalStorage'
 import type * as pasteDataModule from '#/utilities/pasteData'
 import PasteType from '#/utilities/PasteType'
 import * as permissions from '#/utilities/permissions'
+import * as sanitizedEventTargets from '#/utilities/sanitizedEventTargets'
 import * as set from '#/utilities/set'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
 import SortDirection from '#/utilities/SortDirection'
 import * as string from '#/utilities/string'
 import * as uniqueString from '#/utilities/uniqueString'
@@ -378,7 +380,7 @@ export default function AssetsTable(props: AssetsTableProps) {
   const { backend } = backendProvider.useBackend()
   const { setModal, unsetModal } = modalProvider.useSetModal()
   const { localStorage } = localStorageProvider.useLocalStorage()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const [initialized, setInitialized] = React.useState(false)
   const [isLoading, setIsLoading] = React.useState(true)
@@ -817,8 +819,8 @@ export default function AssetsTable(props: AssetsTableProps) {
   }, [pasteData])
 
   React.useEffect(() => {
-    return shortcutManager.registerKeyboardHandlers({
-      [shortcutManagerModule.KeyboardAction.cancelCut]: () => {
+    return inputBindings.attach(sanitizedEventTargets.document.body, 'keydown', {
+      cancelCut: () => {
         if (pasteDataRef.current == null) {
           return false
         } else {
@@ -828,7 +830,7 @@ export default function AssetsTable(props: AssetsTableProps) {
         }
       },
     })
-  }, [/* should never change */ shortcutManager, /* should never change */ dispatchAssetEvent])
+  }, [/* should never change */ inputBindings, /* should never change */ dispatchAssetEvent])
 
   React.useEffect(() => {
     if (isLoading) {
@@ -1942,32 +1944,29 @@ export default function AssetsTable(props: AssetsTableProps) {
     }
   }, [/* should never change */ scrollContainerRef])
 
-  React.useEffect(() => {
-    const onDocumentClick = (event: MouseEvent) => {
-      if (
-        !shortcutManager.matchesMouseAction(
-          shortcutManagerModule.MouseAction.selectAdditional,
-          event
-        ) &&
-        !shortcutManager.matchesMouseAction(
-          shortcutManagerModule.MouseAction.selectAdditionalRange,
-          event
-        ) &&
-        selectedKeysRef.current.size !== 0
-      ) {
-        setSelectedKeys(new Set())
-        setMostRecentlySelectedIndex(null)
-      }
-    }
-    document.addEventListener('click', onDocumentClick)
-    return () => {
-      document.removeEventListener('click', onDocumentClick)
-    }
-  }, [
-    shortcutManager,
-    /* should never change */ setSelectedKeys,
-    /* should never change */ setMostRecentlySelectedIndex,
-  ])
+  React.useEffect(
+    () =>
+      inputBindings.attach(
+        sanitizedEventTargets.document.body,
+        'click',
+        {
+          selectAdditional: () => {},
+          selectAdditionalRange: () => {},
+          [inputBindingsModule.DEFAULT_HANDLER]: () => {
+            if (selectedKeysRef.current.size !== 0) {
+              setSelectedKeys(new Set())
+              setMostRecentlySelectedIndex(null)
+            }
+          },
+        },
+        false
+      ),
+    [
+      setSelectedKeys,
+      /* should never change */ inputBindings,
+      /* should never change */ setMostRecentlySelectedIndex,
+    ]
+  )
 
   React.useEffect(() => {
     if (isLoading) {
@@ -1988,40 +1987,35 @@ export default function AssetsTable(props: AssetsTableProps) {
       getRange: () => backendModule.AssetId[]
     ) => {
       event.stopPropagation()
-      if (
-        shortcutManager.matchesMouseAction(shortcutManagerModule.MouseAction.selectRange, event)
-      ) {
-        return new Set(getRange())
-      } else if (
-        shortcutManager.matchesMouseAction(
-          shortcutManagerModule.MouseAction.selectAdditionalRange,
-          event
-        )
-      ) {
-        return new Set([...selectedKeysRef.current, ...getRange()])
-      } else if (
-        shortcutManager.matchesMouseAction(
-          shortcutManagerModule.MouseAction.selectAdditional,
-          event
-        )
-      ) {
-        const newSelectedKeys = new Set(selectedKeysRef.current)
-        let count = 0
-        for (const key of keys) {
-          if (selectedKeysRef.current.has(key)) {
-            count += 1
+      let result = new Set<backendModule.AssetId>()
+      inputBindings.handler({
+        selectRange: () => {
+          result = new Set(getRange())
+        },
+        selectAdditionalRange: () => {
+          result = new Set([...selectedKeysRef.current, ...getRange()])
+        },
+        selectAdditional: () => {
+          const newSelectedKeys = new Set(selectedKeysRef.current)
+          let count = 0
+          for (const key of keys) {
+            if (selectedKeysRef.current.has(key)) {
+              count += 1
+            }
           }
-        }
-        for (const key of keys) {
-          const add = count * 2 < keys.length
-          set.setPresence(newSelectedKeys, key, add)
-        }
-        return newSelectedKeys
-      } else {
-        return new Set(keys)
-      }
+          for (const key of keys) {
+            const add = count * 2 < keys.length
+            set.setPresence(newSelectedKeys, key, add)
+          }
+          result = newSelectedKeys
+        },
+        [inputBindingsModule.DEFAULT_HANDLER]: () => {
+          result = new Set(keys)
+        },
+      })(event, false)
+      return result
     },
-    [shortcutManager]
+    [/* should never change */ inputBindings]
   )
 
   // Only non-`null` when it is different to`selectedKeys`.
@@ -2153,16 +2147,13 @@ export default function AssetsTable(props: AssetsTableProps) {
   const columns = columnUtils.getColumnList(backend.type, extraColumns)
 
   const headerRow = (
-    <tr ref={headerRowRef} className="sticky top-0">
+    <tr ref={headerRowRef} className="sticky top-0 text-sm font-semibold">
       {columns.map(column => {
         // This is a React component, even though it does not contain JSX.
         // eslint-disable-next-line no-restricted-syntax
         const Heading = columnHeading.COLUMN_HEADING[column]
         return (
-          <th
-            key={column}
-            className={`text-sm font-semibold ${columnUtils.COLUMN_CSS_CLASS[column]}`}
-          >
+          <th key={column} className={columnUtils.COLUMN_CSS_CLASS[column]}>
             <Heading state={state} />
           </th>
         )
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTableContextMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/AssetsTableContextMenu.tsx
similarity index 86%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTableContextMenu.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/AssetsTableContextMenu.tsx
index 5b5a26dd50e5..6350a983863f 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/AssetsTableContextMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/AssetsTableContextMenu.tsx
@@ -10,20 +10,20 @@ import type * as assetEvent from '#/events/assetEvent'
 import AssetEventType from '#/events/AssetEventType'
 import type * as assetListEvent from '#/events/assetListEvent'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import GlobalContextMenu from '#/layouts/dashboard/GlobalContextMenu'
+import Category from '#/layouts/CategorySwitcher/Category'
+import GlobalContextMenu from '#/layouts/GlobalContextMenu'
 
 import ContextMenu from '#/components/ContextMenu'
 import ContextMenus from '#/components/ContextMenus'
-import ConfirmDeleteModal from '#/components/dashboard/ConfirmDeleteModal'
 import MenuEntry from '#/components/MenuEntry'
 
+import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
+
 import * as backendModule from '#/services/Backend'
 
 import type AssetTreeNode from '#/utilities/AssetTreeNode'
 import type * as pasteDataModule from '#/utilities/pasteData'
 import * as permissions from '#/utilities/permissions'
-import * as shortcutManager from '#/utilities/ShortcutManager'
 import * as string from '#/utilities/string'
 import * as uniqueString from '#/utilities/uniqueString'
 
@@ -95,7 +95,7 @@ export default function AssetsTableContextMenu(props: AssetsTableContextMenuProp
     } else {
       setModal(
         <ConfirmDeleteModal
-          description={`${selectedKeys.size} selected ${pluralized}`}
+          actionText={`delete ${selectedKeys.size} selected ${pluralized}`}
           doDelete={() => {
             clearSelectedKeys()
             dispatchAssetEvent({ type: AssetEventType.delete, ids: selectedKeys })
@@ -121,7 +121,8 @@ export default function AssetsTableContextMenu(props: AssetsTableContextMenuProp
         <ContextMenu hidden={hidden}>
           <MenuEntry
             hidden={hidden}
-            action={shortcutManager.KeyboardAction.restoreAllFromTrash}
+            action="undelete"
+            label="Restore All From Trash"
             doAction={doRestoreAll}
           />
         </ContextMenu>
@@ -130,34 +131,29 @@ export default function AssetsTableContextMenu(props: AssetsTableContextMenuProp
   } else if (category !== Category.home) {
     return null
   } else {
-    const deleteAction = isCloud
-      ? shortcutManager.KeyboardAction.moveAllToTrash
-      : shortcutManager.KeyboardAction.deleteAll
     return (
       <ContextMenus key={uniqueString.uniqueString()} hidden={hidden} event={event}>
         {selectedKeys.size !== 0 && (
           <ContextMenu hidden={hidden}>
             {ownsAllSelectedAssets && (
-              <MenuEntry hidden={hidden} action={deleteAction} doAction={doDeleteAll} />
-            )}
-            {isCloud && (
               <MenuEntry
                 hidden={hidden}
-                action={shortcutManager.KeyboardAction.copyAll}
-                doAction={doCopy}
+                action="delete"
+                label={isCloud ? 'Move All To Trash' : 'Delete All'}
+                doAction={doDeleteAll}
               />
             )}
+            {isCloud && (
+              <MenuEntry hidden={hidden} action="copy" label="Copy All" doAction={doCopy} />
+            )}
             {isCloud && ownsAllSelectedAssets && (
-              <MenuEntry
-                hidden={hidden}
-                action={shortcutManager.KeyboardAction.cutAll}
-                doAction={doCut}
-              />
+              <MenuEntry hidden={hidden} action="cut" label="Cut All" doAction={doCut} />
             )}
             {pasteData != null && pasteData.data.size > 0 && (
               <MenuEntry
                 hidden={hidden}
-                action={shortcutManager.KeyboardAction.pasteAll}
+                action="paste"
+                label="Paste All"
                 doAction={() => {
                   const [firstKey] = selectedKeys
                   const selectedNode =
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/BackendSwitcher.tsx b/app/ide-desktop/lib/dashboard/src/layouts/BackendSwitcher.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/BackendSwitcher.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/BackendSwitcher.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/CategorySwitcher.tsx b/app/ide-desktop/lib/dashboard/src/layouts/CategorySwitcher.tsx
similarity index 98%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/CategorySwitcher.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/CategorySwitcher.tsx
index 48402d8fddfd..3c8ceb31012f 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/CategorySwitcher.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/CategorySwitcher.tsx
@@ -11,7 +11,7 @@ import * as modalProvider from '#/providers/ModalProvider'
 import type * as assetEvent from '#/events/assetEvent'
 import AssetEventType from '#/events/AssetEventType'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
+import Category from '#/layouts/CategorySwitcher/Category'
 
 import SvgMask from '#/components/SvgMask'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/CategorySwitcher/Category.ts b/app/ide-desktop/lib/dashboard/src/layouts/CategorySwitcher/Category.ts
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/CategorySwitcher/Category.ts
rename to app/ide-desktop/lib/dashboard/src/layouts/CategorySwitcher/Category.ts
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Chat.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Chat.tsx
similarity index 99%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Chat.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Chat.tsx
index 69831b49cfa8..49e978c01883 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Chat.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Chat.tsx
@@ -15,7 +15,7 @@ import * as gtagHooks from '#/hooks/gtagHooks'
 import * as authProvider from '#/providers/AuthProvider'
 import * as loggerProvider from '#/providers/LoggerProvider'
 
-import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
+import * as pageSwitcher from '#/layouts/PageSwitcher'
 
 import SvgMask from '#/components/SvgMask'
 import Twemoji from '#/components/Twemoji'
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChatPlaceholder.tsx b/app/ide-desktop/lib/dashboard/src/layouts/ChatPlaceholder.tsx
similarity index 95%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChatPlaceholder.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/ChatPlaceholder.tsx
index 5086b0b7c974..4758c47d09cc 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ChatPlaceholder.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/ChatPlaceholder.tsx
@@ -12,8 +12,8 @@ import * as navigateHooks from '#/hooks/navigateHooks'
 
 import * as loggerProvider from '#/providers/LoggerProvider'
 
-import * as chat from '#/layouts/dashboard/Chat'
-import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
+import * as chat from '#/layouts/Chat'
+import * as pageSwitcher from '#/layouts/PageSwitcher'
 
 /** Props for a {@link ChatPlaceholder}. */
 export interface ChatPlaceholderProps {
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DataLinkInput.tsx b/app/ide-desktop/lib/dashboard/src/layouts/DataLinkInput.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/DataLinkInput.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/DataLinkInput.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Drive.tsx
similarity index 97%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Drive.tsx
index 83a96cb2fd00..f961b7f8c5cf 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Drive.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Drive.tsx
@@ -17,13 +17,13 @@ import AssetEventType from '#/events/AssetEventType'
 import type * as assetListEvent from '#/events/assetListEvent'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import type * as assetPanel from '#/layouts/dashboard/AssetPanel'
-import type * as assetSearchBar from '#/layouts/dashboard/AssetSearchBar'
-import AssetsTable from '#/layouts/dashboard/AssetsTable'
-import CategorySwitcher from '#/layouts/dashboard/CategorySwitcher'
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import DriveBar from '#/layouts/dashboard/DriveBar'
-import Labels from '#/layouts/dashboard/Labels'
+import type * as assetPanel from '#/layouts/AssetPanel'
+import type * as assetSearchBar from '#/layouts/AssetSearchBar'
+import AssetsTable from '#/layouts/AssetsTable'
+import CategorySwitcher from '#/layouts/CategorySwitcher'
+import Category from '#/layouts/CategorySwitcher/Category'
+import DriveBar from '#/layouts/DriveBar'
+import Labels from '#/layouts/Labels'
 
 import type * as spinner from '#/components/Spinner'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/DriveBar.tsx
similarity index 89%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/DriveBar.tsx
index a46d43e01c3d..e070e311cedd 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DriveBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/DriveBar.tsx
@@ -9,21 +9,22 @@ import DataDownloadIcon from 'enso-assets/data_download.svg'
 import DataUploadIcon from 'enso-assets/data_upload.svg'
 
 import * as backendProvider from '#/providers/BackendProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 import * as modalProvider from '#/providers/ModalProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
 import AssetEventType from '#/events/AssetEventType'
 
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import UpsertDataLinkModal from '#/layouts/dashboard/UpsertDataLinkModal'
-import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
+import Category from '#/layouts/CategorySwitcher/Category'
 
 import Button from '#/components/Button'
 
+import UpsertDataLinkModal from '#/modals/UpsertDataLinkModal'
+import UpsertSecretModal from '#/modals/UpsertSecretModal'
+
 import * as backendModule from '#/services/Backend'
 
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import * as sanitizedEventTargets from '#/utilities/sanitizedEventTargets'
 
 // ================
 // === DriveBar ===
@@ -48,28 +49,28 @@ export default function DriveBar(props: DriveBarProps) {
   const { doCreateSecret, doCreateDataLink, doUploadFiles, dispatchAssetEvent } = props
   const { backend } = backendProvider.useBackend()
   const { setModal, unsetModal } = modalProvider.useSetModal()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const uploadFilesRef = React.useRef<HTMLInputElement>(null)
   const isCloud = backend.type === backendModule.BackendType.remote
   const isHomeCategory = category === Category.home || !isCloud
 
   React.useEffect(() => {
-    return shortcutManager.registerKeyboardHandlers({
+    return inputBindings.attach(sanitizedEventTargets.document.body, 'keydown', {
       ...(backend.type !== backendModule.BackendType.local
         ? {
-            [shortcutManagerModule.KeyboardAction.newFolder]: () => {
+            newFolder: () => {
               doCreateDirectory()
             },
           }
         : {}),
-      [shortcutManagerModule.KeyboardAction.newProject]: () => {
+      newProject: () => {
         doCreateProject()
       },
-      [shortcutManagerModule.KeyboardAction.uploadFiles]: () => {
+      uploadFiles: () => {
         uploadFilesRef.current?.click()
       },
     })
-  }, [backend.type, doCreateDirectory, doCreateProject, /* should never change */ shortcutManager])
+  }, [backend.type, doCreateDirectory, doCreateProject, /* should never change */ inputBindings])
 
   return (
     <div className="flex h-8 py-0.5">
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Editor.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Editor.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/GlobalContextMenu.tsx
similarity index 88%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/GlobalContextMenu.tsx
index a0c3bd0ff847..e0bde26604da 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/GlobalContextMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/GlobalContextMenu.tsx
@@ -8,15 +8,13 @@ import * as modalProvider from '#/providers/ModalProvider'
 import type * as assetListEventModule from '#/events/assetListEvent'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import UpsertDataLinkModal from '#/layouts/dashboard/UpsertDataLinkModal'
-import UpsertSecretModal from '#/layouts/dashboard/UpsertSecretModal'
-
 import ContextMenu from '#/components/ContextMenu'
 import MenuEntry from '#/components/MenuEntry'
 
-import * as backendModule from '#/services/Backend'
+import UpsertDataLinkModal from '#/modals/UpsertDataLinkModal'
+import UpsertSecretModal from '#/modals/UpsertSecretModal'
 
-import * as shortcutManager from '#/utilities/ShortcutManager'
+import * as backendModule from '#/services/Backend'
 
 /** Props for a {@link GlobalContextMenu}. */
 export interface GlobalContextMenuProps {
@@ -69,11 +67,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       )}
       <MenuEntry
         hidden={hidden}
-        action={
-          backend.type === backendModule.BackendType.local
-            ? shortcutManager.KeyboardAction.uploadProjects
-            : shortcutManager.KeyboardAction.uploadFiles
-        }
+        action={backend.type === backendModule.BackendType.local ? 'uploadProjects' : 'uploadFiles'}
         doAction={() => {
           if (filesInputRef.current?.isConnected === true) {
             filesInputRef.current.click()
@@ -101,7 +95,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       {isCloud && (
         <MenuEntry
           hidden={hidden}
-          action={shortcutManager.KeyboardAction.newProject}
+          action="newProject"
           doAction={() => {
             unsetModal()
             dispatchAssetListEvent({
@@ -118,7 +112,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       {isCloud && (
         <MenuEntry
           hidden={hidden}
-          action={shortcutManager.KeyboardAction.newFolder}
+          action="newFolder"
           doAction={() => {
             unsetModal()
             dispatchAssetListEvent({
@@ -132,7 +126,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       {isCloud && (
         <MenuEntry
           hidden={hidden}
-          action={shortcutManager.KeyboardAction.newSecret}
+          action="newSecret"
           doAction={() => {
             setModal(
               <UpsertSecretModal
@@ -155,7 +149,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       {isCloud && (
         <MenuEntry
           hidden={hidden}
-          action={shortcutManager.KeyboardAction.newDataLink}
+          action="newDataLink"
           doAction={() => {
             setModal(
               <UpsertDataLinkModal
@@ -176,7 +170,7 @@ export default function GlobalContextMenu(props: GlobalContextMenuProps) {
       {isCloud && directoryKey == null && hasCopyData && (
         <MenuEntry
           hidden={hidden}
-          action={shortcutManager.KeyboardAction.paste}
+          action="paste"
           doAction={() => {
             unsetModal()
             doPaste(rootDirectoryId, rootDirectoryId)
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Home.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Home.tsx
similarity index 92%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Home.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Home.tsx
index 807228503ae2..9c3f287cb49e 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Home.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Home.tsx
@@ -1,8 +1,8 @@
 /** @file Home screen. */
 import * as React from 'react'
 
-import Samples from '#/layouts/dashboard/Samples'
-import WhatsNew from '#/layouts/dashboard/WhatsNew'
+import Samples from '#/layouts/Samples'
+import WhatsNew from '#/layouts/WhatsNew'
 
 import type * as spinner from '#/components/Spinner'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Labels.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Labels.tsx
similarity index 95%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Labels.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Labels.tsx
index f435e156e29a..4305f65a5dd6 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Labels.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Labels.tsx
@@ -6,14 +6,14 @@ import Trash2Icon from 'enso-assets/trash2.svg'
 
 import * as modalProvider from '#/providers/ModalProvider'
 
-import NewLabelModal from '#/layouts/dashboard/NewLabelModal'
-
-import ConfirmDeleteModal from '#/components/dashboard/ConfirmDeleteModal'
 import Label from '#/components/dashboard/Label'
 import * as labelUtils from '#/components/dashboard/Label/labelUtils'
-import DragModal from '#/components/DragModal'
 import SvgMask from '#/components/SvgMask'
 
+import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
+import DragModal from '#/modals/DragModal'
+import NewLabelModal from '#/modals/NewLabelModal'
+
 import type * as backend from '#/services/Backend'
 
 import * as array from '#/utilities/array'
@@ -99,7 +99,7 @@ export default function Labels(props: LabelsProps) {
                       event.stopPropagation()
                       setModal(
                         <ConfirmDeleteModal
-                          description={`the label '${label.value}'`}
+                          actionText={`delete the label '${label.value}'`}
                           doDelete={() => {
                             doDeleteLabel(label.id, label.value)
                           }}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/PageSwitcher.tsx b/app/ide-desktop/lib/dashboard/src/layouts/PageSwitcher.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/PageSwitcher.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/PageSwitcher.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Samples.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Samples.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Samples.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Samples.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings.tsx
similarity index 78%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Settings.tsx
index 54f20458c2a3..c830bfe470d8 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Settings.tsx
@@ -4,11 +4,12 @@ import * as React from 'react'
 import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
 
-import AccountSettingsTab from '#/layouts/dashboard/Settings/AccountSettingsTab'
-import MembersSettingsTab from '#/layouts/dashboard/Settings/MembersSettingsTab'
-import OrganizationSettingsTab from '#/layouts/dashboard/Settings/OrganizationSettingsTab'
-import SettingsTab from '#/layouts/dashboard/Settings/SettingsTab'
-import SettingsSidebar from '#/layouts/dashboard/SettingsSidebar'
+import AccountSettingsTab from '#/layouts/Settings/AccountSettingsTab'
+import KeyboardShortcutsSettingsTab from '#/layouts/Settings/KeyboardShortcutsSettingsTab'
+import MembersSettingsTab from '#/layouts/Settings/MembersSettingsTab'
+import OrganizationSettingsTab from '#/layouts/Settings/OrganizationSettingsTab'
+import SettingsTab from '#/layouts/Settings/SettingsTab'
+import SettingsSidebar from '#/layouts/SettingsSidebar'
 
 import * as backendModule from '#/services/Backend'
 
@@ -61,6 +62,10 @@ export default function Settings() {
       content = <MembersSettingsTab />
       break
     }
+    case SettingsTab.keyboardShortcuts: {
+      content = <KeyboardShortcutsSettingsTab />
+      break
+    }
     default: {
       // This case should be removed when all settings tabs are implemented.
       content = <></>
@@ -69,7 +74,7 @@ export default function Settings() {
   }
 
   return (
-    <div className="flex flex-col gap-8">
+    <div className="flex flex-col flex-1 gap-8 overflow-hidden">
       <div className="flex gap-2.5 font-bold text-xl h-9.5 px-4.75">
         <span className="py-0.5">Settings for </span>
         <div className="rounded-full leading-144.5 bg-frame h-9 px-2.25 pt-0.5 pb-1.25">
@@ -78,7 +83,7 @@ export default function Settings() {
             : organization.organization_name ?? 'your organization'}
         </div>
       </div>
-      <div className="flex gap-8 pl-3">
+      <div className="flex flex-1 gap-8 pl-3 overflow-hidden">
         <SettingsSidebar settingsTab={settingsTab} setSettingsTab={setSettingsTab} />
         {content}
       </div>
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/AccountSettingsTab.tsx
similarity index 99%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Settings/AccountSettingsTab.tsx
index fcadb3b2cdd1..0e08291a1279 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/AccountSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Settings/AccountSettingsTab.tsx
@@ -13,12 +13,12 @@ import * as modalProvider from '#/providers/ModalProvider'
 
 import SvgMask from '#/components/SvgMask'
 
+import ConfirmDeleteUserModal from '#/modals/ConfirmDeleteUserModal'
+
 import * as object from '#/utilities/object'
 import * as uniqueString from '#/utilities/uniqueString'
 import * as validation from '#/utilities/validation'
 
-import ConfirmDeleteUserModal from '../ConfirmDeleteUserModal'
-
 // =============
 // === Input ===
 // =============
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/Settings/KeyboardShortcutsSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/KeyboardShortcutsSettingsTab.tsx
new file mode 100644
index 000000000000..16f2ac61f1df
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Settings/KeyboardShortcutsSettingsTab.tsx
@@ -0,0 +1,182 @@
+/** @file Settings tab for editing keyboard shortcuts. */
+import * as React from 'react'
+
+import BlankIcon from 'enso-assets/blank.svg'
+import CrossIcon from 'enso-assets/cross.svg'
+import Plus2Icon from 'enso-assets/plus2.svg'
+import ReloadInCircleIcon from 'enso-assets/reload_in_circle.svg'
+
+import type * as inputBindingsModule from '#/configurations/inputBindings'
+
+import * as refreshHooks from '#/hooks/refreshHooks'
+
+import * as inputBindingsManager from '#/providers/InputBindingsProvider'
+import * as modalProvider from '#/providers/ModalProvider'
+
+import KeyboardShortcut from '#/components/dashboard/KeyboardShortcut'
+import SvgMask from '#/components/SvgMask'
+
+import CaptureKeyboardShortcutModal from '#/modals/CaptureKeyboardShortcutModal'
+import ConfirmDeleteModal from '#/modals/ConfirmDeleteModal'
+
+import * as object from '#/utilities/object'
+
+// ====================================
+// === KeyboardShortcutsSettingsTab ===
+// ====================================
+
+/** Settings tab for viewing and editing account information. */
+export default function KeyboardShortcutsSettingsTab() {
+  const inputBindings = inputBindingsManager.useInputBindings()
+  const { setModal } = modalProvider.useSetModal()
+  const [refresh, doRefresh] = refreshHooks.useRefresh()
+  const scrollContainerRef = React.useRef<HTMLDivElement>(null)
+  const bodyRef = React.useRef<HTMLTableSectionElement>(null)
+  const allShortcuts = React.useMemo(() => {
+    // This is REQUIRED, in order to avoid disabling the `react-hooks/exhaustive-deps` lint.
+    // eslint-disable-next-line @typescript-eslint/no-unused-expressions
+    refresh
+    return new Set(Object.values(inputBindings.metadata).flatMap(value => value.bindings))
+  }, [inputBindings.metadata, refresh])
+
+  // This is required to prevent the table body from overlapping the table header, because
+  // the table header is transparent.
+  React.useEffect(() => {
+    const body = bodyRef.current
+    const scrollContainer = scrollContainerRef.current
+    if (body != null && scrollContainer != null) {
+      let isClipPathUpdateQueued = false
+      const updateClipPath = () => {
+        isClipPathUpdateQueued = false
+        body.style.clipPath = `inset(${scrollContainer.scrollTop}px 0 0 0)`
+      }
+      const onScroll = () => {
+        if (!isClipPathUpdateQueued) {
+          isClipPathUpdateQueued = true
+          requestAnimationFrame(updateClipPath)
+        }
+      }
+      updateClipPath()
+      scrollContainer.addEventListener('scroll', onScroll)
+      return () => {
+        scrollContainer.removeEventListener('scroll', onScroll)
+      }
+    } else {
+      return
+    }
+  }, [/* should never change */ scrollContainerRef])
+
+  return (
+    <div className="flex flex-col flex-1 gap-2.5 w-full pr-4">
+      <h3 className="font-bold text-xl h-9.5 py-0.5">Keyboard shortcuts</h3>
+      <div className="flex gap-2.5">
+        <button
+          className="flex items-center bg-frame rounded-full h-8 px-2.5"
+          onClick={event => {
+            event.stopPropagation()
+            setModal(
+              <ConfirmDeleteModal
+                actionText="reset all keyboard shortcuts"
+                actionButtonLabel="Reset All"
+                doDelete={() => {
+                  for (const k in inputBindings.metadata) {
+                    // eslint-disable-next-line no-restricted-syntax
+                    inputBindings.reset(k as inputBindingsModule.DashboardBindingKey)
+                  }
+                  doRefresh()
+                }}
+              />
+            )
+          }}
+        >
+          <span className="font-semibold whitespace-nowrap leading-5 h-6 py-px">Reset All</span>
+        </button>
+      </div>
+      {/* There is a horizontal scrollbar for some reason without `px-px`. */}
+      <div ref={scrollContainerRef} className="overflow-auto px-px">
+        <table className="rounded-rows table-fixed border-collapse">
+          <thead className="sticky top-0">
+            <tr className="text-left text-sm font-semibold h-8">
+              <th className="min-w-4 pl-2 pr-1.5">{/* Icon */}</th>
+              <th className="min-w-36 px-2">Name</th>
+              <th className="px-2">Shortcuts</th>
+              <th className="px-2 w-full">Description</th>
+            </tr>
+          </thead>
+          <tbody ref={bodyRef}>
+            {object
+              .unsafeEntries(inputBindings.metadata)
+              .filter(kv => kv[1].rebindable !== false)
+              .map(kv => {
+                const [action, info] = kv
+                return (
+                  <tr key={action}>
+                    <td className="flex h-8 items-center rounded-l-full pl-2 pr-1.5 bg-clip-padding">
+                      <SvgMask
+                        src={info.icon ?? BlankIcon}
+                        color={info.color}
+                        className="w-4 h-4"
+                      />
+                    </td>
+                    <td className="px-2 bg-clip-padding border-transparent border-l-2 border-r-2">
+                      {info.name}
+                    </td>
+                    <td className="group min-w-max pl-2 bg-clip-padding border-transparent border-l-2 border-r-2">
+                      <div className="flex gap-2 pr-4">
+                        {info.bindings.map((binding, i) => (
+                          <div key={i} className="inline-flex items-center gap-1 shrink-0">
+                            <KeyboardShortcut shortcut={binding} />
+                            <button
+                              className="invisible group-hover:visible"
+                              onClick={() => {
+                                inputBindings.delete(action, binding)
+                                doRefresh()
+                              }}
+                            >
+                              <img src={CrossIcon} />
+                            </button>
+                          </div>
+                        ))}
+                        <div className="flex gap-1 shrink-0">
+                          <button
+                            className="align-middle invisible group-hover:visible"
+                            onClick={event => {
+                              event.stopPropagation()
+                              setModal(
+                                <CaptureKeyboardShortcutModal
+                                  description={`'${info.name}'`}
+                                  existingShortcuts={allShortcuts}
+                                  onSubmit={shortcut => {
+                                    inputBindings.add(action, shortcut)
+                                    doRefresh()
+                                  }}
+                                />
+                              )
+                            }}
+                          >
+                            <img className="w-4.5 h-4.5" src={Plus2Icon} />
+                          </button>
+                          <button
+                            className="align-middle invisible group-hover:visible"
+                            onClick={() => {
+                              inputBindings.reset(action)
+                              doRefresh()
+                            }}
+                          >
+                            <img className="w-4.5 h-4.5" src={ReloadInCircleIcon} />
+                          </button>
+                        </div>
+                      </div>
+                    </td>
+                    <td className="rounded-r-full px-2 bg-clip-padding border-transparent border-l-2 border-r-2">
+                      {info.description}
+                    </td>
+                  </tr>
+                )
+              })}
+          </tbody>
+        </table>
+      </div>
+    </div>
+  )
+}
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/MembersSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/MembersSettingsTab.tsx
similarity index 97%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/MembersSettingsTab.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Settings/MembersSettingsTab.tsx
index b774fef354ce..719539d3115e 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/MembersSettingsTab.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Settings/MembersSettingsTab.tsx
@@ -6,10 +6,10 @@ import * as asyncEffectHooks from '#/hooks/asyncEffectHooks'
 import * as backendProvider from '#/providers/BackendProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
-import InviteUsersModal from '#/layouts/dashboard/InviteUsersModal'
-
 import StatelessSpinner, * as statelessSpinner from '#/components/StatelessSpinner'
 
+import InviteUsersModal from '#/modals/InviteUsersModal'
+
 // ==========================
 // === MembersSettingsTab ===
 // ==========================
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Settings/OrganizationSettingsTab.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/OrganizationSettingsTab.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/Settings/OrganizationSettingsTab.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/SettingsTab.ts b/app/ide-desktop/lib/dashboard/src/layouts/Settings/SettingsTab.ts
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/Settings/SettingsTab.ts
rename to app/ide-desktop/lib/dashboard/src/layouts/Settings/SettingsTab.ts
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/SettingsSidebar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/SettingsSidebar.tsx
similarity index 91%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/SettingsSidebar.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/SettingsSidebar.tsx
index 920176b79873..1de61455ade8 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/SettingsSidebar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/SettingsSidebar.tsx
@@ -2,12 +2,13 @@
 import * as React from 'react'
 
 import BellIcon from 'enso-assets/bell.svg'
+import KeyboardShortcutsIcon from 'enso-assets/keyboard_shortcuts.svg'
 import PeopleSettingsIcon from 'enso-assets/people_settings.svg'
 import PeopleIcon from 'enso-assets/people.svg'
 import SettingsIcon from 'enso-assets/settings.svg'
 import SlidersIcon from 'enso-assets/sliders.svg'
 
-import SettingsTab from '#/layouts/dashboard/Settings/SettingsTab'
+import SettingsTab from '#/layouts/Settings/SettingsTab'
 
 import SvgMask from '#/components/SvgMask'
 
@@ -54,6 +55,17 @@ const SECTIONS: SettingsSectionData[] = [
       },
     ],
   },
+  {
+    name: 'Look and feel',
+    tabs: [
+      {
+        name: 'Keyboard shortcuts',
+        settingsTab: SettingsTab.keyboardShortcuts,
+        icon: KeyboardShortcutsIcon,
+        visible: true,
+      },
+    ],
+  },
 ]
 
 // =============
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/TopBar.tsx
similarity index 91%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/TopBar.tsx
index 6e1692aeb63a..5fbd90618f7a 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/TopBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/TopBar.tsx
@@ -1,11 +1,11 @@
 /** @file The top-bar of dashboard. */
 import * as React from 'react'
 
-import type * as assetSearchBar from '#/layouts/dashboard/AssetSearchBar'
-import AssetSearchBar from '#/layouts/dashboard/AssetSearchBar'
-import BackendSwitcher from '#/layouts/dashboard/BackendSwitcher'
-import PageSwitcher, * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
-import UserBar from '#/layouts/dashboard/UserBar'
+import type * as assetSearchBar from '#/layouts/AssetSearchBar'
+import AssetSearchBar from '#/layouts/AssetSearchBar'
+import BackendSwitcher from '#/layouts/BackendSwitcher'
+import PageSwitcher, * as pageSwitcher from '#/layouts/PageSwitcher'
+import UserBar from '#/layouts/UserBar'
 
 import AssetInfoBar from '#/components/dashboard/AssetInfoBar'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx b/app/ide-desktop/lib/dashboard/src/layouts/UserBar.tsx
similarity index 94%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/UserBar.tsx
index 8868728ba8a0..c1fed7b0ca54 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserBar.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/UserBar.tsx
@@ -8,13 +8,14 @@ import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
-import InviteUsersModal from '#/layouts/dashboard/InviteUsersModal'
-import ManagePermissionsModal from '#/layouts/dashboard/ManagePermissionsModal'
-import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
-import UserMenu from '#/layouts/dashboard/UserMenu'
+import * as pageSwitcher from '#/layouts/PageSwitcher'
+import UserMenu from '#/layouts/UserMenu'
 
 import Button from '#/components/Button'
 
+import InviteUsersModal from '#/modals/InviteUsersModal'
+import ManagePermissionsModal from '#/modals/ManagePermissionsModal'
+
 import * as backendModule from '#/services/Backend'
 
 // ===============
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx b/app/ide-desktop/lib/dashboard/src/layouts/UserMenu.tsx
similarity index 91%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/UserMenu.tsx
index 42b048dd8896..c2d98f1a763d 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UserMenu.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/UserMenu.tsx
@@ -11,14 +11,13 @@ import * as toastAndLogHooks from '#/hooks/toastAndLogHooks'
 import * as authProvider from '#/providers/AuthProvider'
 import * as modalProvider from '#/providers/ModalProvider'
 
-import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
+import * as pageSwitcher from '#/layouts/PageSwitcher'
 
 import MenuEntry from '#/components/MenuEntry'
 import Modal from '#/components/Modal'
 
 import * as download from '#/utilities/download'
 import * as github from '#/utilities/github'
-import * as shortcutManager from '#/utilities/ShortcutManager'
 
 // ================
 // === UserMenu ===
@@ -69,7 +68,7 @@ export default function UserMenu(props: UserMenuProps) {
             <div className="flex flex-col">
               {!supportsLocalBackend && (
                 <MenuEntry
-                  action={shortcutManager.KeyboardAction.downloadApp}
+                  action="downloadApp"
                   paddingClassName="p-1"
                   doAction={async () => {
                     unsetModal()
@@ -83,7 +82,7 @@ export default function UserMenu(props: UserMenuProps) {
                 />
               )}
               <MenuEntry
-                action={shortcutManager.KeyboardAction.settings}
+                action="settings"
                 paddingClassName="p-1"
                 doAction={() => {
                   unsetModal()
@@ -91,7 +90,7 @@ export default function UserMenu(props: UserMenuProps) {
                 }}
               />
               <MenuEntry
-                action={shortcutManager.KeyboardAction.signOut}
+                action="signOut"
                 paddingClassName="p-1"
                 doAction={() => {
                   onSignOut()
@@ -110,7 +109,7 @@ export default function UserMenu(props: UserMenuProps) {
             </div>
             <div className="flex flex-col">
               <MenuEntry
-                action={shortcutManager.KeyboardAction.signIn}
+                action="signIn"
                 paddingClassName="p-1"
                 doAction={() => {
                   navigate(appUtils.LOGIN_PATH)
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/WhatsNew.tsx b/app/ide-desktop/lib/dashboard/src/layouts/WhatsNew.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/WhatsNew.tsx
rename to app/ide-desktop/lib/dashboard/src/layouts/WhatsNew.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/modals/CaptureKeyboardShortcutModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/CaptureKeyboardShortcutModal.tsx
new file mode 100644
index 000000000000..555ffe1d615f
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/modals/CaptureKeyboardShortcutModal.tsx
@@ -0,0 +1,136 @@
+/** @file A modal for capturing an arbitrary keyboard shortcut. */
+import * as React from 'react'
+
+import * as detect from 'enso-common/src/detect'
+
+import * as modalProvider from '#/providers/ModalProvider'
+
+import KeyboardShortcut from '#/components/dashboard/KeyboardShortcut'
+import Modal from '#/components/Modal'
+
+import * as inputBindings from '#/utilities/inputBindings'
+
+// ==============================
+// === eventToPartialShortcut ===
+// ==============================
+
+const DISALLOWED_KEYS = new Set(['Control', 'Alt', 'Shift', 'Meta'])
+const DELETE_KEY = detect.isOnMacOS() ? 'Backspace' : 'Delete'
+
+/** Extracts a partial keyboard shortcut from a {@link KeyboardEvent}. */
+function eventToPartialShortcut(event: KeyboardEvent | React.KeyboardEvent) {
+  const modifiers = inputBindings
+    .modifiersForModifierFlags(inputBindings.modifierFlagsForEvent(event))
+    .join('+')
+  // `Tab` and `Shift+Tab` should be reserved for keyboard navigation
+  const key =
+    DISALLOWED_KEYS.has(event.key) ||
+    (!event.ctrlKey && !event.altKey && !event.metaKey && event.key === 'Tab')
+      ? null
+      : event.key === ' '
+      ? 'Space'
+      : event.key === DELETE_KEY
+      ? 'OsDelete'
+      : inputBindings.normalizedKeyboardSegmentLookup[event.key.toLowerCase()] ?? event.key
+  return { key, modifiers }
+}
+
+// ====================================
+// === CaptureKeyboardShortcutModal ===
+// ====================================
+
+/** Props for a {@link CaptureKeyboardShortcutModal}. */
+export interface CaptureKeyboardShortcutModalProps {
+  readonly description: string
+  readonly existingShortcuts: Set<string>
+  readonly onSubmit: (shortcut: string) => void
+}
+
+/** A modal for capturing an arbitrary keyboard shortcut. */
+export default function CaptureKeyboardShortcutModal(props: CaptureKeyboardShortcutModalProps) {
+  const { description, existingShortcuts, onSubmit } = props
+  const { unsetModal } = modalProvider.useSetModal()
+  const [key, setKey] = React.useState<string | null>(null)
+  const [modifiers, setModifiers] = React.useState<string>('')
+  const shortcut = key == null ? modifiers : modifiers === '' ? key : `${modifiers}+${key}`
+  const doesAlreadyExist = key != null && existingShortcuts.has(shortcut)
+  const canSubmit = key != null && !doesAlreadyExist
+
+  return (
+    <Modal centered className="bg-dim">
+      <form
+        data-testid="confirm-delete-modal"
+        ref={element => {
+          element?.focus()
+        }}
+        tabIndex={-1}
+        className="relative flex flex-col items-center gap-2 rounded-2xl w-96 px-4 p-2 pointer-events-auto before:absolute before:inset-0 before:rounded-2xl before:bg-frame-selected before:backdrop-blur-3xl before:w-full before:h-full"
+        onKeyDown={event => {
+          if (event.key === 'Escape' && key === 'Escape') {
+            // Ignore.
+          } else if (event.key === 'Enter' && key === 'Enter') {
+            event.currentTarget.requestSubmit()
+          } else {
+            event.stopPropagation()
+            const newShortcut = eventToPartialShortcut(event)
+            if (event.key === 'Tab' && newShortcut.key == null) {
+              // Ignore.
+            } else {
+              setKey(newShortcut.key)
+              setModifiers(newShortcut.modifiers)
+            }
+          }
+        }}
+        onKeyUp={event => {
+          if (key == null) {
+            // A modifier may have been released.
+            const newShortcut = eventToPartialShortcut(event)
+            setModifiers(newShortcut.modifiers)
+          }
+        }}
+        onClick={event => {
+          event.stopPropagation()
+        }}
+        onSubmit={event => {
+          event.preventDefault()
+          if (canSubmit) {
+            unsetModal()
+            onSubmit(shortcut)
+          }
+        }}
+      >
+        <div className="relative">Enter the new keyboard shortcut for {description}.</div>
+        <div
+          className={`relative flex scale-150 items-center justify-center ${
+            doesAlreadyExist ? 'text-red-600' : ''
+          }`}
+        >
+          {shortcut === '' ? (
+            <span className="leading-170 text-primary/30 h-6 py-px">No shortcut entered</span>
+          ) : (
+            <KeyboardShortcut shortcut={shortcut} />
+          )}
+        </div>
+        <span className="relative text-red-600">
+          {doesAlreadyExist ? 'This shortcut already exists.' : ''}
+        </span>
+        <div className="relative flex self-start gap-2">
+          <button
+            disabled={!canSubmit}
+            type="submit"
+            className="hover:cursor-pointer inline-block text-white bg-invite rounded-full px-4 py-1 disabled:opacity-50"
+          >
+            Confirm
+          </button>
+          <button
+            type="button"
+            className="hover:cursor-pointer inline-block bg-frame-selected rounded-full px-4 py-1"
+            onClick={unsetModal}
+          >
+            Cancel
+          </button>
+        </div>
+      </form>
+    </Modal>
+  )
+}
diff --git a/app/ide-desktop/lib/dashboard/src/components/dashboard/ConfirmDeleteModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/ConfirmDeleteModal.tsx
similarity index 84%
rename from app/ide-desktop/lib/dashboard/src/components/dashboard/ConfirmDeleteModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/ConfirmDeleteModal.tsx
index 51fb1086a2f6..8ae7dd002056 100644
--- a/app/ide-desktop/lib/dashboard/src/components/dashboard/ConfirmDeleteModal.tsx
+++ b/app/ide-desktop/lib/dashboard/src/modals/ConfirmDeleteModal.tsx
@@ -13,14 +13,16 @@ import Modal from '#/components/Modal'
 
 /** Props for a {@link ConfirmDeleteModal}. */
 export interface ConfirmDeleteModalProps {
-  /** Must fit in the sentence "Are you sure you want to delete <description>?". */
-  readonly description: string
+  /** Must fit in the sentence "Are you sure you want to <action>?". */
+  readonly actionText: string
+  /** The label shown on the colored confirmation button. "Delete" by default. */
+  readonly actionButtonLabel?: string
   readonly doDelete: () => void
 }
 
 /** A modal for confirming the deletion of an asset. */
 export default function ConfirmDeleteModal(props: ConfirmDeleteModalProps) {
-  const { description, doDelete } = props
+  const { actionText, actionButtonLabel = 'Delete', doDelete } = props
   const toastAndLog = toastAndLogHooks.useToastAndLog()
   const { unsetModal } = modalProvider.useSetModal()
 
@@ -57,13 +59,13 @@ export default function ConfirmDeleteModal(props: ConfirmDeleteModalProps) {
           onSubmit()
         }}
       >
-        <div className="relative">Are you sure you want to delete {description}?</div>
+        <div className="relative">Are you sure you want to {actionText}?</div>
         <div className="relative flex gap-2">
           <button
             type="submit"
             className="hover:cursor-pointer inline-block text-white bg-delete rounded-full px-4 py-1"
           >
-            Delete
+            {actionButtonLabel}
           </button>
           <button
             type="button"
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ConfirmDeleteUserModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/ConfirmDeleteUserModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/ConfirmDeleteUserModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/ConfirmDeleteUserModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/components/DragModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/DragModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/components/DragModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/DragModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/DuplicateAssetsModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/DuplicateAssetsModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/DuplicateAssetsModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/DuplicateAssetsModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/InviteUsersModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/InviteUsersModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/InviteUsersModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/InviteUsersModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ManageLabelsModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/ManageLabelsModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/ManageLabelsModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/ManageLabelsModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/ManagePermissionsModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/ManagePermissionsModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/ManagePermissionsModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/ManagePermissionsModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/NewLabelModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/NewLabelModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/NewLabelModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/NewLabelModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertDataLinkModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/UpsertDataLinkModal.tsx
similarity index 98%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertDataLinkModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/UpsertDataLinkModal.tsx
index d39ee7220e7b..ac8c1edc77a1 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertDataLinkModal.tsx
+++ b/app/ide-desktop/lib/dashboard/src/modals/UpsertDataLinkModal.tsx
@@ -5,7 +5,7 @@ import SCHEMA from '#/data/dataLinkSchema.json' assert { type: 'json' }
 
 import * as modalProvider from '#/providers/ModalProvider'
 
-import DataLinkInput from '#/layouts/dashboard/DataLinkInput'
+import DataLinkInput from '#/layouts/DataLinkInput'
 
 import Modal from '#/components/Modal'
 
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx b/app/ide-desktop/lib/dashboard/src/modals/UpsertSecretModal.tsx
similarity index 100%
rename from app/ide-desktop/lib/dashboard/src/layouts/dashboard/UpsertSecretModal.tsx
rename to app/ide-desktop/lib/dashboard/src/modals/UpsertSecretModal.tsx
diff --git a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
index a5d6bb1a81ac..b3fd990894b5 100644
--- a/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
+++ b/app/ide-desktop/lib/dashboard/src/pages/dashboard/Dashboard.tsx
@@ -6,28 +6,28 @@ import * as eventHooks from '#/hooks/eventHooks'
 
 import * as authProvider from '#/providers/AuthProvider'
 import * as backendProvider from '#/providers/BackendProvider'
+import * as inputBindingsProvider from '#/providers/InputBindingsProvider'
 import * as localStorageProvider from '#/providers/LocalStorageProvider'
 import * as loggerProvider from '#/providers/LoggerProvider'
 import * as modalProvider from '#/providers/ModalProvider'
-import * as shortcutManagerProvider from '#/providers/ShortcutManagerProvider'
 
 import type * as assetEvent from '#/events/assetEvent'
 import AssetEventType from '#/events/AssetEventType'
 import type * as assetListEvent from '#/events/assetListEvent'
 import AssetListEventType from '#/events/AssetListEventType'
 
-import type * as assetPanel from '#/layouts/dashboard/AssetPanel'
-import AssetPanel from '#/layouts/dashboard/AssetPanel'
-import type * as assetSearchBar from '#/layouts/dashboard/AssetSearchBar'
-import Category from '#/layouts/dashboard/CategorySwitcher/Category'
-import Chat from '#/layouts/dashboard/Chat'
-import ChatPlaceholder from '#/layouts/dashboard/ChatPlaceholder'
-import Drive from '#/layouts/dashboard/Drive'
-import Editor from '#/layouts/dashboard/Editor'
-import Home from '#/layouts/dashboard/Home'
-import * as pageSwitcher from '#/layouts/dashboard/PageSwitcher'
-import Settings from '#/layouts/dashboard/Settings'
-import TopBar from '#/layouts/dashboard/TopBar'
+import type * as assetPanel from '#/layouts/AssetPanel'
+import AssetPanel from '#/layouts/AssetPanel'
+import type * as assetSearchBar from '#/layouts/AssetSearchBar'
+import Category from '#/layouts/CategorySwitcher/Category'
+import Chat from '#/layouts/Chat'
+import ChatPlaceholder from '#/layouts/ChatPlaceholder'
+import Drive from '#/layouts/Drive'
+import Editor from '#/layouts/Editor'
+import Home from '#/layouts/Home'
+import * as pageSwitcher from '#/layouts/PageSwitcher'
+import Settings from '#/layouts/Settings'
+import TopBar from '#/layouts/TopBar'
 
 import TheModal from '#/components/dashboard/TheModal'
 import type * as spinner from '#/components/Spinner'
@@ -41,7 +41,7 @@ import AssetQuery from '#/utilities/AssetQuery'
 import HttpClient from '#/utilities/HttpClient'
 import LocalStorage from '#/utilities/LocalStorage'
 import * as object from '#/utilities/object'
-import * as shortcutManagerModule from '#/utilities/ShortcutManager'
+import * as sanitizedEventTargets from '#/utilities/sanitizedEventTargets'
 
 // ============================
 // === Global configuration ===
@@ -119,7 +119,7 @@ export default function Dashboard(props: DashboardProps) {
   const { modalRef } = modalProvider.useModalRef()
   const { updateModal, unsetModal } = modalProvider.useSetModal()
   const { localStorage } = localStorageProvider.useLocalStorage()
-  const { shortcutManager } = shortcutManagerProvider.useShortcutManager()
+  const inputBindings = inputBindingsProvider.useInputBindings()
   const [initialized, setInitialized] = React.useState(false)
   const [isHelpChatOpen, setIsHelpChatOpen] = React.useState(false)
   const [page, setPage] = React.useState(() => localStorage.get('page') ?? pageSwitcher.Page.drive)
@@ -304,37 +304,39 @@ export default function Dashboard(props: DashboardProps) {
     }
   }, [/* should never change */ unsetModal])
 
-  React.useEffect(() => {
-    return shortcutManager.registerKeyboardHandlers({
-      [shortcutManagerModule.KeyboardAction.closeModal]: () => {
-        updateModal(oldModal => {
-          if (oldModal == null) {
-            queueMicrotask(() => {
-              setPage(oldPage => {
-                if (oldPage !== pageSwitcher.Page.settings) {
-                  return oldPage
-                } else {
-                  return localStorage.get('page') ?? pageSwitcher.Page.drive
-                }
+  React.useEffect(
+    () =>
+      inputBindings.attach(sanitizedEventTargets.document.body, 'keydown', {
+        closeModal: () => {
+          updateModal(oldModal => {
+            if (oldModal == null) {
+              queueMicrotask(() => {
+                setPage(oldPage => {
+                  if (oldPage !== pageSwitcher.Page.settings) {
+                    return oldPage
+                  } else {
+                    return localStorage.get('page') ?? pageSwitcher.Page.drive
+                  }
+                })
               })
-            })
-            return oldModal
-          } else {
-            return null
+              return oldModal
+            } else {
+              return null
+            }
+          })
+          if (modalRef.current == null) {
+            // eslint-disable-next-line no-restricted-syntax
+            return false
           }
-        })
-        if (modalRef.current == null) {
-          // eslint-disable-next-line no-restricted-syntax
-          return false
-        }
-      },
-    })
-  }, [
-    shortcutManager,
-    /* should never change */ modalRef,
-    /* should never change */ localStorage,
-    /* should never change */ updateModal,
-  ])
+        },
+      }),
+    [
+      inputBindings,
+      /* should never change */ modalRef,
+      /* should never change */ localStorage,
+      /* should never change */ updateModal,
+    ]
+  )
 
   const setBackendType = React.useCallback(
     (newBackendType: backendModule.BackendType) => {
diff --git a/app/ide-desktop/lib/dashboard/src/providers/InputBindingsProvider.tsx b/app/ide-desktop/lib/dashboard/src/providers/InputBindingsProvider.tsx
new file mode 100644
index 000000000000..686b1a5631cf
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/providers/InputBindingsProvider.tsx
@@ -0,0 +1,46 @@
+/** @file The React provider for keyboard and mouse shortcuts, along with hooks to use the provider
+ * via the shared React context. */
+import * as React from 'react'
+
+import * as inputBindingsModule from '#/configurations/inputBindings'
+
+// ============================
+// === InputBindingsContext ===
+// ============================
+
+/** State contained in a `ShortcutsContext`. */
+export interface InputBindingsContextType extends inputBindingsModule.DashboardBindingNamespace {}
+
+const InputBindingsContext = React.createContext<InputBindingsContextType>(
+  inputBindingsModule.createBindings()
+)
+
+/** Props for a {@link InputBindingsProvider}. */
+export interface InputBindingsProviderProps extends React.PropsWithChildren<object> {
+  readonly inputBindings?: inputBindingsModule.DashboardBindingNamespace
+}
+
+// =============================
+// === InputBindingsProvider ===
+// =============================
+
+/** A React Provider that lets components get the shortcut registry. */
+export default function InputBindingsProvider(props: InputBindingsProviderProps) {
+  const { inputBindings: inputBindingsRaw, children } = props
+  const [inputBindings, setInputBindings] = React.useState(
+    () => inputBindingsRaw ?? inputBindingsModule.createBindings()
+  )
+
+  React.useEffect(() => {
+    setInputBindings(inputBindingsRaw ?? inputBindingsModule.createBindings())
+  }, [inputBindingsRaw])
+
+  return (
+    <InputBindingsContext.Provider value={inputBindings}>{children}</InputBindingsContext.Provider>
+  )
+}
+
+/** Exposes a property to get the input bindings namespace. */
+export function useInputBindings() {
+  return React.useContext(InputBindingsContext)
+}
diff --git a/app/ide-desktop/lib/dashboard/src/providers/ShortcutManagerProvider.tsx b/app/ide-desktop/lib/dashboard/src/providers/ShortcutManagerProvider.tsx
deleted file mode 100644
index d84d8cfe8817..000000000000
--- a/app/ide-desktop/lib/dashboard/src/providers/ShortcutManagerProvider.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-/** @file The React provider for keyboard and mouse shortcutManager, along with hooks to use the provider
- * via the shared React context. */
-import * as React from 'react'
-
-import ShortcutManager from '#/utilities/ShortcutManager'
-
-// ==============================
-// === ShortcutManagerContext ===
-// ==============================
-
-/** State contained in a `ShortcutsContext`. */
-export interface ShortcutManagerContextType {
-  readonly shortcutManager: ShortcutManager
-}
-
-const ShortcutManagerContext = React.createContext<ShortcutManagerContextType>({
-  shortcutManager: ShortcutManager.createWithDefaults(),
-})
-
-/** Props for a {@link ShortcutsProvider}. */
-export interface ShortcutsProviderProps extends React.PropsWithChildren<object> {
-  readonly shortcutManager?: ShortcutManager
-}
-
-// ===============================
-// === ShortcutManagerProvider ===
-// ===============================
-
-/** A React Provider that lets components get the shortcut registry. */
-export default function ShortcutsProvider(props: ShortcutsProviderProps) {
-  const { shortcutManager: rawShortcutManager, children } = props
-  const [shortcutManager, setShortcutManager] = React.useState(
-    () => rawShortcutManager ?? ShortcutManager.createWithDefaults()
-  )
-
-  React.useEffect(() => {
-    if (rawShortcutManager != null) {
-      setShortcutManager(rawShortcutManager)
-    } else {
-      setShortcutManager(ShortcutManager.createWithDefaults())
-    }
-  }, [rawShortcutManager])
-
-  return (
-    <ShortcutManagerContext.Provider value={{ shortcutManager }}>
-      {children}
-    </ShortcutManagerContext.Provider>
-  )
-}
-
-/** Exposes a property to get the shortcut registry. */
-export function useShortcutManager() {
-  return React.useContext(ShortcutManagerContext)
-}
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts b/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
deleted file mode 100644
index 31edcfc71cd2..000000000000
--- a/app/ide-desktop/lib/dashboard/src/utilities/ShortcutManager.ts
+++ /dev/null
@@ -1,538 +0,0 @@
-/** @file A registry for keyboard and mouse shortcutManager. */
-import type * as React from 'react'
-
-import AddConnectorIcon from 'enso-assets/add_connector.svg'
-import AddFolderIcon from 'enso-assets/add_folder.svg'
-import AddKeyIcon from 'enso-assets/add_key.svg'
-import AddNetworkIcon from 'enso-assets/add_network.svg'
-import AppDownloadIcon from 'enso-assets/app_download.svg'
-import BlankIcon from 'enso-assets/blank_16.svg'
-import CameraIcon from 'enso-assets/camera.svg'
-import CloseIcon from 'enso-assets/close.svg'
-import CloudToIcon from 'enso-assets/cloud_to.svg'
-import CopyIcon from 'enso-assets/copy.svg'
-import DataDownloadIcon from 'enso-assets/data_download.svg'
-import DataUploadIcon from 'enso-assets/data_upload.svg'
-import DuplicateIcon from 'enso-assets/duplicate.svg'
-import OpenIcon from 'enso-assets/open.svg'
-import PasteIcon from 'enso-assets/paste.svg'
-import PenIcon from 'enso-assets/pen.svg'
-import PeopleIcon from 'enso-assets/people.svg'
-import Play2Icon from 'enso-assets/play2.svg'
-import ScissorsIcon from 'enso-assets/scissors.svg'
-import SettingsIcon from 'enso-assets/settings.svg'
-import SignInIcon from 'enso-assets/sign_in.svg'
-import SignOutIcon from 'enso-assets/sign_out.svg'
-import TagIcon from 'enso-assets/tag.svg'
-import TrashIcon from 'enso-assets/trash.svg'
-import UntrashIcon from 'enso-assets/untrash.svg'
-import * as detect from 'enso-common/src/detect'
-
-// =================
-// === Constants ===
-// =================
-
-/** The size (both width and height) of icons. */
-export const ICON_SIZE_PX = 16
-
-// =============
-// === Types ===
-// =============
-
-/** All possible mouse actions for which shortcutManager can be registered. */
-export enum MouseAction {
-  open = 'open',
-  /** Run without opening the editor. */
-  run = 'run',
-  editName = 'edit-name',
-  selectAdditional = 'select-additional',
-  selectRange = 'select-range',
-  selectAdditionalRange = 'select-additional-range',
-}
-
-/** All possible keyboard actions for which shortcutManager can be registered. */
-export enum KeyboardAction {
-  settings = 'settings',
-  open = 'open',
-  /** Run without opening the editor. */
-  run = 'run',
-  close = 'close',
-  uploadToCloud = 'upload-to-cloud',
-  rename = 'rename',
-  edit = 'edit',
-  snapshot = 'snapshot',
-  moveToTrash = 'move-to-trash',
-  moveAllToTrash = 'move-all-to-trash',
-  delete = 'delete',
-  deleteAll = 'delete-all',
-  restoreFromTrash = 'restore-from-trash',
-  restoreAllFromTrash = 'restore-all-from-trash',
-  share = 'share',
-  label = 'label',
-  duplicate = 'duplicate',
-  copy = 'copy',
-  copyAll = 'copy-all',
-  cut = 'cut',
-  cutAll = 'cut-all',
-  cancelCut = 'cancel-cut',
-  paste = 'paste',
-  pasteAll = 'paste-all',
-  download = 'download',
-  uploadFiles = 'upload-files',
-  uploadProjects = 'upload-projects',
-  newProject = 'new-project',
-  newFolder = 'new-folder',
-  newSecret = 'new-secret',
-  newDataLink = 'new-data-link',
-  closeModal = 'close-modal',
-  cancelEditName = 'cancel-edit-name',
-  signIn = 'sign-in',
-  signOut = 'sign-out',
-  downloadApp = 'download-app',
-}
-
-/** Valid mouse buttons. The values of each enum member is its corresponding value of
- * `MouseEvent.button`. */
-export enum MouseButton {
-  left = 0,
-  middle = 1,
-  right = 2,
-  back = 3,
-  forward = 4,
-}
-
-/** Restrictions on modifier keys that can trigger a shortcut.
- *
- * If a key is omitted, the shortcut will be triggered regardless of its value in the event. */
-interface Modifiers {
-  readonly ctrl?: boolean
-  readonly alt?: boolean
-  readonly shift?: boolean
-  readonly meta?: boolean
-}
-
-/** A keyboard shortcut. */
-export interface KeyboardShortcut extends Modifiers {
-  // Every printable character is a valid value for `key`, so unions and enums are both
-  // not an option here.
-  readonly key: string
-  readonly action: KeyboardAction
-}
-
-/** A mouse shortcut. If a key is omitted, that means its value does not matter. */
-export interface MouseShortcut extends Modifiers {
-  readonly button: MouseButton
-  readonly action: MouseAction
-  readonly clicks: number
-}
-
-/** All possible modifier keys. */
-export type ModifierKey = (typeof MODIFIERS)[number]
-
-/** A list of all possible modifier keys, in order. */
-export const MODIFIERS =
-  detect.platform() === detect.Platform.macOS
-    ? // These MUST be `as const` to derive the `ModifierKey` type above.
-      (['Meta', 'Shift', 'Alt', 'Ctrl'] as const)
-    : (['Ctrl', 'Shift', 'Alt', 'Meta'] as const)
-
-// ========================
-// === isTextInputEvent ===
-// ========================
-
-/** A {@link RegExp} that matches {@link KeyboardEvent.code}s corresponding to non-printable
- * keys. */
-const SPECIAL_CHARACTER_KEYCODE_REGEX = /^[A-Z][a-z]/
-
-/** Whether `event` may trigger a shortcut. */
-export function isPotentiallyShortcut(event: KeyboardEvent | React.KeyboardEvent) {
-  return event.ctrlKey || event.metaKey || event.altKey
-}
-
-/** Whether `event.key` is a key used in text editing. */
-export function isTextInputKey(event: KeyboardEvent | React.KeyboardEvent) {
-  // Allow `alt` key to be pressed in case it is being used to enter special characters.
-  return (
-    !SPECIAL_CHARACTER_KEYCODE_REGEX.test(event.key) ||
-    event.key === 'Backspace' ||
-    event.key === 'Delete'
-  )
-}
-
-/** Whether `event` will produce text. This excludes shortcutManager, as they do not produce text. */
-export function isTextInputEvent(event: KeyboardEvent | React.KeyboardEvent) {
-  // Allow `alt` key to be pressed in case it is being used to enter special characters.
-  return !event.ctrlKey && !event.shiftKey && !event.metaKey && isTextInputKey(event)
-}
-
-// =============================
-// === makeKeyboardActionMap ===
-// =============================
-
-/** Create a mapping from {@link KeyboardAction} to `T`. */
-function makeKeyboardActionMap<T>(
-  make: (action: KeyboardAction) => T
-): Readonly<Record<KeyboardAction, T>> {
-  // This is SAFE, as the types of the keys are statically known.
-  // eslint-disable-next-line no-restricted-syntax
-  return Object.fromEntries(
-    Object.entries(KeyboardAction).map(kv => [kv[1], make(kv[1])])
-  ) as Record<KeyboardAction, T>
-}
-
-// ====================
-// === ShortcutInfo ===
-// ====================
-
-/** Data needed to render a keyboard shortcut in a context menu. */
-export interface ShortcutInfo {
-  readonly name: string
-  /** A URL to the image representing this shortcut. */
-  readonly icon: string
-  /** A Tailwind class for the desired color of the icon. It should be in the form `text-<color>`,
-   * where `<color>` is replaced with the actual color. */
-  readonly colorClass?: string
-}
-
-// ===============================
-// === getModifierKeyssOfEvent ===
-// ===============================
-
-/** Extracts the list of active {@link ModifierKey}s in an event.
- * This is useful for displaying the modifier keys in the UI. */
-export function getModifierKeysOfShortcut(event: KeyboardShortcut | MouseShortcut): ModifierKey[] {
-  return detect.isOnMacOS()
-    ? [
-        // The order SHOULD be Control, Option, Shift, Command. See:
-        // https://developer.apple.com/design/human-interface-guidelines/keyboards#Custom-keyboard-shortcutManager
-        ...(event.meta === true ? (['Meta'] satisfies ModifierKey[]) : []),
-        ...(event.shift === true ? (['Shift'] satisfies ModifierKey[]) : []),
-        ...(event.alt === true ? (['Alt'] satisfies ModifierKey[]) : []),
-        ...(event.ctrl === true ? (['Ctrl'] satisfies ModifierKey[]) : []),
-      ]
-    : [
-        ...(event.ctrl === true ? (['Ctrl'] satisfies ModifierKey[]) : []),
-        ...(event.shift === true ? (['Shift'] satisfies ModifierKey[]) : []),
-        ...(event.alt === true ? (['Alt'] satisfies ModifierKey[]) : []),
-        ...(event.meta === true ? (['Meta'] satisfies ModifierKey[]) : []),
-      ]
-}
-
-// ===========================
-// === modifiersMatchEvent ===
-// ===========================
-
-/** Whether the modifiers match the event's modifier key states. */
-function modifiersMatchEvent(
-  modifiers: Modifiers,
-  event: KeyboardEvent | MouseEvent | React.KeyboardEvent | React.MouseEvent
-) {
-  return (
-    ('ctrl' in modifiers ? event.ctrlKey === modifiers.ctrl : true) &&
-    ('alt' in modifiers ? event.altKey === modifiers.alt : true) &&
-    ('shift' in modifiers ? event.shiftKey === modifiers.shift : true) &&
-    ('meta' in modifiers ? event.metaKey === modifiers.meta : true)
-  )
-}
-
-// =======================
-// === ShortcutManager ===
-// =======================
-
-/** Holds all keyboard and mouse shortcutManager, and provides functions to detect them. */
-export default class ShortcutManager {
-  keyboardShortcutsByKey: Record<string, KeyboardShortcut[]> = {}
-  allKeyboardHandlers: Readonly<
-    Record<
-      KeyboardAction,
-      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
-      ((event: KeyboardEvent | React.KeyboardEvent) => boolean | void)[]
-    >
-  > = makeKeyboardActionMap(() => [])
-  /** The last handler (if any) for each action in
-   * {@link ShortcutManager.allKeyboardHandlers}. */
-  readonly activeKeyboardHandlers: Record<
-    KeyboardAction,
-    // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
-    ((event: KeyboardEvent | React.KeyboardEvent) => boolean | void) | null
-  > = makeKeyboardActionMap(() => null)
-
-  /** Create a {@link ShortcutManager}. */
-  constructor(
-    public readonly keyboardShortcuts: Readonly<Record<KeyboardAction, KeyboardShortcut[]>>,
-    public readonly mouseShortcuts: Readonly<Record<MouseAction, MouseShortcut[]>>,
-    public readonly keyboardShortcutInfo: Readonly<Record<KeyboardAction, ShortcutInfo>>
-  ) {
-    this.updateKeyboardShortcutsByKey()
-  }
-
-  /** Create a new {@link ShortcutManager} with default values. */
-  static createWithDefaults() {
-    return new this(
-      { ...DEFAULT_KEYBOARD_SHORTCUTS },
-      { ...DEFAULT_MOUSE_SHORTCUTS },
-      { ...DEFAULT_KEYBOARD_SHORTCUT_INFO }
-    )
-  }
-
-  /** Return `true` if the shortcut is being triggered by the keyboard event. */
-  matchesKeyboardShortcut(
-    this: void,
-    shortcut: KeyboardShortcut,
-    event: KeyboardEvent | React.KeyboardEvent
-  ) {
-    return (
-      shortcut.key.toUpperCase() === event.key.toUpperCase() && modifiersMatchEvent(shortcut, event)
-    )
-  }
-
-  /** Return `true` if the shortcut is being triggered by the mouse event. */
-  matchesMouseShortcut(this: void, shortcut: MouseShortcut, event: MouseEvent | React.MouseEvent) {
-    const button: number = shortcut.button
-    return (
-      button === event.button &&
-      Math.max(event.detail, 1) >= shortcut.clicks &&
-      modifiersMatchEvent(shortcut, event)
-    )
-  }
-
-  /** Return `true` if the action is being triggered by the keyboard event. */
-  matchesKeyboardAction(action: KeyboardAction, event: KeyboardEvent | React.KeyboardEvent) {
-    return this.keyboardShortcuts[action].some(shortcut =>
-      this.matchesKeyboardShortcut(shortcut, event)
-    )
-  }
-
-  /** Return `true` if the action is being triggered by the mouse event. */
-  matchesMouseAction(action: MouseAction, event: MouseEvent | React.MouseEvent) {
-    return this.mouseShortcuts[action].some(shortcut => this.matchesMouseShortcut(shortcut, event))
-  }
-
-  /** Trigger the appropriate handler for the action matching the currently pressed shortcut
-   * (if any). Return `true` if a matching action was found, otherwise return `false`. */
-  handleKeyboardEvent(event: KeyboardEvent | React.KeyboardEvent) {
-    // `event` is missing `.key` on a `keydown` event that fires after signing out.
-    // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
-    if (event.key != null) {
-      for (const shortcut of this.keyboardShortcutsByKey[event.key.toUpperCase()] ?? []) {
-        if (this.matchesKeyboardShortcut(shortcut, event)) {
-          const handler = this.activeKeyboardHandlers[shortcut.action]
-          if (handler != null) {
-            const result = handler(event)
-            if (result !== false) {
-              // The matching `false` return is immediately after this loop.
-              // eslint-disable-next-line no-restricted-syntax
-              return true
-            }
-          }
-        }
-      }
-    }
-    return false
-  }
-
-  /** Regenerate {@link ShortcutManager.keyboardShortcutsByKey}. */
-  updateKeyboardShortcutsByKey() {
-    this.keyboardShortcutsByKey = {}
-    for (const shortcutManager of Object.values(this.keyboardShortcuts)) {
-      for (const shortcut of shortcutManager) {
-        const byKey = this.keyboardShortcutsByKey[shortcut.key.toUpperCase()]
-        if (byKey != null) {
-          byKey.unshift(shortcut)
-        } else {
-          this.keyboardShortcutsByKey[shortcut.key.toUpperCase()] = [shortcut]
-        }
-      }
-    }
-  }
-
-  /** Regenerate {@link ShortcutManager.activeKeyboardHandlers}. */
-  updateActiveKeyboardHandlers() {
-    for (const action of Object.values(KeyboardAction)) {
-      const handlers = this.allKeyboardHandlers[action]
-      this.activeKeyboardHandlers[action] = handlers[handlers.length - 1] ?? null
-    }
-  }
-
-  /** Update the currently active handler for each action, and return a function to unregister
-   * these handlers. */
-  registerKeyboardHandlers(
-    handlers: Partial<
-      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
-      Record<KeyboardAction, (event: KeyboardEvent | React.KeyboardEvent) => boolean | void>
-    >
-  ) {
-    for (const action of Object.values(KeyboardAction)) {
-      const handler = handlers[action]
-      if (handler != null) {
-        this.allKeyboardHandlers[action].push(handler)
-        this.activeKeyboardHandlers[action] = handler
-      }
-    }
-    const allNewHandlers = new Set(Object.values(handlers))
-    return () => {
-      for (const handlersForCurrentAction of Object.values(this.allKeyboardHandlers)) {
-        // Remove in-place the handlers that were added.
-        handlersForCurrentAction.splice(
-          0,
-          handlersForCurrentAction.length,
-          ...handlersForCurrentAction.filter(handler => !allNewHandlers.has(handler))
-        )
-      }
-      this.updateActiveKeyboardHandlers()
-    }
-  }
-}
-
-/** A shorthand for creating a {@link KeyboardShortcut}. Should only be used in
- * {@link DEFAULT_KEYBOARD_SHORTCUTS}. */
-function keybind(action: KeyboardAction, modifiers: ModifierKey[], key: string): KeyboardShortcut {
-  return {
-    key,
-    action,
-    ctrl: modifiers.includes('Ctrl'),
-    alt: modifiers.includes('Alt'),
-    shift: modifiers.includes('Shift'),
-    meta: modifiers.includes('Meta'),
-  }
-}
-
-/** A shorthand for creating a {@link MouseShortcut}. Should only be used in
- * {@link DEFAULT_MOUSE_SHORTCUTS}. */
-function mousebind(
-  action: MouseAction,
-  modifiers: ModifierKey[],
-  button: MouseButton,
-  clicks: number
-): MouseShortcut {
-  return {
-    button,
-    action,
-    clicks,
-    ctrl: modifiers.includes('Ctrl'),
-    alt: modifiers.includes('Alt'),
-    shift: modifiers.includes('Shift'),
-    meta: modifiers.includes('Meta'),
-  }
-}
-
-// =================
-// === Constants ===
-// =================
-
-/** The equivalent of the `Control` key for the current platform. */
-const CTRL = (detect.isOnMacOS() ? 'Meta' : 'Ctrl') satisfies ModifierKey
-
-/** The key known as the `Delete` key for the current platform. */
-const DELETE = detect.isOnMacOS() ? 'Backspace' : 'Delete'
-
-/** The default keyboard shortcuts. */
-const DEFAULT_KEYBOARD_SHORTCUTS: Readonly<Record<KeyboardAction, KeyboardShortcut[]>> = {
-  [KeyboardAction.settings]: [keybind(KeyboardAction.settings, [CTRL], ',')],
-  [KeyboardAction.open]: [keybind(KeyboardAction.open, [], 'Enter')],
-  [KeyboardAction.run]: [keybind(KeyboardAction.run, ['Shift'], 'Enter')],
-  [KeyboardAction.close]: [],
-  [KeyboardAction.uploadToCloud]: [],
-  [KeyboardAction.rename]: [keybind(KeyboardAction.rename, [CTRL], 'R')],
-  [KeyboardAction.edit]: [keybind(KeyboardAction.edit, [CTRL], 'E')],
-  [KeyboardAction.snapshot]: [keybind(KeyboardAction.snapshot, [CTRL], 'S')],
-  [KeyboardAction.moveToTrash]: [keybind(KeyboardAction.moveToTrash, [], DELETE)],
-  [KeyboardAction.moveAllToTrash]: [keybind(KeyboardAction.moveAllToTrash, [], DELETE)],
-  [KeyboardAction.delete]: [keybind(KeyboardAction.delete, [], DELETE)],
-  [KeyboardAction.deleteAll]: [keybind(KeyboardAction.deleteAll, [], DELETE)],
-  [KeyboardAction.restoreFromTrash]: [keybind(KeyboardAction.restoreFromTrash, [CTRL], 'R')],
-  [KeyboardAction.restoreAllFromTrash]: [keybind(KeyboardAction.restoreAllFromTrash, [CTRL], 'R')],
-  [KeyboardAction.share]: [keybind(KeyboardAction.share, [CTRL], 'Enter')],
-  [KeyboardAction.label]: [keybind(KeyboardAction.label, [CTRL], 'L')],
-  [KeyboardAction.duplicate]: [keybind(KeyboardAction.duplicate, [CTRL], 'D')],
-  [KeyboardAction.copy]: [keybind(KeyboardAction.copy, [CTRL], 'C')],
-  [KeyboardAction.copyAll]: [keybind(KeyboardAction.copyAll, [CTRL], 'C')],
-  [KeyboardAction.cut]: [keybind(KeyboardAction.cut, [CTRL], 'X')],
-  [KeyboardAction.cutAll]: [keybind(KeyboardAction.cutAll, [CTRL], 'X')],
-  [KeyboardAction.cancelCut]: [keybind(KeyboardAction.cancelCut, [], 'Escape')],
-  [KeyboardAction.paste]: [keybind(KeyboardAction.paste, [CTRL], 'V')],
-  [KeyboardAction.pasteAll]: [keybind(KeyboardAction.pasteAll, [CTRL], 'V')],
-  [KeyboardAction.download]: [keybind(KeyboardAction.download, [CTRL, 'Shift'], 'S')],
-  [KeyboardAction.uploadFiles]: [keybind(KeyboardAction.uploadFiles, [CTRL], 'U')],
-  [KeyboardAction.uploadProjects]: [keybind(KeyboardAction.uploadProjects, [CTRL], 'U')],
-  [KeyboardAction.newProject]: [keybind(KeyboardAction.newProject, [CTRL], 'N')],
-  [KeyboardAction.newFolder]: [keybind(KeyboardAction.newFolder, [CTRL, 'Shift'], 'N')],
-  [KeyboardAction.newSecret]: [
-    keybind(KeyboardAction.newSecret, [CTRL, 'Alt'], 'N'),
-    ...(!detect.isOnMacOS() ? [] : [keybind(KeyboardAction.newSecret, [CTRL, 'Alt'], '~')]),
-  ],
-  [KeyboardAction.newDataLink]: [
-    keybind(KeyboardAction.newDataLink, [CTRL, 'Alt', 'Shift'], 'N'),
-    ...(!detect.isOnMacOS()
-      ? []
-      : [keybind(KeyboardAction.newSecret, [CTRL, 'Alt', 'Shift'], '~')]),
-  ],
-  [KeyboardAction.closeModal]: [keybind(KeyboardAction.closeModal, [], 'Escape')],
-  [KeyboardAction.cancelEditName]: [keybind(KeyboardAction.cancelEditName, [], 'Escape')],
-  [KeyboardAction.signIn]: [],
-  [KeyboardAction.signOut]: [],
-  [KeyboardAction.downloadApp]: [],
-}
-
-/** The default UI data for every keyboard shortcut. */
-const DEFAULT_KEYBOARD_SHORTCUT_INFO: Readonly<Record<KeyboardAction, ShortcutInfo>> = {
-  [KeyboardAction.settings]: { name: 'Settings', icon: SettingsIcon },
-  [KeyboardAction.open]: { name: 'Open', icon: OpenIcon },
-  [KeyboardAction.run]: { name: 'Run', icon: Play2Icon },
-  [KeyboardAction.close]: { name: 'Close', icon: CloseIcon },
-  [KeyboardAction.uploadToCloud]: { name: 'Upload To Cloud', icon: CloudToIcon },
-  [KeyboardAction.rename]: { name: 'Rename', icon: PenIcon },
-  [KeyboardAction.edit]: { name: 'Edit', icon: PenIcon },
-  [KeyboardAction.snapshot]: { name: 'Snapshot', icon: CameraIcon },
-  [KeyboardAction.moveToTrash]: {
-    name: 'Move To Trash',
-    icon: TrashIcon,
-    colorClass: 'text-delete',
-  },
-  [KeyboardAction.moveAllToTrash]: {
-    name: 'Move All To Trash',
-    icon: TrashIcon,
-    colorClass: 'text-delete',
-  },
-  [KeyboardAction.delete]: { name: 'Delete', icon: TrashIcon, colorClass: 'text-delete' },
-  [KeyboardAction.deleteAll]: { name: 'Delete All', icon: TrashIcon, colorClass: 'text-delete' },
-  [KeyboardAction.restoreFromTrash]: { name: 'Restore From Trash', icon: UntrashIcon },
-  [KeyboardAction.restoreAllFromTrash]: { name: 'Restore All From Trash', icon: UntrashIcon },
-  [KeyboardAction.share]: { name: 'Share', icon: PeopleIcon },
-  [KeyboardAction.label]: { name: 'Label', icon: TagIcon },
-  [KeyboardAction.duplicate]: { name: 'Duplicate', icon: DuplicateIcon },
-  [KeyboardAction.copy]: { name: 'Copy', icon: CopyIcon },
-  [KeyboardAction.copyAll]: { name: 'Copy All', icon: CopyIcon },
-  [KeyboardAction.cut]: { name: 'Cut', icon: ScissorsIcon },
-  [KeyboardAction.cutAll]: { name: 'Cut All', icon: ScissorsIcon },
-  [KeyboardAction.paste]: { name: 'Paste', icon: PasteIcon },
-  [KeyboardAction.pasteAll]: { name: 'Paste All', icon: PasteIcon },
-  [KeyboardAction.download]: { name: 'Download', icon: DataDownloadIcon },
-  [KeyboardAction.uploadFiles]: { name: 'Upload Files', icon: DataUploadIcon },
-  [KeyboardAction.uploadProjects]: { name: 'Upload Projects', icon: DataUploadIcon },
-  [KeyboardAction.newProject]: { name: 'New Project', icon: AddNetworkIcon },
-  [KeyboardAction.newFolder]: { name: 'New Folder', icon: AddFolderIcon },
-  [KeyboardAction.newSecret]: { name: 'New Secret', icon: AddKeyIcon },
-  [KeyboardAction.newDataLink]: { name: 'New Data Link', icon: AddConnectorIcon },
-  // These should not appear in any context menus.
-  [KeyboardAction.closeModal]: { name: 'Close', icon: BlankIcon },
-  [KeyboardAction.cancelEditName]: { name: 'Cancel Editing', icon: BlankIcon },
-  [KeyboardAction.signIn]: { name: 'Login', icon: SignInIcon },
-  [KeyboardAction.signOut]: { name: 'Logout', icon: SignOutIcon, colorClass: 'text-delete' },
-  [KeyboardAction.downloadApp]: { name: 'Download App', icon: AppDownloadIcon },
-  [KeyboardAction.cancelCut]: { name: 'Cancel Cut', icon: BlankIcon },
-}
-
-/** The default mouse shortcuts. */
-const DEFAULT_MOUSE_SHORTCUTS: Readonly<Record<MouseAction, MouseShortcut[]>> = {
-  [MouseAction.open]: [mousebind(MouseAction.open, [], MouseButton.left, 2)],
-  [MouseAction.run]: [mousebind(MouseAction.run, ['Shift'], MouseButton.left, 2)],
-  [MouseAction.editName]: [mousebind(MouseAction.editName, [CTRL], MouseButton.left, 1)],
-  [MouseAction.selectAdditional]: [
-    mousebind(MouseAction.selectAdditional, [CTRL], MouseButton.left, 1),
-  ],
-  [MouseAction.selectRange]: [mousebind(MouseAction.selectRange, ['Shift'], MouseButton.left, 1)],
-  [MouseAction.selectAdditionalRange]: [
-    mousebind(MouseAction.selectAdditionalRange, [CTRL, 'Shift'], MouseButton.left, 1),
-  ],
-}
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/__tests__/ShortcutManager.test.ts b/app/ide-desktop/lib/dashboard/src/utilities/__tests__/ShortcutManager.test.ts
deleted file mode 100644
index 06629b4ea5cd..000000000000
--- a/app/ide-desktop/lib/dashboard/src/utilities/__tests__/ShortcutManager.test.ts
+++ /dev/null
@@ -1,185 +0,0 @@
-/** @file Tests for `dateTime.ts`. */
-import * as v from 'vitest'
-
-import ShortcutManager, * as shortcutManagerModule from '#/utilities/ShortcutManager'
-
-// =============
-// === Tests ===
-// =============
-
-// NOTE: macOS using the meta key has not been tested, as it is not possible to override
-// `navigator.userAgent`.
-
-v.test.each([
-  {
-    event: new KeyboardEvent('keydown', { key: 'N', ctrlKey: true }),
-    action: shortcutManagerModule.KeyboardAction.newProject,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'N', ctrlKey: true, shiftKey: true }),
-    action: shortcutManagerModule.KeyboardAction.newFolder,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'N', ctrlKey: true, altKey: true }),
-    action: shortcutManagerModule.KeyboardAction.newSecret,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'C', ctrlKey: true }),
-    action: shortcutManagerModule.KeyboardAction.copyAll,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'X', ctrlKey: true }),
-    action: shortcutManagerModule.KeyboardAction.cutAll,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'V', ctrlKey: true }),
-    action: shortcutManagerModule.KeyboardAction.pasteAll,
-  },
-  // Disallow extra modifier keys
-  {
-    event: new KeyboardEvent('keydown', { key: 'N', ctrlKey: true, metaKey: true }),
-    action: null,
-  },
-  // Disallow invalid shortcutManager
-  {
-    event: new KeyboardEvent('keydown', { key: 'J' }),
-    action: null,
-  },
-  {
-    event: new KeyboardEvent('keydown', { key: 'J', ctrlKey: true }),
-    action: null,
-  },
-])('Keyboard shortcut handling', ({ event, action }) => {
-  const shortcutManager = ShortcutManager.createWithDefaults()
-  const matchedAction = v.vi.fn((shortcut: shortcutManagerModule.KeyboardAction) => shortcut)
-  shortcutManager.registerKeyboardHandlers(
-    new Proxy(
-      {},
-      {
-        /** Return a function that logs the key. */
-        get(_, key) {
-          // This is SAFE, as all keys are known at typecheck time.
-          // eslint-disable-next-line no-restricted-syntax
-          return () => matchedAction(key as shortcutManagerModule.KeyboardAction)
-        },
-      }
-    )
-  )
-  const eventString =
-    (event.ctrlKey ? 'Ctrl+' : '') +
-    (event.shiftKey ? 'Shift+' : '') +
-    (event.altKey ? 'Alt+' : '') +
-    (event.metaKey ? 'Cmd+' : '') +
-    event.key
-  if (action != null) {
-    v.expect(
-      shortcutManager.handleKeyboardEvent(event),
-      `'${eventString}' should match a keyboard action`
-    ).toBe(true)
-    v.expect(
-      matchedAction,
-      `'${eventString}' should match the keyboard action '${action}'`
-    ).toBeCalledWith(action)
-  } else {
-    v.expect(
-      shortcutManager.handleKeyboardEvent(event),
-      `'${eventString}' should not match any keyboard action`
-    ).toBe(false)
-  }
-})
-
-v.test.each([
-  // === Should match ===
-  {
-    event: new MouseEvent('mousedown', { detail: 2 }),
-    action: shortcutManagerModule.MouseAction.open,
-  },
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, detail: 1 }),
-    action: shortcutManagerModule.MouseAction.selectAdditional,
-  },
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, shiftKey: true, detail: 1 }),
-    action: shortcutManagerModule.MouseAction.selectAdditionalRange,
-  },
-  {
-    event: new MouseEvent('mousedown', { shiftKey: true, detail: 1 }),
-    action: shortcutManagerModule.MouseAction.selectRange,
-  },
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, detail: 1 }),
-    action: shortcutManagerModule.MouseAction.editName,
-  },
-  // Triple click or double click instead of single click SHOULD match
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, detail: 3 }),
-    action: shortcutManagerModule.MouseAction.selectAdditional,
-  },
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, detail: 2 }),
-    action: shortcutManagerModule.MouseAction.selectAdditional,
-  },
-  // Triple click instead of double click SHOULD match
-  {
-    event: new MouseEvent('mousedown', { detail: 3 }),
-    action: shortcutManagerModule.MouseAction.open,
-  },
-  // === Should not match ===
-  // Single click instad of double click
-  {
-    event: new MouseEvent('mousedown', { detail: 1 }),
-    action: shortcutManagerModule.MouseAction.open,
-    match: false,
-  },
-  // 0 clicks instad of double click
-  {
-    event: new MouseEvent('mousedown', { detail: 0 }),
-    action: shortcutManagerModule.MouseAction.open,
-    match: false,
-  },
-  {
-    event: new MouseEvent('mousedown'),
-    action: shortcutManagerModule.MouseAction.open,
-    match: false,
-  },
-  // Missing modifier keys
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true, detail: 2 }),
-    action: shortcutManagerModule.MouseAction.selectAdditionalRange,
-    match: false,
-  },
-  // Extra modifier keys
-  {
-    event: new MouseEvent('mousedown', {
-      ctrlKey: true,
-      altKey: true,
-      metaKey: true,
-      detail: 2,
-    }),
-    action: shortcutManagerModule.MouseAction.selectAdditional,
-    match: false,
-  },
-  {
-    event: new MouseEvent('mousedown', { ctrlKey: true }),
-    action: shortcutManagerModule.MouseAction.open,
-    match: false,
-  },
-])('Mouse shortcut handling', ({ event, action, match = true }) => {
-  const shortcutManager = ShortcutManager.createWithDefaults()
-  v.expect(
-    shortcutManager.matchesMouseAction(action, event),
-    `'${
-      (event.ctrlKey ? 'Ctrl+' : '') +
-      (event.shiftKey ? 'Shift+' : '') +
-      (event.altKey ? 'Alt+' : '') +
-      (event.metaKey ? 'Cmd+' : '') +
-      (event.detail === 0
-        ? 'No Click'
-        : event.detail === 1
-        ? 'Click'
-        : event.detail === 2
-        ? 'Double Click'
-        : 'Triple Click')
-    }' should${match ? '' : ' not'} match the mouse action '${action}'`
-  ).toBe(match)
-})
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/__tests__/shortcuts.test.ts b/app/ide-desktop/lib/dashboard/src/utilities/__tests__/shortcuts.test.ts
new file mode 100644
index 000000000000..d501e4b6e9ce
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/utilities/__tests__/shortcuts.test.ts
@@ -0,0 +1,59 @@
+/** @file Tests for `dateTime.ts`. */
+import * as v from 'vitest'
+
+import * as detect from 'enso-common/src/detect'
+
+import * as shortcutsModule from '#/utilities/inputBindings'
+
+// =============
+// === Tests ===
+// =============
+
+// NOTE: macOS using the meta key has not been tested, as it is not possible to override
+// `navigator.userAgent`.
+
+const DELETE_KEY = detect.isOnMacOS() ? 'Backspace' : 'Delete'
+
+v.test.each([
+  { keybind: 'A', expected: { modifiers: [], key: 'A' } },
+  { keybind: 'b', expected: { modifiers: [], key: 'B' } },
+  { keybind: 'Space', expected: { modifiers: [], key: ' ' } },
+  { keybind: 'Mod+Space', expected: { modifiers: ['Mod'], key: ' ' } },
+  // `+`
+  { keybind: 'Mod++', expected: { modifiers: ['Mod'], key: '+' } },
+  // `+` and capitalization
+  { keybind: 'mod++', expected: { modifiers: ['Mod'], key: '+' } },
+  {
+    keybind: 'Mod+Alt+Shift+PointerMain',
+    expected: { modifiers: ['Mod', 'Alt', 'Shift'], key: 'PointerMain' },
+  },
+  // Misspelling. Assume it is an unknown key
+  {
+    keybind: 'shift+Alt+Mode+PointerMain',
+    expected: { modifiers: ['Shift', 'Alt'], key: 'Mode' },
+  },
+  // Capitalization
+  {
+    keybind: 'meta+shift+alt+mod+pointermain',
+    expected: { modifiers: ['Meta', 'Shift', 'Alt', 'Mod'], key: 'PointerMain' },
+  },
+  // Repeated keys
+  {
+    keybind: 'A+A+A+A+A+A+A+A+A+A+A+A+A+A',
+    expected: { modifiers: [], key: 'A' },
+  },
+  {
+    keybind: 'mod++++++++++++++++',
+    expected: { modifiers: ['Mod'], key: '+' },
+  },
+  // Misc tests
+  {
+    keybind: 'osDEleTE',
+    // The specific key is OS-dependent. Look it up in the same lookup used by
+    // `decomposeKeybindString` so that it is guaranteed to be the right key on all systems.
+    expected: { modifiers: [], key: DELETE_KEY },
+  },
+])('Keybinds should be parsed correctly', ({ keybind, expected }) => {
+  const decomposed = shortcutsModule.decomposeKeybindString(keybind)
+  v.expect(decomposed).toEqual(expected)
+})
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/event.ts b/app/ide-desktop/lib/dashboard/src/utilities/event.ts
index e2fc9c461822..e71f5273639a 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/event.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/event.ts
@@ -22,3 +22,31 @@ export function isDoubleClick(event: React.MouseEvent) {
 export function isModKey(event: React.KeyboardEvent | React.MouseEvent) {
   return detect.isOnMacOS() ? event.metaKey : event.ctrlKey
 }
+
+// ================================
+// === Keyboard event utilities ===
+// ================================
+
+/** A {@link RegExp} that matches {@link KeyboardEvent.code}s corresponding to non-printable
+ * keys. */
+const SPECIAL_CHARACTER_KEYCODE_REGEX = /^[A-Z][a-z]/
+
+/** Whether `event` may trigger a shortcut. */
+export function isPotentiallyShortcut(event: KeyboardEvent | React.KeyboardEvent) {
+  return event.ctrlKey || event.metaKey || event.altKey
+}
+
+/** Whether `event.key` is a key used in text editing. */
+export function isTextInputKey(event: KeyboardEvent | React.KeyboardEvent) {
+  return (
+    !SPECIAL_CHARACTER_KEYCODE_REGEX.test(event.key) ||
+    event.key === 'Backspace' ||
+    event.key === 'Delete'
+  )
+}
+
+/** Whether `event` will produce text. This excludes shortcutManager, as they do not produce text. */
+export function isTextInputEvent(event: KeyboardEvent | React.KeyboardEvent) {
+  // Allow `alt` key to be pressed in case it is being used to enter special characters.
+  return !event.ctrlKey && !event.shiftKey && !event.metaKey && isTextInputKey(event)
+}
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/inputBindings.ts b/app/ide-desktop/lib/dashboard/src/utilities/inputBindings.ts
new file mode 100644
index 000000000000..e1f980e1f8d7
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/utilities/inputBindings.ts
@@ -0,0 +1,711 @@
+/** @file Exports `defineKeybinds`, a function to define a namespace containing keyboard and mouse
+ * shortcuts. */
+import * as detect from 'enso-common/src/detect'
+
+import * as newtype from '#/utilities/newtype'
+import * as object from '#/utilities/object'
+import * as string from '#/utilities/string'
+
+// ================
+// === Newtypes ===
+// ================
+
+/** A keyboard key obtained from `KeyboardEvent.key`. */
+type KeyName = newtype.Newtype<string, 'keyboard key'>
+// eslint-disable-next-line @typescript-eslint/no-redeclare, @typescript-eslint/naming-convention
+const KeyName = newtype.newtypeConstructor<KeyName>()
+/** A bitset of flags representing each keyboard modifier key. */
+type ModifierFlags = newtype.Newtype<number, 'modifier flags'>
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+const ModifierFlags = newtype.newtypeConstructor<ModifierFlags>()
+/** A bitset of flags representing each mouse pointer. */
+type PointerButtonFlags = newtype.Newtype<number, 'pointer button flags'>
+// eslint-disable-next-line @typescript-eslint/no-redeclare
+const PointerButtonFlags = newtype.newtypeConstructor<PointerButtonFlags>()
+
+// =============
+// === Types ===
+// =============
+
+/** All possible modifier keys. */
+export type ModifierKey = keyof typeof RAW_MODIFIER_FLAG
+
+/** The target of a {@link KeyboardEvent}, {@link MouseEvent}, or {@link PointerEvent}. */
+export interface InputEventTarget<
+  EventName extends string,
+  Event extends
+    | KeyboardEvent
+    | MouseEvent
+    | PointerEvent
+    | React.KeyboardEvent
+    | React.MouseEvent
+    | React.PointerEvent,
+> {
+  readonly addEventListener: (eventName: EventName, handler: (event: Event) => void) => void
+  readonly removeEventListener: (eventName: EventName, handler: (event: Event) => void) => void
+}
+
+/** An intermediate representation of a keybind, in which all segments have been tokenized but
+ * before converting into either a {@link Keybind} or a {@link Mousebind}. */
+interface ModifierStringDecomposition {
+  readonly key: string
+  readonly modifiers: Modifier[]
+}
+
+/** A keyboard shortcut. */
+export interface Keybind {
+  readonly type: 'keybind'
+  readonly key: KeyName
+  readonly modifierFlags: ModifierFlags
+}
+
+/** A mouse shortcut. */
+export interface Mousebind {
+  readonly type: 'mousebind'
+  readonly key: PointerButtonFlags
+  readonly modifierFlags: ModifierFlags
+}
+
+// ======================
+// === Modifier flags ===
+// ======================
+
+/* eslint-disable @typescript-eslint/naming-convention */
+const RAW_MODIFIER_FLAG = {
+  Ctrl: ModifierFlags(1 << 0),
+  Alt: ModifierFlags(1 << 1),
+  Shift: ModifierFlags(1 << 2),
+  Meta: ModifierFlags(1 << 3),
+} as const
+
+const MODIFIER_FLAG_NAME: Readonly<Record<Modifier, ModifierKey>> = {
+  Mod: detect.isOnMacOS() ? 'Meta' : 'Ctrl',
+  Ctrl: 'Ctrl',
+  Alt: 'Alt',
+  Shift: 'Shift',
+  Meta: 'Meta',
+}
+
+const MODIFIER_FLAG: Readonly<Record<Modifier, ModifierFlags>> = {
+  Mod: RAW_MODIFIER_FLAG[MODIFIER_FLAG_NAME.Mod],
+  Ctrl: RAW_MODIFIER_FLAG[MODIFIER_FLAG_NAME.Ctrl],
+  Alt: RAW_MODIFIER_FLAG[MODIFIER_FLAG_NAME.Alt],
+  Shift: RAW_MODIFIER_FLAG[MODIFIER_FLAG_NAME.Shift],
+  Meta: RAW_MODIFIER_FLAG[MODIFIER_FLAG_NAME.Meta],
+}
+/* eslint-enable @typescript-eslint/naming-convention */
+
+/** A number representing the unique combination of modifier flags. */
+function modifierFlagsForModifiers(modifiers: Modifier[]): ModifierFlags {
+  let result = 0
+  for (const modifier of modifiers) {
+    result |= MODIFIER_FLAG[modifier]
+  }
+  return ModifierFlags(result)
+}
+
+/** The names of all {@link Modifier}s in this {@link ModifierFlags}, in the OS' preferred order. */
+export function modifiersForModifierFlags(modifierFlags: ModifierFlags): Modifier[] {
+  return ALL_MODIFIERS.filter(modifier => (MODIFIER_FLAG[modifier] & modifierFlags) !== 0)
+}
+
+/** Returns the raw modifier key equivalent of a modifier. */
+export function toModifierKey(modifier: Modifier): ModifierKey {
+  return MODIFIER_FLAG_NAME[modifier]
+}
+
+/** A comparison function that can be passed to {@link Array.sort}. */
+export function compareModifiers(a: Modifier, b: Modifier): number {
+  // This is INCORRECT, but SAFE when the modifiers are generated by the same system that is
+  // currently reading them. This should always be the case unless a `Modifier` is saved in
+  // `localStorage` and then synced to a browser on a different OS.
+  // eslint-disable-next-line no-restricted-syntax
+  return ALL_MODIFIERS.indexOf(a as never) - ALL_MODIFIERS.indexOf(b as never)
+}
+
+/** Any event that contains modifier keys. {@link KeyboardEvent}s and {@link MouseEvent}s fall into
+ * this category. */
+interface EventWithModifiers {
+  readonly ctrlKey: boolean
+  readonly altKey: boolean
+  readonly shiftKey: boolean
+  readonly metaKey: boolean
+}
+
+/** A number representing the unique combination of modifier flags for an event.. */
+export function modifierFlagsForEvent(event: EventWithModifiers): ModifierFlags {
+  // eslint-disable-next-line no-restricted-syntax
+  return ModifierFlags(
+    (event.ctrlKey ? RAW_MODIFIER_FLAG.Ctrl : 0) |
+      (event.altKey ? RAW_MODIFIER_FLAG.Alt : 0) |
+      (event.shiftKey ? RAW_MODIFIER_FLAG.Shift : 0) |
+      (event.metaKey ? RAW_MODIFIER_FLAG.Meta : 0)
+  )
+}
+
+/* eslint-disable @typescript-eslint/naming-convention */
+/** These values MUST match the flags on `MouseEvent#button`.
+ * See https://developer.mozilla.org/en-US/docs/Web/API/MouseEvent/buttons */
+const POINTER_BUTTON_FLAG: Readonly<Record<Pointer, PointerButtonFlags>> = {
+  PointerMain: PointerButtonFlags(1 << 0),
+  PointerSecondary: PointerButtonFlags(1 << 1),
+  PointerAux: PointerButtonFlags(1 << 2),
+  PointerBack: PointerButtonFlags(1 << 3),
+  PointerForward: PointerButtonFlags(1 << 4),
+}
+/* eslint-enable @typescript-eslint/naming-convention */
+
+/** Return the equivalent {@link PointerButtonFlags} for the given mouse `button`. */
+function buttonToPointerButtonFlags(button: number) {
+  switch (button) {
+    case 0: {
+      return POINTER_BUTTON_FLAG.PointerMain
+    }
+    case 1: {
+      return POINTER_BUTTON_FLAG.PointerAux
+    }
+    case 2: {
+      return POINTER_BUTTON_FLAG.PointerSecondary
+    }
+    case 3: {
+      return POINTER_BUTTON_FLAG.PointerBack
+    }
+    case 4: {
+      return POINTER_BUTTON_FLAG.PointerForward
+    }
+    default: {
+      return PointerButtonFlags(0)
+    }
+  }
+}
+
+// ==========================
+// === Autocomplete types ===
+// ==========================
+
+const ALL_MODIFIERS = detect.isOnMacOS()
+  ? (['Ctrl', 'Shift', 'Alt', 'Mod'] as const)
+  : (['Mod', 'Shift', 'Alt', 'Meta'] as const)
+/** All valid keyboard modifier keys. */
+type Modifier = (typeof ALL_MODIFIERS)[number]
+/** All valid keyboard modifier keys, normalized to lowercase for autocomplete purposes. */
+type LowercaseModifier = Lowercase<Modifier>
+const ALL_POINTERS = [
+  'PointerMain',
+  'PointerSecondary',
+  'PointerAux',
+  'PointerBack',
+  'PointerForward',
+] as const
+/** All valid mouse pointer buttons. */
+type Pointer = (typeof ALL_POINTERS)[number]
+/** All valid mouse pointer buttons, normalized to lowercase for autocomplete purposes. */
+type LowercasePointer = Lowercase<Pointer>
+/** This list is non-exhaustive. It is intentionally limited to keys found on most keyboards. */
+const ALL_KEYS = [
+  'Escape',
+  'Enter',
+  'Backspace',
+  'Delete',
+  // The key labeled as `Delete` - `Backspace` on macOS, `Delete` on all other platforms.
+  'OsDelete',
+  'Tab',
+  'ArrowUp',
+  'ArrowDown',
+  'ArrowLeft',
+  'ArrowRight',
+  'Home',
+  'End',
+  'PageUp',
+  'PageDown',
+  'Insert',
+  'Space',
+  'A',
+  'B',
+  'C',
+  'D',
+  'E',
+  'F',
+  'G',
+  'H',
+  'I',
+  'J',
+  'K',
+  'L',
+  'M',
+  'N',
+  'O',
+  'P',
+  'Q',
+  'R',
+  'S',
+  'T',
+  'U',
+  'V',
+  'W',
+  'X',
+  'Y',
+  'Z',
+  '0',
+  '1',
+  '2',
+  '3',
+  '4',
+  '5',
+  '6',
+  '7',
+  '8',
+  '9',
+  '`',
+  '-',
+  '=',
+  '~',
+  '!',
+  '@',
+  '#',
+  '$',
+  '%',
+  '^',
+  '&',
+  '*',
+  '(',
+  ')',
+  '_',
+  '+',
+  '[',
+  ']',
+  '\\',
+  '{',
+  '}',
+  '|',
+  ';',
+  "'",
+  ':',
+  '"',
+  ',',
+  '.',
+  '/',
+  '<',
+  '>',
+  '?',
+  'F1',
+  'F2',
+  'F3',
+  'F4',
+  'F5',
+  'F6',
+  'F7',
+  'F8',
+  'F9',
+  'F10',
+  'F11',
+  'F12',
+] as const
+/** Common keyboard keys. */
+type Key = (typeof ALL_KEYS)[number]
+/** Common keyboard keys, normalized to lowercase for autocomplete purposes. */
+type LowercaseKey = Lowercase<Key>
+/** A segment of a keyboard shortcut. */
+type KeybindSegment = Key | Modifier | Pointer
+export const normalizedKeyboardSegmentLookup = Object.fromEntries<string>(
+  [...ALL_MODIFIERS, ...ALL_POINTERS, ...ALL_KEYS].map(entry => [entry.toLowerCase(), entry])
+)
+normalizedKeyboardSegmentLookup[''] = '+'
+normalizedKeyboardSegmentLookup['space'] = ' '
+normalizedKeyboardSegmentLookup['osdelete'] = detect.isOnMacOS() ? 'Backspace' : 'Delete'
+/** A mapping between the lowercased segment of a keyboard shortcut to its properly capitalized
+ * normalized form. */
+type NormalizeKeybindSegment = {
+  [K in KeybindSegment as Lowercase<K>]: K
+}
+/** A segment suggestible by autocomplete. */
+type SuggestedKeybindSegment = Key | Pointer | `${Modifier}+`
+/** A helper type used to autocomplete and validate a single keyboard shortcut in the editor. */
+type AutocompleteKeybind<T extends string, FoundKeyName extends string = never> = T extends '+'
+  ? T
+  : T extends `${infer First}+${infer Rest}`
+  ? Lowercase<First> extends LowercaseModifier
+    ? `${NormalizeKeybindSegment[Lowercase<First>] & string}+${AutocompleteKeybind<Rest>}`
+    : Lowercase<First> extends LowercaseKey | LowercasePointer
+    ? AutocompleteKeybind<Rest, NormalizeKeybindSegment[Lowercase<First>] & string>
+    : `${Modifier}+${AutocompleteKeybind<Rest>}`
+  : T extends ''
+  ? SuggestedKeybindSegment
+  : Lowercase<T> extends LowercaseKey | LowercasePointer
+  ? NormalizeKeybindSegment[Lowercase<T>]
+  : Lowercase<T> extends LowercaseModifier
+  ? [FoundKeyName] extends [never]
+    ? `${NormalizeKeybindSegment[Lowercase<T>] & string}+${SuggestedKeybindSegment}`
+    : `${NormalizeKeybindSegment[Lowercase<T>] & string}+${FoundKeyName}`
+  : [FoundKeyName] extends [never]
+  ? SuggestedKeybindSegment
+  : FoundKeyName
+
+/** A helper type used to autocomplete and validate an array of keyboard shortcuts in the editor.
+ */
+type AutocompleteKeybinds<T extends readonly string[]> = {
+  [K in keyof T]: AutocompleteKeybind<T[K]>
+}
+
+/** A list of keybinds, with metadata describing its purpose. */
+export interface KeybindsWithMetadata {
+  readonly name: string
+  readonly bindings: readonly [] | readonly string[]
+  readonly description?: string
+  readonly icon?: string
+  readonly color?: string
+  /** Defaults to `true`. */
+  readonly rebindable?: boolean
+}
+
+/** A helper type used to autocomplete and validate an array of keyboard shortcuts (and its
+ * associated metadata) in the editor.
+ *
+ * This type SHOULD NOT be explicitly written - it is only exported to suppress TypeScript
+ * errors. */
+export interface AutocompleteKeybindsWithMetadata<T extends KeybindsWithMetadata> {
+  readonly name: string
+  readonly bindings: AutocompleteKeybinds<T['bindings']>
+  readonly description?: string
+  readonly icon?: string
+  readonly color?: string
+  /** Defaults to `true`. */
+  readonly rebindable?: boolean
+}
+
+/** All the corresponding value for an arbitrary key of a {@link Keybinds}. */
+type KeybindValue = KeybindsWithMetadata | readonly [] | readonly string[]
+
+/** A helper type used to autocomplete and validate an object containing actions and their
+ * corresponding keyboard shortcuts. */
+// `never extends T ? Result : InferenceSource` is a trick to unify `T` with the actual type of the
+// argument.
+type Keybinds<T extends Record<keyof T, KeybindValue>> = never extends T
+  ? {
+      [K in keyof T]: T[K] extends readonly string[]
+        ? AutocompleteKeybinds<T[K]>
+        : T[K] extends KeybindsWithMetadata
+        ? AutocompleteKeybindsWithMetadata<T[K]>
+        : ['error...', T]
+    }
+  : T
+
+const DEFINED_NAMESPACES = new Set<string>()
+
+export const DEFAULT_HANDLER = Symbol('default handler')
+
+/** Define key bindings for the given namespace.
+ *
+ * This function takes list of actions with default bindings, and returns an object which allows
+ * making event handler which in turn may be added as an appropriate event listener. It may handle
+ * both keyboard and mouse events.
+ *
+ * The event handler assigns functions to the corresponding action. The function may return false
+ * if the event should be considered not handled (and thus propagated). Returning true or just
+ * nothing from the function will cause propagation of event stop.
+ * @param namespace - should be unique among other `defineKeybinds` calls.
+ * @param originalBindings - an object defining actions and their key bindings. Each property name
+ * is an action name, and the value is a list of default key bindings. See "Keybinds should be
+ * parsed correctly" test for examples of valid strings.
+ * @returns an object with defined `handler` function.
+ * @example
+ * Define bindings:
+ * ```
+ * const graphBindings = defineKeybinds('graph-editor', {
+ *   undo: ['Mod+Z'],
+ *   redo: ['Mod+Y', 'Mod+Shift+Z'],
+ *   dragScene: ['PointerAux', 'Mod+PointerMain'],
+ *   openComponentBrowser: ['Enter'],
+ *   newNode: ['N'],
+ * })
+ * ```
+ *
+ * Then make a handler:
+ * ```
+ * const graphBindingsHandler = graphBindings.handler({
+ *   undo() {
+ *     projectStore.module?.undoManager.undo()
+ *   },
+ *   redo() {
+ *     projectStore.module?.undoManager.redo()
+ *   },
+ *   openComponentBrowser() {
+ *     if (keyboardBusy()) return false
+ *     if (navigator.sceneMousePos != null && !componentBrowserVisible.value) {
+ *       componentBrowserPosition.value = navigator.sceneMousePos
+ *       componentBrowserVisible.value = true
+ *     }
+ *   },
+ *   newNode() {
+ *     if (keyboardBusy()) return false
+ *     if (navigator.sceneMousePos != null) {
+ *       graphStore.createNode(navigator.sceneMousePos, 'hello "world"! 123 + x')
+ *     }
+ *   },
+ * })
+ * ```
+ *
+ * And then pass the handler to the event listener:
+ * ```
+ * useEvent(window, 'keydown', graphBindingsHandler)
+ * ```
+ */
+export function defineBindingNamespace<T extends Record<keyof T, KeybindValue>>(
+  namespace: string,
+  originalBindings: Keybinds<T>
+) {
+  /** The name of a binding in this set of keybinds. */
+  type BindingKey = string & keyof T
+  if (DEFINED_NAMESPACES.has(namespace)) {
+    // eslint-disable-next-line no-restricted-properties
+    console.warn(`The keybind namespace '${namespace}' has already been defined.`)
+  } else {
+    DEFINED_NAMESPACES.add(namespace)
+  }
+  let keyboardShortcuts: Partial<Record<KeyName, Partial<Record<ModifierFlags, Set<BindingKey>>>>> =
+    {}
+  let mouseShortcuts: Partial<
+    Record<PointerButtonFlags, Partial<Record<ModifierFlags, Set<BindingKey>>>>
+  > = []
+
+  const bindings = structuredClone(originalBindings)
+  // This is SAFE, as it is a `readonly` upcast.
+  const bindingsAsRecord =
+    // eslint-disable-next-line no-restricted-syntax
+    bindings as Readonly<Record<string, KeybindValue>>
+
+  // This non-null assertion is SAFE, as it is immediately assigned by `rebuildMetadata()`.
+  let metadata!: Record<BindingKey, KeybindsWithMetadata>
+  const rebuildMetadata = () => {
+    // This is SAFE, as this type is a direct mapping from `bindingsAsRecord`, which has `BindingKey`
+    // as its keys.
+    // eslint-disable-next-line no-restricted-syntax
+    metadata = Object.fromEntries(
+      Object.entries(bindingsAsRecord).map(kv => {
+        const [name, info] = kv
+        if (Array.isArray(info)) {
+          return [name, { name: string.camelCaseToTitleCase(name), bindings: info }]
+        } else {
+          return [name, info]
+        }
+      })
+    ) as Record<BindingKey, KeybindsWithMetadata>
+  }
+
+  const rebuildLookups = () => {
+    rebuildMetadata()
+    keyboardShortcuts = {}
+    mouseShortcuts = []
+    for (const [nameRaw, value] of Object.entries(bindingsAsRecord)) {
+      const keybindStrings = 'bindings' in value ? value.bindings : value
+      // This is SAFE, as `Keybinds<T>` is a type derived from `T`.
+      // eslint-disable-next-line no-restricted-syntax
+      const name = nameRaw as BindingKey
+      for (const keybindString of keybindStrings) {
+        const keybind = parseKeybindString(keybindString)
+        switch (keybind.type) {
+          case 'keybind': {
+            const shortcutsByKey = (keyboardShortcuts[keybind.key] ??= [])
+            // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+            const shortcutsByModifier = (shortcutsByKey[keybind.modifierFlags] ??= new Set())
+            shortcutsByModifier.add(name)
+            break
+          }
+          case 'mousebind': {
+            const shortcutsByKey = (mouseShortcuts[keybind.key] ??= [])
+            const shortcutsByModifier = (shortcutsByKey[keybind.modifierFlags] ??= new Set())
+            shortcutsByModifier.add(name)
+            break
+          }
+        }
+      }
+    }
+  }
+  rebuildLookups()
+
+  const handler = <
+    Event extends
+      | KeyboardEvent
+      | MouseEvent
+      | PointerEvent
+      | React.KeyboardEvent
+      | React.MouseEvent
+      | React.PointerEvent,
+  >(
+    handlers: Partial<
+      // This MUST be `void` to allow implicit returns.
+      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+      Record<BindingKey | typeof DEFAULT_HANDLER, (event: Event) => boolean | void>
+    >,
+    stopAndPrevent = true
+  ): ((event: Event, stopAndPrevent?: boolean) => boolean) => {
+    return (event, innerStopAndPrevent = stopAndPrevent) => {
+      const eventModifierFlags = modifierFlagsForEvent(event)
+      const matchingBindings =
+        'key' in event
+          ? keyboardShortcuts[KeyName(event.key.toLowerCase())]?.[eventModifierFlags]
+          : mouseShortcuts[
+              event.buttons !== 0
+                ? PointerButtonFlags(event.buttons)
+                : buttonToPointerButtonFlags(event.button)
+            ]?.[eventModifierFlags]
+      let handle = handlers[DEFAULT_HANDLER]
+      if (matchingBindings != null) {
+        for (const bindingNameRaw in handlers) {
+          // This is SAFE, because `handlers` is an object with identical keys to `T`,
+          // which `BindingName` is also derived from.
+          // eslint-disable-next-line no-restricted-syntax
+          const bindingName = bindingNameRaw as BindingKey
+          if (matchingBindings.has(bindingName)) {
+            handle = handlers[bindingName]
+            break
+          }
+        }
+      }
+      if (handle == null) {
+        return false
+      } else if (handle(event) === false) {
+        return false
+      } else {
+        if (innerStopAndPrevent) {
+          if ('stopImmediatePropagation' in event) {
+            event.stopImmediatePropagation()
+          } else {
+            event.stopPropagation()
+          }
+          event.preventDefault()
+        }
+        return true
+      }
+    }
+  }
+
+  const attach = <
+    EventName extends string,
+    Event extends
+      | KeyboardEvent
+      | MouseEvent
+      | PointerEvent
+      | React.KeyboardEvent
+      | React.MouseEvent
+      | React.PointerEvent,
+  >(
+    target: InputEventTarget<EventName, Event>,
+    eventName: EventName,
+    handlers: Partial<
+      // This MUST be `void` to allow implicit returns.
+      // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
+      Record<BindingKey | typeof DEFAULT_HANDLER, (event: Event) => boolean | void>
+    >,
+    stopAndPrevent = true
+  ) => {
+    const newHandler = handler(handlers, stopAndPrevent)
+    target.addEventListener(eventName, newHandler)
+    return () => {
+      target.removeEventListener(eventName, newHandler)
+    }
+  }
+
+  const reset = (key: BindingKey) => {
+    bindings[key] = structuredClone(originalBindings[key])
+    rebuildLookups()
+  }
+
+  const deleteFunction = (key: BindingKey, binding: string) => {
+    const bindingsOrInfo = bindingsAsRecord[key]
+    const bindingsList =
+      bindingsOrInfo != null && 'bindings' in bindingsOrInfo
+        ? bindingsOrInfo.bindings
+        : bindingsOrInfo
+    if (bindingsList != null) {
+      object.unsafeMutable(bindingsList).splice(bindingsList.indexOf(binding), 1)
+      rebuildLookups()
+    }
+  }
+
+  const add = (key: BindingKey, binding: string) => {
+    const bindingsOrInfo = bindingsAsRecord[key]
+    const bindingsList =
+      bindingsOrInfo != null && 'bindings' in bindingsOrInfo
+        ? bindingsOrInfo.bindings
+        : bindingsOrInfo
+    if (bindingsList != null) {
+      object.unsafeMutable(bindingsList).push(binding)
+      rebuildLookups()
+    }
+  }
+
+  return {
+    /** Return an event handler that handles a native keyboard, mouse or pointer event. */
+    handler,
+    /** Attach an event listener to an {@link EventTarget} and return a function to detach the
+     * listener. */
+    attach,
+    /** Reset the entire list of bindings for a specific action to its default value. */
+    reset,
+    /** Delete one specific binding from the bindings for a specific action. */
+    delete: deleteFunction,
+    /** Add a new binding to the bindings for a specific action. */
+    add,
+    /** Metadata for every input binding. */
+    get metadata() {
+      return metadata
+    },
+  } as const
+}
+
+/** A function to define a bindings object that can be passed to {@link defineBindingNamespace}.
+ * Useful when wanting to create reusable keybind definitions, or non-global keybind definitions. */
+export function defineBindings<T extends Record<keyof T, KeybindValue>>(bindings: Keybinds<T>) {
+  return bindings
+}
+
+/** A type predicate that narrows the potential child of the array. */
+function includesPredicate<T extends U, U>(array: readonly T[]) {
+  const wideArray: readonly unknown[] = array
+  return (element: unknown): element is T => wideArray.includes(element)
+}
+
+// This is a function, even though it does not contain function syntax.
+// eslint-disable-next-line no-restricted-syntax
+const isModifier = includesPredicate(ALL_MODIFIERS)
+// This is a function, even though it does not contain function syntax.
+// eslint-disable-next-line no-restricted-syntax
+const isPointer = includesPredicate(ALL_POINTERS)
+
+/** Convert a keybind string to an intermediate form containing both the key and its modifiers
+ * (if any).
+ *
+ * Although this is exported, it should ONLY be used for testing, as it is an implementation
+ * detail. */
+export function decomposeKeybindString(keybindString: string): ModifierStringDecomposition {
+  const trimmed = keybindString.trim()
+  const parts =
+    trimmed === ''
+      ? []
+      : trimmed
+          .split(/[\s+]+/)
+          .map(part => normalizedKeyboardSegmentLookup[part.trim().toLowerCase()] ?? part)
+  const modifiers = parts.filter(isModifier)
+  const key = parts.find(part => !isModifier(part))
+  return { key: key ?? '', modifiers }
+}
+
+/** Parse a keybind string into a {@link Mousebind} if the key name describes a mouse button,
+ * otherwise parse it into a {@link Keybind}. */
+export function parseKeybindString(keybindS: string): Keybind | Mousebind {
+  const decomposed = decomposeKeybindString(keybindS)
+  if (isPointer(decomposed.key)) {
+    return {
+      type: 'mousebind',
+      key: POINTER_BUTTON_FLAG[decomposed.key],
+      modifierFlags: modifierFlagsForModifiers(decomposed.modifiers),
+    }
+  } else {
+    return {
+      type: 'keybind',
+      key: KeyName(decomposed.key.toLowerCase()),
+      modifierFlags: modifierFlagsForModifiers(decomposed.modifiers),
+    }
+  }
+}
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/object.ts b/app/ide-desktop/lib/dashboard/src/utilities/object.ts
index af8c36a882aa..ff9f2eb4e1c9 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/object.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/object.ts
@@ -44,7 +44,7 @@ export function unsafeMutable<T extends object>(object: T): { -readonly [K in ke
  * extra keys. */
 export function unsafeEntries<T extends object>(
   object: T
-): { [K in keyof T]: [K, T[K]] }[keyof T][] {
+): readonly { [K in keyof T]: readonly [K, T[K]] }[keyof T][] {
   // @ts-expect-error This is intentionally a wrapper function with a different type.
   return Object.entries(object)
 }
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/sanitizedEventTargets.ts b/app/ide-desktop/lib/dashboard/src/utilities/sanitizedEventTargets.ts
new file mode 100644
index 000000000000..727230ea7e74
--- /dev/null
+++ b/app/ide-desktop/lib/dashboard/src/utilities/sanitizedEventTargets.ts
@@ -0,0 +1,56 @@
+/** @file Various common {@link EventTarget}s, without the unsafe catch-all overload
+ * that accepts a `string` event name. */
+
+/** An arbitrary {@link HTMLElement} without the unsafe {@link EventTarget} overloads. */
+interface SanitizedHTMLElementEventTarget
+  extends Omit<HTMLElement, 'addEventListener' | 'removeEventListener'> {
+  readonly addEventListener: <K extends keyof HTMLElementEventMap>(
+    type: K,
+    listener: (this: Document, ev: HTMLElementEventMap[K]) => unknown,
+    options?: AddEventListenerOptions | boolean
+  ) => void
+  readonly removeEventListener: <K extends keyof HTMLElementEventMap>(
+    type: K,
+    listener: (this: Document, ev: HTMLElementEventMap[K]) => unknown,
+    options?: EventListenerOptions | boolean
+  ) => void
+}
+
+/** `document` without the unsafe {@link EventTarget} overloads. */
+interface SanitizedDocumentEventTarget
+  extends Omit<Document, 'addEventListener' | 'body' | 'removeEventListener'> {
+  readonly addEventListener: <K extends keyof DocumentEventMap>(
+    type: K,
+    listener: (this: Document, ev: DocumentEventMap[K]) => unknown,
+    options?: AddEventListenerOptions | boolean
+  ) => void
+  readonly removeEventListener: <K extends keyof DocumentEventMap>(
+    type: K,
+    listener: (this: Document, ev: DocumentEventMap[K]) => unknown,
+    options?: EventListenerOptions | boolean
+  ) => void
+  readonly body: SanitizedHTMLElementEventTarget
+}
+
+// This MUST be lowercase, so that it looks identical to the regular `document`.
+// eslint-disable-next-line no-restricted-syntax
+export const document: SanitizedDocumentEventTarget = globalThis.document
+
+/** `window` without the unsafe {@link EventTarget} overloads. */
+interface SanitizedWindowEventTarget
+  extends Omit<Window, 'addEventListener' | 'removeEventListener'> {
+  readonly addEventListener: <K extends keyof WindowEventMap>(
+    type: K,
+    listener: (this: Document, ev: WindowEventMap[K]) => unknown,
+    options?: AddEventListenerOptions | boolean
+  ) => void
+  readonly removeEventListener: <K extends keyof WindowEventMap>(
+    type: K,
+    listener: (this: Document, ev: WindowEventMap[K]) => unknown,
+    options?: EventListenerOptions | boolean
+  ) => void
+}
+
+// This MUST be lowercase, so that it looks identical to the regular `window`.
+// eslint-disable-next-line no-restricted-syntax
+export const window: SanitizedWindowEventTarget = globalThis.window
diff --git a/app/ide-desktop/lib/dashboard/src/utilities/string.ts b/app/ide-desktop/lib/dashboard/src/utilities/string.ts
index 8746f301966e..dc235221747f 100644
--- a/app/ide-desktop/lib/dashboard/src/utilities/string.ts
+++ b/app/ide-desktop/lib/dashboard/src/utilities/string.ts
@@ -29,3 +29,9 @@ export function isWhitespaceOnly(string: string) {
 export function isPrintableASCIIOnly(string: string) {
   return /^[ -~]*$/.test(string)
 }
+
+/** Inserts spaces between every word, and capitalizes the first word.
+ * DOES NOT make particles lowercase. */
+export function camelCaseToTitleCase(string: string) {
+  return string.replace(/([a-z0-9])([A-Z])/g, '$1 $2').replace(/^./, c => c.toUpperCase())
+}
diff --git a/app/ide-desktop/lib/dashboard/tailwind.config.js b/app/ide-desktop/lib/dashboard/tailwind.config.js
index 44ac5d2fe7ef..1b5ebd128b20 100644
--- a/app/ide-desktop/lib/dashboard/tailwind.config.js
+++ b/app/ide-desktop/lib/dashboard/tailwind.config.js
@@ -115,9 +115,11 @@ export default /** @satisfies {import('tailwindcss').Config} */ ({
         container: '100cqw',
       },
       minWidth: {
+        4: '1rem',
         31.5: '7.875rem',
         32: '8rem',
         33.25: '8.3125rem',
+        36: '9rem',
         40: '10rem',
         61.25: '15.3125rem',
         80: '20rem',