From 58f8818af8c2007083e6e0b62c21c95787a73982 Mon Sep 17 00:00:00 2001
From: flisowna <ewa.agnieszka.flis@gmail.com>
Date: Fri, 6 Jan 2023 17:38:10 +0100
Subject: [PATCH] add share view to map view

---
 .../nc-gui/components/shared-view/Map.vue     | 42 +++++++++++++++++
 .../nc-gui/components/smartsheet/Toolbar.vue  |  4 +-
 .../smartsheet/toolbar/ShareView.vue          |  9 +++-
 .../smartsheet/toolbar/SharedViewList.vue     |  3 ++
 .../nc-gui/composables/useMapViewDataStore.ts | 47 ++++++++++++-------
 .../[projectType]/map/[viewId]/index.vue      | 35 ++++++++++++++
 6 files changed, 121 insertions(+), 19 deletions(-)
 create mode 100644 packages/nc-gui/components/shared-view/Map.vue
 create mode 100644 packages/nc-gui/pages/[projectType]/map/[viewId]/index.vue

diff --git a/packages/nc-gui/components/shared-view/Map.vue b/packages/nc-gui/components/shared-view/Map.vue
new file mode 100644
index 0000000000..ae2c69aa27
--- /dev/null
+++ b/packages/nc-gui/components/shared-view/Map.vue
@@ -0,0 +1,42 @@
+<script setup lang="ts">
+import {
+  ActiveViewInj,
+  FieldsInj,
+  IsPublicInj,
+  MetaInj,
+  ReadonlyInj,
+  ReloadViewDataHookInj,
+  useProvideMapViewStore,
+} from '#imports'
+
+const { sharedView, meta, sorts, nestedFilters } = useSharedView()
+
+const reloadEventHook = createEventHook()
+
+provide(ReloadViewDataHookInj, reloadEventHook)
+
+provide(ReadonlyInj, ref(true))
+
+provide(MetaInj, meta)
+
+provide(ActiveViewInj, sharedView)
+
+provide(FieldsInj, ref(meta.value?.columns || []))
+
+provide(IsPublicInj, ref(true))
+
+useProvideSmartsheetStore(sharedView, meta, true, sorts, nestedFilters)
+
+useProvideMapViewStore(meta, sharedView, true)
+</script>
+
+<template>
+  <div class="nc-container h-full mt-1.5 px-12">
+    <div class="flex flex-col h-full flex-1 min-w-0">
+      <LazySmartsheetToolbar />
+      <div class="h-full flex-1 min-w-0 min-h-0 bg-gray-50">
+        <LazySmartsheetMap />
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/packages/nc-gui/components/smartsheet/Toolbar.vue b/packages/nc-gui/components/smartsheet/Toolbar.vue
index 6c121d054d..0a6060fa7d 100644
--- a/packages/nc-gui/components/smartsheet/Toolbar.vue
+++ b/packages/nc-gui/components/smartsheet/Toolbar.vue
@@ -35,9 +35,9 @@ const { allowCSVDownload } = useSharedView()
 
     <LazySmartsheetToolbarColumnFilterMenu v-if="isGrid || isGallery || isKanban || isMap" />
 
-    <LazySmartsheetToolbarSortListMenu v-if="isGrid || isGallery || isKanban" />
+    <LazySmartsheetToolbarSortListMenu v-if="isGrid || isGallery || isKanban || isMap" />
 
-    <LazySmartsheetToolbarShareView v-if="(isForm || isGrid || isKanban || isGallery) && !isPublic" />
+    <LazySmartsheetToolbarShareView v-if="(isForm || isGrid || isKanban || isGallery || isMap) && !isPublic" />
 
     <LazySmartsheetToolbarExport v-if="(!isPublic && !isUIAllowed('dataInsert')) || (isPublic && allowCSVDownload)" />
     <div class="flex-1" />
diff --git a/packages/nc-gui/components/smartsheet/toolbar/ShareView.vue b/packages/nc-gui/components/smartsheet/toolbar/ShareView.vue
index 36805106e5..641e016ee2 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/ShareView.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/ShareView.vue
@@ -109,6 +109,9 @@ const sharedViewUrl = computed(() => {
     case ViewTypes.GALLERY:
       viewType = 'gallery'
       break
+    case ViewTypes.MAP:
+      viewType = 'map'
+      break
     default:
       viewType = 'view'
   }
@@ -334,7 +337,11 @@ const copyIframeCode = async () => {
 
           <div
             v-if="
-              shared && (shared.type === ViewTypes.GRID || shared.type === ViewTypes.KANBAN || shared.type === ViewTypes.GALLERY)
+              shared &&
+              (shared.type === ViewTypes.GRID ||
+                shared.type === ViewTypes.KANBAN ||
+                shared.type === ViewTypes.GALLERY ||
+                shared.type === ViewTypes.MAP)
             "
           >
             <!-- Allow Download -->
diff --git a/packages/nc-gui/components/smartsheet/toolbar/SharedViewList.vue b/packages/nc-gui/components/smartsheet/toolbar/SharedViewList.vue
index e1886b2816..0b5e82e8e5 100644
--- a/packages/nc-gui/components/smartsheet/toolbar/SharedViewList.vue
+++ b/packages/nc-gui/components/smartsheet/toolbar/SharedViewList.vue
@@ -56,6 +56,9 @@ const sharedViewUrl = (view: SharedViewType) => {
     case ViewTypes.FORM:
       viewType = 'form'
       break
+    case ViewTypes.MAP:
+      viewType = 'map'
+      break
     case ViewTypes.KANBAN:
       viewType = 'kanban'
       break
diff --git a/packages/nc-gui/composables/useMapViewDataStore.ts b/packages/nc-gui/composables/useMapViewDataStore.ts
index 08e0ff82c9..ab4f6f6840 100644
--- a/packages/nc-gui/composables/useMapViewDataStore.ts
+++ b/packages/nc-gui/composables/useMapViewDataStore.ts
@@ -1,7 +1,7 @@
 import { reactive } from 'vue'
 import type { ComputedRef, Ref } from 'vue'
 import type { ColumnType, MapType, PaginatedType, TableType, ViewType } from 'nocodb-sdk'
-import { ref, useInjectionState, useMetas } from '#imports'
+import { IsPublicInj, ref, useInjectionState, useMetas, useProject } from '#imports'
 import type { Row } from '~/lib'
 
 export const geodataToggleState = reactive({ show: false })
@@ -19,14 +19,26 @@ const [useProvideMapViewStore, useMapViewStore] = useInjectionState(
     viewMeta: Ref<ViewType | MapType | undefined> | ComputedRef<(ViewType & { id: string }) | undefined>,
     where?: ComputedRef<string | undefined>,
   ) => {
+    if (!meta) {
+      throw new Error('Table meta is not available')
+    }
+
     const formattedData = ref<Row[]>([])
 
     const { api } = useApi()
+
     const { project } = useProject()
+
     const { $api } = useNuxtApp()
 
     const { isUIAllowed } = useUIPermission()
 
+    const isPublic = inject(IsPublicInj, ref(false))
+
+    const { sorts, nestedFilters } = useSmartsheetStoreOrThrow()
+
+    const { fetchSharedViewData } = useSharedView()
+
     const mapMetaData = ref<MapType>({})
 
     const geoDataFieldColumn = ref<ColumnType | undefined>()
@@ -41,13 +53,15 @@ const [useProvideMapViewStore, useMapViewStore] = useInjectionState(
     }))
 
     async function syncCount() {
-      const { count } = await $api.dbViewRow.count(
-        NOCO,
-        project?.value?.title as string,
-        meta?.value?.id as string,
-        viewMeta?.value?.id as string,
-      )
-      paginationData.value.totalRows = count
+      if (!isPublic) {
+        const { count } = await $api.dbViewRow.count(
+          NOCO,
+          project?.value?.title as string,
+          meta?.value?.id as string,
+          viewMeta?.value?.id as string,
+        )
+        paginationData.value.totalRows = count
+      }
     }
 
     async function loadMapMeta() {
@@ -58,14 +72,15 @@ const [useProvideMapViewStore, useMapViewStore] = useInjectionState(
     }
 
     async function loadMapData() {
-      if (!viewMeta?.value?.id || !meta?.value?.columns) return
-
-      const res = await api.dbViewRow.list('noco', project.value.id!, meta.value!.id!, viewMeta.value!.id!, {
-        ...queryParams.value,
-        where: where?.value,
-      })
-
-      // syncCount()
+      if ((!project?.value?.id || !meta.value?.id || !viewMeta.value?.id) && !isPublic.value) return
+
+      const res = !isPublic.value
+        ? await api.dbViewRow.list('noco', project.value.id!, meta.value!.id!, viewMeta.value!.id!, {
+            ...queryParams.value,
+            ...(isUIAllowed('filterSync') ? {} : { filterArrJson: JSON.stringify(nestedFilters.value) }),
+            where: where?.value,
+          })
+        : await fetchSharedViewData({ sortsArr: sorts.value, filtersArr: nestedFilters.value })
 
       formattedData.value = formatData(res.list)
     }
diff --git a/packages/nc-gui/pages/[projectType]/map/[viewId]/index.vue b/packages/nc-gui/pages/[projectType]/map/[viewId]/index.vue
new file mode 100644
index 0000000000..70f6791da4
--- /dev/null
+++ b/packages/nc-gui/pages/[projectType]/map/[viewId]/index.vue
@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { message } from 'ant-design-vue'
+import { definePageMeta } from '#imports'
+
+definePageMeta({
+  public: true,
+  requiresAuth: false,
+  layout: 'shared-view',
+})
+
+const route = useRoute()
+
+const { loadSharedView } = useSharedView()
+
+const showPassword = ref(false)
+
+try {
+  await loadSharedView(route.params.viewId as string)
+} catch (e: any) {
+  if (e?.response?.status === 403) {
+    showPassword.value = true
+  } else {
+    message.error(await extractSdkResponseErrorMsg(e))
+  }
+}
+</script>
+
+<template>
+  <NuxtLayout class="flex" name="shared-view">
+    <div v-if="showPassword">
+      <LazySharedViewAskPassword v-model="showPassword" />
+    </div>
+    <LazySharedViewMap v-else />
+  </NuxtLayout>
+</template>