From 3bb22b4c106ee7c90160a3c7ce8c8c2919c177fb Mon Sep 17 00:00:00 2001
From: Kaz <kaz@lambdaverse.org>
Date: Tue, 2 Jul 2024 14:22:05 -0700
Subject: [PATCH] Provide backend access to IDE

---
 app/gui2/src/App.vue                               |  7 ++++++-
 app/gui2/src/providers/backend.ts                  | 11 +++++++++++
 .../lib/dashboard/src/layouts/Editor.tsx           | 14 +++++++++++---
 .../lib/dashboard/src/services/Backend.ts          |  1 +
 app/ide-desktop/lib/types/types.d.ts               |  3 +++
 5 files changed, 32 insertions(+), 4 deletions(-)
 create mode 100644 app/gui2/src/providers/backend.ts

diff --git a/app/gui2/src/App.vue b/app/gui2/src/App.vue
index 2500c182b95d..0139465984a6 100644
--- a/app/gui2/src/App.vue
+++ b/app/gui2/src/App.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
 import HelpScreen from '@/components/HelpScreen.vue'
 import { provideAppClassSet } from '@/providers/appClass'
+import { provideBackend } from '@/providers/backend'
 import { provideEventLogger } from '@/providers/eventLogging'
 import { provideGuiConfig } from '@/providers/guiConfig'
 import { registerAutoBlurHandler } from '@/util/autoBlur'
@@ -13,7 +14,8 @@ import {
 } from '@/util/config'
 import ProjectView from '@/views/ProjectView.vue'
 import { useEventListener } from '@vueuse/core'
-import { computed, toRef, watch } from 'vue'
+import Backend from 'enso-common/src/services/Backend'
+import { computed, markRaw, toRaw, toRef, watch } from 'vue'
 import TooltipDisplayer from './components/TooltipDisplayer.vue'
 import { provideTooltipRegistry } from './providers/tooltipState'
 import { initializePrefixes } from './util/ast/node'
@@ -26,8 +28,11 @@ const props = defineProps<{
   hidden: boolean
   ignoreParamsRegex?: RegExp
   renameProject: (newName: string) => void
+  backend: Backend
 }>()
 
+provideBackend(() => markRaw(toRaw(props.backend)))
+
 const classSet = provideAppClassSet()
 const appTooltips = provideTooltipRegistry()
 
diff --git a/app/gui2/src/providers/backend.ts b/app/gui2/src/providers/backend.ts
new file mode 100644
index 000000000000..f40e5ffb1a19
--- /dev/null
+++ b/app/gui2/src/providers/backend.ts
@@ -0,0 +1,11 @@
+import { createContextStore } from '@/providers'
+import type { ToValue } from '@/util/reactivity'
+import type Backend from 'enso-common/src/services/Backend'
+import { computed, proxyRefs, toValue } from 'vue'
+
+export { injectFn as injectBackend, provideFn as provideBackend }
+const { provideFn, injectFn } = createContextStore('backend', (backend: ToValue<Backend>) =>
+  proxyRefs({
+    backend: computed(() => toValue(backend)),
+  }),
+)
diff --git a/app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx b/app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx
index a1031a3ccbc9..569073886420 100644
--- a/app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx
+++ b/app/ide-desktop/lib/dashboard/src/layouts/Editor.tsx
@@ -96,8 +96,8 @@ function EditorInternal(props: EditorInternalProps) {
     [remoteBackend]
   )
 
-  const renameProject = React.useCallback(
-    (newName: string) => {
+  const backend = React.useMemo(
+    () => {
       let backend: Backend | null
       switch (projectStartupInfo.backendType) {
         case backendModule.BackendType.local:
@@ -107,6 +107,12 @@ function EditorInternal(props: EditorInternalProps) {
           backend = remoteBackend
           break
       }
+      return backend
+    }, [localBackend, remoteBackend, projectStartupInfo.backendType]
+  )
+
+  const renameProject = React.useCallback(
+    (newName: string) => {
       const { id: projectId, parentId, title } = projectStartupInfo.projectAsset
       backend
         ?.updateProject(
@@ -121,7 +127,7 @@ function EditorInternal(props: EditorInternalProps) {
           e => toastAndLog('renameProjectError', e)
         )
     },
-    [remoteBackend, localBackend, projectStartupInfo, toastAndLog]
+    [backend, projectStartupInfo.projectAsset, toastAndLog]
   )
 
   React.useEffect(() => {
@@ -162,6 +168,7 @@ function EditorInternal(props: EditorInternalProps) {
         ignoreParamsRegex: IGNORE_PARAMS_REGEX,
         logEvent,
         renameProject,
+        backend,
       }
     }
   }, [
@@ -175,6 +182,7 @@ function EditorInternal(props: EditorInternalProps) {
     hidden,
     logEvent,
     renameProject,
+    backend,
   ])
 
   if (AppRunner == null) {
diff --git a/app/ide-desktop/lib/dashboard/src/services/Backend.ts b/app/ide-desktop/lib/dashboard/src/services/Backend.ts
index c2e175afe617..2e5973911d70 100644
--- a/app/ide-desktop/lib/dashboard/src/services/Backend.ts
+++ b/app/ide-desktop/lib/dashboard/src/services/Backend.ts
@@ -1,6 +1,7 @@
 import type * as React from 'react'
 import * as backend from 'enso-common/src/services/Backend'
 import Backend from 'enso-common/src/services/Backend'
+
 export * from 'enso-common/src/services/Backend'
 export default Backend
 
diff --git a/app/ide-desktop/lib/types/types.d.ts b/app/ide-desktop/lib/types/types.d.ts
index ff56ba97ad75..d383db3d8211 100644
--- a/app/ide-desktop/lib/types/types.d.ts
+++ b/app/ide-desktop/lib/types/types.d.ts
@@ -1,6 +1,8 @@
 /** @file Interfaces common to multiple modules. */
 import type * as React from 'react'
 
+import type Backend from 'enso-common/src/services/Backend'
+
 // ======================================
 // === Globally accessible interfaces ===
 // ======================================
@@ -22,6 +24,7 @@ interface EditorProps {
         metadata?: object | null
     ) => void
     readonly renameProject: (newName: string) => void
+    readonly backend: Backend | null
 }
 
 /** The value passed from the entrypoint to the dashboard, which enables the dashboard to