From 7ed392654ae71e01477f0495b18eb710f835fcdc Mon Sep 17 00:00:00 2001
From: 18alantom <2.alan.tom@gmail.com>
Date: Fri, 3 Mar 2023 17:34:12 +0530
Subject: [PATCH 1/2] incr: update ui for link field nav

---
 src/components/Controls/AttachImage.vue  |  2 +-
 src/components/Controls/Attachment.vue   | 12 ++----
 src/components/Controls/AutoComplete.vue | 55 +++++++++++++++++++++++-
 src/components/Controls/Datetime.vue     |  7 +--
 src/components/Controls/Select.vue       |  2 +-
 5 files changed, 60 insertions(+), 18 deletions(-)

diff --git a/src/components/Controls/AttachImage.vue b/src/components/Controls/AttachImage.vue
index 2adf844a..4a1f8ea7 100644
--- a/src/components/Controls/AttachImage.vue
+++ b/src/components/Controls/AttachImage.vue
@@ -50,7 +50,7 @@
       :class="[!isReadOnly ? 'group-hover:flex' : '']"
       style="background: rgba(0, 0, 0, 0.2); backdrop-filter: blur(2px)"
     >
-      <button class="bg-gray-300 p-0.5 rounded mb-1" @click="handleClick">
+      <button class="bg-gray-100 p-0.5 rounded mb-1" @click="handleClick">
         <FeatherIcon
           :name="shouldClear ? 'x' : 'upload'"
           class="w-4 h-4 text-gray-600"
diff --git a/src/components/Controls/Attachment.vue b/src/components/Controls/Attachment.vue
index 87760201..93129b98 100644
--- a/src/components/Controls/Attachment.vue
+++ b/src/components/Controls/Attachment.vue
@@ -21,25 +21,21 @@
       />
 
       <!-- Buttons -->
-      <div class="me-2 flex gap-2">
+      <div class="me-2 flex gap-1">
         <!-- Upload Button -->
-        <button v-if="!value" class="bg-gray-300 p-0.5 rounded" @click="upload">
+        <button v-if="!value" class="p-0.5 rounded" @click="upload">
           <FeatherIcon name="upload" class="h-4 w-4 text-gray-600" />
         </button>
 
         <!-- Download Button -->
-        <button
-          v-if="value"
-          class="bg-gray-300 p-0.5 rounded"
-          @click="download"
-        >
+        <button v-if="value" class="p-0.5 rounded" @click="download">
           <FeatherIcon name="download" class="h-4 w-4 text-gray-600" />
         </button>
 
         <!-- Clear Button -->
         <button
           v-if="value && !isReadOnly"
-          class="bg-gray-300 p-0.5 rounded"
+          class="p-0.5 rounded"
           @click="clear"
         >
           <FeatherIcon name="x" class="h-4 w-4 text-gray-600" />
diff --git a/src/components/Controls/AutoComplete.vue b/src/components/Controls/AutoComplete.vue
index 58bc9e49..d5ac17c4 100644
--- a/src/components/Controls/AutoComplete.vue
+++ b/src/components/Controls/AutoComplete.vue
@@ -35,7 +35,7 @@
           @keydown.esc="toggleDropdown(false)"
         />
         <svg
-          v-if="!isReadOnly"
+          v-if="!isReadOnly && !canLink"
           class="w-3 h-3"
           style="background: inherit; margin-right: -3px"
           viewBox="0 0 5 10"
@@ -45,19 +45,27 @@
           <path
             d="M1 2.636L2.636 1l1.637 1.636M1 7.364L2.636 9l1.637-1.636"
             class="stroke-current"
-            :class="showMandatory ? 'text-red-500' : 'text-gray-500'"
+            :class="showMandatory ? 'text-red-400' : 'text-gray-400'"
             fill="none"
             fill-rule="evenodd"
             stroke-linecap="round"
             stroke-linejoin="round"
           />
         </svg>
+        <button
+          v-if="canLink"
+          class="p-0.5 rounded -me1 bg-transparent"
+          @click="routeToLinkedDoc"
+        >
+          <FeatherIcon name="chevron-right" class="w-4 h-4 text-gray-600" />
+        </button>
       </div>
     </template>
   </Dropdown>
 </template>
 <script>
 import { getOptionList } from 'fyo/utils';
+import { FieldTypeEnum } from 'schemas/types';
 import Dropdown from 'src/components/Dropdown.vue';
 import { fuzzyMatch } from 'src/utils';
 import Base from './Base.vue';
@@ -100,8 +108,51 @@ export default {
 
       return getOptionList(this.df, this.doc);
     },
+    canLink() {
+      if (!this.value || !this.df) {
+        return false;
+      }
+
+      const fieldtype = this.df?.fieldtype;
+      const isLink = fieldtype === FieldTypeEnum.Link;
+      const isDynamicLink = fieldtype === FieldTypeEnum.DynamicLink;
+
+      if (!isLink && !isDynamicLink) {
+        return false;
+      }
+
+      if (isLink && this.df.target) {
+        return true;
+      }
+
+      const references = this.df.references;
+      if (!references) {
+        return false;
+      }
+
+      if (!this.doc?.[references]) {
+        return false;
+      }
+
+      return true;
+    },
   },
   methods: {
+    routeToLinkedDoc() {
+      let schemaName = this.df?.target;
+      const name = this.value;
+
+      if (!schemaName) {
+        const references = this.df?.references ?? '';
+        schemaName = this.doc?.[references];
+      }
+
+      if (!schemaName || !name) {
+        return;
+      }
+
+      console.log(`routing to: ${schemaName}.${name}`);
+    },
     setLinkValue(value) {
       this.linkValue = value;
     },
diff --git a/src/components/Controls/Datetime.vue b/src/components/Controls/Datetime.vue
index e8bacbb1..a479771d 100644
--- a/src/components/Controls/Datetime.vue
+++ b/src/components/Controls/Datetime.vue
@@ -21,12 +21,7 @@
           {{ inputPlaceholder }}
         </p>
 
-        <button
-          v-if="!isReadOnly"
-          class="p-0.5 rounded -me-1 ms-1"
-          :class="showMandatory ? 'bg-red-300' : 'bg-gray-300'"
-          @click="togglePopover"
-        >
+        <button v-if="!isReadOnly" class="p-0.5 rounded -me-1 ms-1">
           <FeatherIcon
             name="calendar"
             class="w-4 h-4"
diff --git a/src/components/Controls/Select.vue b/src/components/Controls/Select.vue
index 67d6b5a2..aa7256d9 100644
--- a/src/components/Controls/Select.vue
+++ b/src/components/Controls/Select.vue
@@ -50,7 +50,7 @@
         <path
           d="M1 2.636L2.636 1l1.637 1.636M1 7.364L2.636 9l1.637-1.636"
           class="stroke-current"
-          :class="showMandatory ? 'text-red-500' : 'text-gray-500'"
+          :class="showMandatory ? 'text-red-400' : 'text-gray-400'"
           fill="none"
           fill-rule="evenodd"
           stroke-linecap="round"

From 539157d12202de4352ca41f3b57e1741771bfb94 Mon Sep 17 00:00:00 2001
From: 18alantom <2.alan.tom@gmail.com>
Date: Fri, 3 Mar 2023 17:50:16 +0530
Subject: [PATCH 2/2] feat: add link navigation - getCreateRoute ->
 getFormRoute - update formRoute listconfig

---
 fyo/model/types.ts                            |  2 +-
 models/baseModels/Item/Item.ts                |  2 +-
 .../baseModels/JournalEntry/JournalEntry.ts   |  2 +-
 models/baseModels/Payment/Payment.ts          |  2 +-
 .../PurchaseInvoice/PurchaseInvoice.ts        |  2 +-
 .../baseModels/SalesInvoice/SalesInvoice.ts   |  2 +-
 models/inventory/PurchaseReceipt.ts           |  2 +-
 models/inventory/Shipment.ts                  |  2 +-
 models/inventory/StockMovement.ts             |  2 +-
 src/components/Controls/AutoComplete.vue      |  6 ++--
 src/components/Widgets/LinkedEntryWidget.vue  |  5 ++--
 src/pages/ListView/ListView.vue               |  4 +--
 src/router.ts                                 | 22 --------------
 src/utils/search.ts                           | 18 ++---------
 src/utils/ui.ts                               | 30 +++++++++++++++++++
 15 files changed, 50 insertions(+), 53 deletions(-)

diff --git a/fyo/model/types.ts b/fyo/model/types.ts
index cb1b08bd..42814452 100644
--- a/fyo/model/types.ts
+++ b/fyo/model/types.ts
@@ -87,7 +87,7 @@ export interface ColumnConfig {
 
 export type ListViewColumn = string | ColumnConfig;
 export interface ListViewSettings {
-  formRoute?: (doc: Doc) => RouteLocationRaw;
+  formRoute?: (name: string) => RouteLocationRaw;
   columns?: ListViewColumn[];
 }
 
diff --git a/models/baseModels/Item/Item.ts b/models/baseModels/Item/Item.ts
index b248476f..61e67796 100644
--- a/models/baseModels/Item/Item.ts
+++ b/models/baseModels/Item/Item.ts
@@ -112,7 +112,7 @@ export class Item extends Doc {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/Item/${name}`,
+      formRoute: (name) => `/edit/Item/${name}`,
       columns: ['name', 'unit', 'tax', 'rate'],
     };
   }
diff --git a/models/baseModels/JournalEntry/JournalEntry.ts b/models/baseModels/JournalEntry/JournalEntry.ts
index 2a844ba3..7241d345 100644
--- a/models/baseModels/JournalEntry/JournalEntry.ts
+++ b/models/baseModels/JournalEntry/JournalEntry.ts
@@ -65,7 +65,7 @@ export class JournalEntry extends Transactional {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/JournalEntry/${name}`,
+      formRoute: (name) => `/edit/JournalEntry/${name}`,
       columns: [
         'name',
         {
diff --git a/models/baseModels/Payment/Payment.ts b/models/baseModels/Payment/Payment.ts
index 176b7e95..3a932387 100644
--- a/models/baseModels/Payment/Payment.ts
+++ b/models/baseModels/Payment/Payment.ts
@@ -617,7 +617,7 @@ export class Payment extends Transactional {
 
   static getListViewSettings(fyo: Fyo): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/Payment/${name}`,
+      formRoute: (name) => `/edit/Payment/${name}`,
       columns: ['name', getDocStatusListColumn(), 'party', 'date', 'amount'],
     };
   }
diff --git a/models/baseModels/PurchaseInvoice/PurchaseInvoice.ts b/models/baseModels/PurchaseInvoice/PurchaseInvoice.ts
index 5a7e64fd..a8a7f8b0 100644
--- a/models/baseModels/PurchaseInvoice/PurchaseInvoice.ts
+++ b/models/baseModels/PurchaseInvoice/PurchaseInvoice.ts
@@ -37,7 +37,7 @@ export class PurchaseInvoice extends Invoice {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/PurchaseInvoice/${name}`,
+      formRoute: (name) => `/edit/PurchaseInvoice/${name}`,
       columns: [
         'name',
         getTransactionStatusColumn(),
diff --git a/models/baseModels/SalesInvoice/SalesInvoice.ts b/models/baseModels/SalesInvoice/SalesInvoice.ts
index 525faaf7..5064887f 100644
--- a/models/baseModels/SalesInvoice/SalesInvoice.ts
+++ b/models/baseModels/SalesInvoice/SalesInvoice.ts
@@ -37,7 +37,7 @@ export class SalesInvoice extends Invoice {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/SalesInvoice/${name}`,
+      formRoute: (name) => `/edit/SalesInvoice/${name}`,
       columns: [
         'name',
         getTransactionStatusColumn(),
diff --git a/models/inventory/PurchaseReceipt.ts b/models/inventory/PurchaseReceipt.ts
index 019c75b4..490e2af5 100644
--- a/models/inventory/PurchaseReceipt.ts
+++ b/models/inventory/PurchaseReceipt.ts
@@ -8,7 +8,7 @@ export class PurchaseReceipt extends StockTransfer {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/PurchaseReceipt/${name}`,
+      formRoute: (name) => `/edit/PurchaseReceipt/${name}`,
       columns: [
         'name',
         getTransactionStatusColumn(),
diff --git a/models/inventory/Shipment.ts b/models/inventory/Shipment.ts
index 20d7baaa..8411601c 100644
--- a/models/inventory/Shipment.ts
+++ b/models/inventory/Shipment.ts
@@ -8,7 +8,7 @@ export class Shipment extends StockTransfer {
 
   static getListViewSettings(): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/Shipment/${name}`,
+      formRoute: (name) => `/edit/Shipment/${name}`,
       columns: [
         'name',
         getTransactionStatusColumn(),
diff --git a/models/inventory/StockMovement.ts b/models/inventory/StockMovement.ts
index 7d05429c..9e203d55 100644
--- a/models/inventory/StockMovement.ts
+++ b/models/inventory/StockMovement.ts
@@ -81,7 +81,7 @@ export class StockMovement extends Transfer {
 
   static getListViewSettings(fyo: Fyo): ListViewSettings {
     return {
-      formRoute: ({ name }) => `/edit/StockMovement/${name}`,
+      formRoute: (name) => `/edit/StockMovement/${name}`,
       columns: [
         'name',
         getDocStatusListColumn(),
diff --git a/src/components/Controls/AutoComplete.vue b/src/components/Controls/AutoComplete.vue
index d5ac17c4..3c6ad2a0 100644
--- a/src/components/Controls/AutoComplete.vue
+++ b/src/components/Controls/AutoComplete.vue
@@ -68,6 +68,7 @@ import { getOptionList } from 'fyo/utils';
 import { FieldTypeEnum } from 'schemas/types';
 import Dropdown from 'src/components/Dropdown.vue';
 import { fuzzyMatch } from 'src/utils';
+import { getFormRoute, routeTo } from 'src/utils/ui';
 import Base from './Base.vue';
 
 export default {
@@ -138,7 +139,7 @@ export default {
     },
   },
   methods: {
-    routeToLinkedDoc() {
+    async routeToLinkedDoc() {
       let schemaName = this.df?.target;
       const name = this.value;
 
@@ -151,7 +152,8 @@ export default {
         return;
       }
 
-      console.log(`routing to: ${schemaName}.${name}`);
+      const route = getFormRoute(schemaName, name);
+      await routeTo(route);
     },
     setLinkValue(value) {
       this.linkValue = value;
diff --git a/src/components/Widgets/LinkedEntryWidget.vue b/src/components/Widgets/LinkedEntryWidget.vue
index 9289eb86..8de7d412 100644
--- a/src/components/Widgets/LinkedEntryWidget.vue
+++ b/src/components/Widgets/LinkedEntryWidget.vue
@@ -55,8 +55,7 @@
 
 <script lang="ts">
 import { Money } from 'pesa';
-import { getCreateRoute } from 'src/router';
-import { routeTo } from 'src/utils/ui';
+import { getFormRoute, routeTo } from 'src/utils/ui';
 import { defineComponent, PropType } from 'vue';
 import Button from '../Button.vue';
 import StatusBadge from '../StatusBadge.vue';
@@ -90,7 +89,7 @@ export default defineComponent({
       return 'Saved';
     },
     async openEntry(name: string) {
-      const route = getCreateRoute(this.linked.schemaName, name);
+      const route = getFormRoute(this.linked.schemaName, name);
       await routeTo(route);
     },
   },
diff --git a/src/pages/ListView/ListView.vue b/src/pages/ListView/ListView.vue
index 7e4fb100..14d5dbea 100644
--- a/src/pages/ListView/ListView.vue
+++ b/src/pages/ListView/ListView.vue
@@ -100,7 +100,7 @@ export default {
       const doc = await this.fyo.doc.getDoc(this.schemaName, name);
 
       if (this.listConfig.formRoute) {
-        return await routeTo(this.listConfig.formRoute(doc));
+        return await routeTo(this.listConfig.formRoute(name));
       }
 
       const { routeFilter } = getRouteData({ doc });
@@ -137,7 +137,7 @@ export default {
       };
 
       if (this.listConfig.formRoute) {
-        path = this.listConfig.formRoute(doc);
+        path = this.listConfig.formRoute(doc.name);
       }
 
       if (typeof path === 'object') {
diff --git a/src/router.ts b/src/router.ts
index 73d4370b..f1baf30f 100644
--- a/src/router.ts
+++ b/src/router.ts
@@ -141,28 +141,6 @@ const routes: RouteRecordRaw[] = [
   },
 ];
 
-export function getCreateRoute(
-  schemaName: string,
-  name: string
-): RouteLocationRaw {
-  if (
-    [
-      ModelNameEnum.SalesInvoice,
-      ModelNameEnum.PurchaseInvoice,
-      ModelNameEnum.JournalEntry,
-      ModelNameEnum.Shipment,
-      ModelNameEnum.PurchaseReceipt,
-      ModelNameEnum.StockMovement,
-      ModelNameEnum.Payment,
-      ModelNameEnum.Item,
-    ].includes(schemaName as ModelNameEnum)
-  ) {
-    return `/edit/${schemaName}/${name}`;
-  }
-
-  return `/list/${schemaName}?edit=1&schemaName=${schemaName}&name=${name}`;
-}
-
 const router = createRouter({ routes, history: createWebHistory() });
 
 export default router;
diff --git a/src/utils/search.ts b/src/utils/search.ts
index 3fc85769..3288acdd 100644
--- a/src/utils/search.ts
+++ b/src/utils/search.ts
@@ -4,13 +4,12 @@ import { groupBy } from 'lodash';
 import { ModelNameEnum } from 'models/types';
 import { reports } from 'reports';
 import { OptionField } from 'schemas/types';
-import { getCreateRoute } from 'src/router';
 import { createFilters, routeFilters } from 'src/utils/filters';
 import { GetAllOptions } from 'utils/db/types';
 import { safeParseFloat } from 'utils/index';
 import { RouteLocationRaw } from 'vue-router';
 import { fuzzyMatch } from '.';
-import { routeTo } from './ui';
+import { getFormRoute, routeTo } from './ui';
 
 export const searchGroups = ['Docs', 'List', 'Create', 'Report', 'Page'];
 enum SearchGroupEnum {
@@ -73,17 +72,6 @@ export function getGroupLabelMap() {
   };
 }
 
-async function openQuickEditDoc(schemaName: string, fyo: Fyo) {
-  await routeTo(`/list/${schemaName}`);
-  const doc = await fyo.doc.getNewDoc(schemaName);
-  const { openQuickEdit } = await import('src/utils/ui');
-
-  await openQuickEdit({
-    schemaName,
-    name: doc.name as string,
-  });
-}
-
 async function openFormEditDoc(schemaName: string, fyo: Fyo) {
   const doc = fyo.doc.getNewDoc(schemaName);
   const name = doc.name;
@@ -735,10 +723,10 @@ export class Search {
   _getRouteFromKeyword(keyword: Keyword): RouteLocationRaw {
     const { parent, parentSchemaName, schemaName } = keyword.meta;
     if (parent && parentSchemaName) {
-      return getCreateRoute(parentSchemaName as string, parent as string);
+      return getFormRoute(parentSchemaName as string, parent as string);
     }
 
-    return getCreateRoute(schemaName as string, keyword.values[0]);
+    return getFormRoute(schemaName as string, keyword.values[0]);
   }
 
   _getGroupedKeywords() {
diff --git a/src/utils/ui.ts b/src/utils/ui.ts
index a0fc5e51..e6423f80 100644
--- a/src/utils/ui.ts
+++ b/src/utils/ui.ts
@@ -420,3 +420,33 @@ export function getFieldsGroupedByTabAndSection(
 
   return grouped;
 }
+
+export function getFormRoute(
+  schemaName: string,
+  name: string
+): RouteLocationRaw {
+  const route = fyo.models[schemaName]
+    ?.getListViewSettings(fyo)
+    ?.formRoute?.(name);
+
+  if (typeof route === 'string') {
+    return route;
+  }
+
+  if (
+    [
+      ModelNameEnum.SalesInvoice,
+      ModelNameEnum.PurchaseInvoice,
+      ModelNameEnum.JournalEntry,
+      ModelNameEnum.Shipment,
+      ModelNameEnum.PurchaseReceipt,
+      ModelNameEnum.StockMovement,
+      ModelNameEnum.Payment,
+      ModelNameEnum.Item,
+    ].includes(schemaName as ModelNameEnum)
+  ) {
+    return `/edit/${schemaName}/${name}`;
+  }
+
+  return `/list/${schemaName}?edit=1&schemaName=${schemaName}&name=${name}`;
+}