WIP easter egg feature for geodata

packages/nc-gui/components.d.ts

@@ -189,6 +189,7 @@ declare module '@vue/runtime-core' {
     MdiLogin: typeof import('~icons/mdi/login')['default']
     MdiLogout: typeof import('~icons/mdi/logout')['default']
     MdiMagnify: typeof import('~icons/mdi/magnify')['default']
+    MdiMapMarker: typeof import('~icons/mdi/map-marker')['default']
     MdiMenu: typeof import('~icons/mdi/menu')['default']
     MdiMenuDown: typeof import('~icons/mdi/menu-down')['default']
     MdiMicrosoftTeams: typeof import('~icons/mdi/microsoft-teams')['default']

packages/nc-gui/components/cell/GeoData.vue

@@ -29,91 +29,6 @@ let isExpanded = $ref(false)
 
 let isLoading = $ref(false)
 
-// const localValue = computed<string | Record<string, any> | undefined>({
-//   get: () => localValueState.value,
-//   set: (val: undefined | string | Record<string, any>) => {
-//     localValueState.value = typeof val === 'object' ? JSON.stringify(val, null, 2) : val
-//     /** if form and not expanded then sync directly */
-//     if (isForm.value && !isExpanded) {
-//       vModel.value = val
-//     }
-//   },
-// })
-
-// const isPopupOpen = ref(false)
-// const showPopup = () => (isPopupOpen.value = true)
-
-// const latitudeInput = ref(String(vModel?.value?.latitude) || '')
-// const longitudeInput = ref(String(vModel?.value?.latitude) || '')
-
-// const onSubmit = () => {
-//   if (latitudeInput == null || longitudeInput == null) {
-//     console.error("Tried to submit a GeoLocation where latitude or longitude value wasn't provicde")
-//     return
-//   }
-//   emits('update:modelValue', {
-//     latitude: Number.parseFloat(latitudeInput.value),
-//     longitude: Number.parseFloat(longitudeInput.value),
-//   })
-// }
-
-// const onAbort = () => alert('ABORT!')
-
-// const isOpen = ref(false)
-
-// const visible = ref<boolean>(false)
-
-// const readOnly = inject(ReadonlyInj)!
-
-// const focus: VNodeRef = (el) => (el as HTMLInputElement)?.focus()
-
-// function onKeyDown(evt: KeyboardEvent) {
-//   return evt.key === '.' && evt.preventDefault()
-// }
-
-// const visibleMenu = ref(false)
-
-// const toggleVisbility = () => {
-//   visible.value = !visible.value
-// }
-
-// const latitude = computed(() => {
-
-// })
-// const onSave = () => {
-//   isExpanded = false
-
-//   editEnabled.value = false
-
-//   // localValue.value = localValue ? formatJson(localValue.value as string) : localValue
-
-//   // vModel.value = localValue.value
-// }
-
-// watch(
-//   vModel,
-//   (val) => {
-//     localValue.value = val
-//   },
-//   { immediate: true },
-// )
-
-// watch(localValue, (val) => {
-//   try {
-//     JSON.parse(val as string)
-
-//     error = undefined
-//   } catch (e: any) {
-//     error = e
-//   }
-// })
-
-// watch(editEnabled, () => {
-//   isExpanded = false
-
-//   localValue.value = vModel.valuec
-// })
-
 const [latitude, longitude] = (vModel.value || '').split(';')
 
 const latLongStr = computed(() => {

packages/nc-gui/components/smartsheet/sidebar/MenuBottom.vue

@@ -1,6 +1,6 @@
 <script lang="ts" setup>
 import { ViewTypes } from 'nocodb-sdk'
-import { IsGeodataActiveInj, ref, useNuxtApp, useSmartsheetStoreOrThrow, viewIcons } from '#imports'
+import { IsGeodataActiveInj, ReadonlyInj, ref, useNuxtApp, useSmartsheetStoreOrThrow, viewIcons } from '#imports'
 
 const isGeodataActive = inject(IsGeodataActiveInj, ref(false))
 
@@ -10,6 +10,8 @@ interface Emits {
 
 const emits = defineEmits<Emits>()
 
+const readOnly = inject(ReadonlyInj)
+
 const { $e } = useNuxtApp()
 
 const { isSqlView } = useSmartsheetStoreOrThrow()
@@ -116,8 +118,9 @@ function onOpenModal(type: ViewTypes, title = '') {
         </a-tooltip>
       </a-menu-item>
 
+      isGeodataActive: {{ isGeodataActive }} readOnly: {{ readOnly }}
       <a-menu-item
-        v-if="isGeodataActive"
+        v-if="readOnly"
         key="map"
         class="group !flex !items-center !my-0 !h-2.5rem nc-create-map-view"
         @click="onOpenModal(ViewTypes.MAP)"

packages/nc-gui/components/smartsheet/sidebar/toolbar/GeodataSwitcher.vue

@@ -0,0 +1,29 @@
+<script setup lang="ts">
+import { IsGeodataActiveInj, inject, provide } from '#imports'
+
+// const { t } = useI18n()
+
+// const { api } = useApi()
+const GeoDataToggleRef = ref(false)
+// provide(IsGeodataActiveInj, GeoDataToggleRef)
+provide(ReadonlyInj, GeoDataToggleRef)
+
+async function toggleGeodataFeature() {
+  GeoDataToggleRef.value = !GeoDataToggleRef.value
+  console.log(GeoDataToggleRef.value)
+}
+
+// watch(FOO?.value, () => {
+//   console.log('FOO FOO?.value', FOO?.value)
+// })
+</script>
+
+<template>
+  <a-tooltip placement="bottomRight">
+    <template #title>
+      <span> Toggle GeoData </span>
+    </template>
+    <div style="{{fontSize: '5px';}}">I: {{ GeoDataToggleRef }}</div>
+    <mdi-map-marker class="cursor-pointer" @click="toggleGeodataFeature" />
+  </a-tooltip>
+</template>

packages/nc-gui/components/smartsheet/sidebar/toolbar/index.vue

@@ -29,6 +29,10 @@ const onClick = () => {
       <LazySmartsheetSidebarToolbarDebugMeta />
 
       <div class="dot" />
+
+      <LazySmartsheetSidebarToolbarGeodataSwitcher />
+
+      <div class="dot" />
     </template>
 
     <slot name="end" />