From 079ba1ffce7a85c860a32137ec1fe4321e110a4d Mon Sep 17 00:00:00 2001
From: Michael Shanks <mike@budibase.com>
Date: Mon, 12 Oct 2020 14:48:30 +0100
Subject: [PATCH] Settings >URL select handles Record detail urls

---
 .../builderStore/fetchBindableProperties.js   |  2 +
 .../userInterface/ScreenSelect.svelte         | 68 ++++++++++++++++++-
 .../userInterface/temporaryPanelStructure.js  |  6 +-
 3 files changed, 70 insertions(+), 6 deletions(-)

diff --git a/packages/builder/src/builderStore/fetchBindableProperties.js b/packages/builder/src/builderStore/fetchBindableProperties.js
index 92359ae630..fbb3b1b30c 100644
--- a/packages/builder/src/builderStore/fetchBindableProperties.js
+++ b/packages/builder/src/builderStore/fetchBindableProperties.js
@@ -90,6 +90,8 @@ const contextToBindables = (models, walkResult) => context => {
     runtimeBinding: `${contextParentPath}data.${key}`,
     // how the binding exressions looks to the user of the builder
     readableBinding: `${context.instance._instanceName}.${model.name}.${key}`,
+    // model / view info
+    model: context.model,
   })
 
   // see ModelViewSelect.svelte for the format of context.model
diff --git a/packages/builder/src/components/userInterface/ScreenSelect.svelte b/packages/builder/src/components/userInterface/ScreenSelect.svelte
index 412f0719fc..baff9a782b 100644
--- a/packages/builder/src/components/userInterface/ScreenSelect.svelte
+++ b/packages/builder/src/components/userInterface/ScreenSelect.svelte
@@ -1,18 +1,80 @@
 <script>
   import { DataList } from "@budibase/bbui"
   import { createEventDispatcher } from "svelte"
-  import { store } from "builderStore"
+  import { store, backendUiStore } from "builderStore"
+  import fetchBindableProperties from "builderStore/fetchBindableProperties"
 
   const dispatch = createEventDispatcher()
 
   export let value = ""
 
+  $: urls = getUrls()
+
   const handleBlur = () => dispatch("change", value)
+
+  // this will get urls of all screens, but only
+  // choose detail screens that are usable in the current context
+  // and substitute the :id param for the actual {{ ._id }} binding
+  const getUrls = () => {
+    const urls = [
+      ...$store.screens
+        .filter(screen => !screen.props._component.endsWith("/rowdetail"))
+        .map(screen => ({
+          name: screen.props._instanceName,
+          url: screen.route,
+          sort: screen.props._component,
+        })),
+    ]
+
+    const bindableProperties = fetchBindableProperties({
+      componentInstanceId: $store.currentComponentInfo._id,
+      components: $store.components,
+      screen: $store.currentPreviewItem,
+      models: $backendUiStore.models,
+    })
+
+    const idBindingForModel = modelId => {
+      for (let bindableProp of bindableProperties) {
+      }
+    }
+
+    const detailScreens = $store.screens.filter(screen =>
+      screen.props._component.endsWith("/rowdetail")
+    )
+
+    for (let detailScreen of detailScreens) {
+      const idBinding = bindableProperties.find(p => {
+        if (
+          p.type === "context" &&
+          p.runtimeBinding.endsWith("._id") &&
+          p.model
+        ) {
+          const modelId =
+            typeof p.model === "string" ? p.model : p.model.modelId
+          return modelId === detailScreen.props.model
+        }
+        return false
+      })
+
+      if (idBinding) {
+        urls.push({
+          name: detailScreen.props._instanceName,
+          url: detailScreen.route.replace(
+            ":id",
+            `{{ ${idBinding.runtimeBinding} }}`
+          ),
+          sort: detailScreen.props._component,
+        })
+      }
+
+      return urls
+    }
+  }
 </script>
 
 <DataList editable secondary on:blur={handleBlur} on:change bind:value>
   <option value="" />
-  {#each $store.allScreens as screen}
-    <option value={screen.route}>{screen.props._instanceName}</option>
+  {#each urls as url}
+    <option value={url.url}>{url.name}</option>
   {/each}
 </DataList>
diff --git a/packages/builder/src/components/userInterface/temporaryPanelStructure.js b/packages/builder/src/components/userInterface/temporaryPanelStructure.js
index 3f853efcfb..b628e86e2e 100644
--- a/packages/builder/src/components/userInterface/temporaryPanelStructure.js
+++ b/packages/builder/src/components/userInterface/temporaryPanelStructure.js
@@ -356,7 +356,7 @@ export default {
               {
                 label: "destinationUrl",
                 key: "destinationUrl",
-                control: Input,
+                control: ScreenSelect,
                 placeholder: "/table/_id",
               },
             ],
@@ -405,7 +405,7 @@ export default {
                   {
                     label: "Link Url",
                     key: "linkUrl",
-                    control: Input,
+                    control: ScreenSelect,
                     placeholder: "Link URL",
                   },
                   {
@@ -480,7 +480,7 @@ export default {
                   {
                     label: "Link Url",
                     key: "linkUrl",
-                    control: Input,
+                    control: ScreenSelect,
                     placeholder: "Link URL",
                   },
                   {