feat(nc-gui): shared view + bases fixes

packages/nc-gui/components/shared-view/Calendar.vue

@@ -0,0 +1,48 @@
+<script lang="ts" setup>
+import {
+  ActiveViewInj,
+  FieldsInj,
+  IsPublicInj,
+  MetaInj,
+  ReadonlyInj,
+  ReloadViewDataHookInj,
+  useProvideCalendarViewStore,
+  useProvideKanbanViewStore,
+} from '#imports'
+
+const { sharedView, meta, 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))
+
+useProvideViewColumns(sharedView, meta, () => reloadEventHook?.trigger(), true)
+
+useProvideSmartsheetStore(sharedView, meta, true, ref([]), nestedFilters)
+useProvideKanbanViewStore(meta, sharedView)
+
+useProvideCalendarViewStore(meta, sharedView, true, nestedFilters)
+</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">
+        <LazySmartsheetCalendar />
+      </div>
+    </div>
+  </div>
+</template>
+
+<style lang="scss" scoped></style>

packages/nc-gui/components/shared-view/Gallery.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import {
   ActiveViewInj,
   FieldsInj,

packages/nc-gui/components/shared-view/Grid.vue

@@ -1,4 +1,4 @@
-<script setup lang="ts">
+<script lang="ts" setup>
 import {
   ActiveViewInj,
   FieldsInj,
@@ -26,6 +26,7 @@ const { loadProject } = useBase()
 const { isLocked } = useProvideSmartsheetStore(sharedView, meta, true, ref([]), nestedFilters)
 
 useProvideKanbanViewStore(meta, sharedView)
+useProvideCalendarViewStore(meta, sharedView)
 
 const reloadEventHook = createEventHook()
 

packages/nc-gui/components/smartsheet/calendar/index.vue

@@ -17,7 +17,6 @@ import {
   provide,
   ref,
   rowDefaultData,
-  useI18n,
 } from '#imports'
 
 const meta = inject(MetaInj, ref())
@@ -57,6 +56,8 @@ const showSideMenu = ref(true)
 
 const calendarRangeDropdown = ref(false)
 
+const isPublic = inject(IsPublicInj, ref(false))
+
 const router = useRouter()
 const route = useRoute()
 
@@ -79,7 +80,7 @@ const expandedFormDlg = ref(false)
 const expandedFormRow = ref<RowType>()
 const expandedFormRowState = ref<Record<string, any>>()
 
-const expandRecord = (row: RowType) => {
+const expandRecord = (row: RowType, state?: Record<string, any>) => {
   const rowId = extractPkFromRow(row.row, meta.value!.columns!)
 
   if (rowId) {
@@ -91,6 +92,7 @@ const expandRecord = (row: RowType) => {
     })
   } else {
     expandedFormRow.value = row
+    expandedFormRowState.value = state
     expandedFormDlg.value = true
   }
 }

packages/nc-gui/components/smartsheet/toolbar/CalendarMode.vue

@@ -57,6 +57,6 @@ onMounted(() => {
 }
 
 .nc-calendar-mode-tab {
-  @apply -ml-120 relative;
+  @apply mr-120 relative;
 }
 </style>

packages/nc-gui/composables/useCalendarViewStore.ts

@@ -35,6 +35,8 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
 
     const pageDate = ref<Date>(new Date())
 
+    const { isUIAllowed } = useRoles()
+
     const displayField = ref<ColumnType>()
 
     const activeCalendarView = ref<'month' | 'year' | 'day' | 'week'>()
@@ -80,8 +82,6 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
 
     const { addUndo, clone, defineViewScope } = useUndoRedo()
 
-    const { isUIAllowed } = useRoles()
-
     const isPublic = ref(shared) || inject(IsPublicInj, ref(false))
 
     const { sorts, nestedFilters } = useSmartsheetStoreOrThrow()
@@ -313,7 +313,7 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
           : await fetchSharedViewData({
               ...params,
               sortsArr: sorts.value,
-              filtersArr: [nestedFilters.value, ...sideBarFilter.value],
+              filtersArr: sideBarFilter.value,
               offset: params.offset,
               where: where?.value ?? '',
             })
@@ -522,13 +522,13 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
               : { filterArrJson: JSON.stringify([nestedFilters.value, ...filterJSON.value]) }),
             where: where?.value ?? '',
           })
-        : await fetchSharedViewData({ sortsArr: sorts.value, filtersArr: [nestedFilters.value, ...filterJSON.value] })
+        : await fetchSharedViewData({ sortsArr: sorts.value, filtersArr: filterJSON.value })
       formattedData.value = formatData(res!.list)
       isCalendarDataLoading.value = false
     }
 
     async function updateCalendarMeta(updateObj: Partial<CalendarType>) {
-      if (!viewMeta?.value?.id || !isUIAllowed('dataEdit')) return
+      if (!viewMeta?.value?.id || !isUIAllowed('dataEdit') || isPublic.value) return
       try {
         await $api.dbView.calendarUpdate(viewMeta.value.id, updateObj)
         calendarMetaData.value = {
@@ -595,12 +595,14 @@ const [useProvideCalendarViewStore, useCalendarViewStore] = useInjectionState(
     const loadSidebarData = async () => {
       if (!base?.value?.id || !meta.value?.id || !viewMeta.value?.id) return
       isSidebarLoading.value = true
-      const res = await api.dbViewRow.list('noco', base.value.id!, meta.value!.id!, viewMeta.value.id, {
-        ...queryParams.value,
-        ...{},
-        ...{},
-        ...{ filterArrJson: JSON.stringify([...sideBarFilter.value]) },
-      })
+      const res = !isPublic.value
+        ? await api.dbViewRow.list('noco', base.value.id!, meta.value!.id!, viewMeta.value.id, {
+            ...queryParams.value,
+            ...{},
+            ...{},
+            ...{ filterArrJson: JSON.stringify([...sideBarFilter.value]) },
+          })
+        : await fetchSharedViewData({ sortsArr: sorts.value, filtersArr: filterJSON.value })
 
       formattedSideBarData.value = formatData(res!.list)
       isSidebarLoading.value = false

packages/nc-gui/composables/useSharedView.ts

@@ -1,4 +1,5 @@
 import type {
+  CalendarType,
   ExportTypes,
   FilterType,
   KanbanType,
@@ -42,7 +43,7 @@ export function useSharedView() {
 
   const allowCSVDownload = useState<boolean>('allowCSVDownload', () => false)
 
-  const meta = useState<TableType | KanbanType | MapType | undefined>('meta', () => undefined)
+  const meta = useState<TableType | KanbanType | MapType | CalendarType | undefined>('meta', () => undefined)
 
   const formColumns = computed(
     () =>

packages/nc-gui/pages/index/[typeOrId]/calendar/[viewId]/index.vue

@@ -0,0 +1,34 @@
+<script lang="ts" setup>
+import { message } from 'ant-design-vue'
+import { definePageMeta } from '#imports'
+
+definePageMeta({
+  public: true,
+  requiresAuth: false,
+  layout: 'shared-view',
+  hasSidebar: false,
+})
+
+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>
+  <div v-if="showPassword">
+    <LazySharedViewAskPassword v-model="showPassword" />
+  </div>
+  <LazySharedViewCalendar v-else />
+</template>

packages/nocodb/src/controllers/calendars.controller.ts

@@ -14,6 +14,7 @@ import { ViewCreateReqType } from 'nocodb-sdk';
 import { GlobalGuard } from '~/guards/global/global.guard';
 import { CalendarsService } from '~/services/calendars.service';
 import { MetaApiLimiterGuard } from '~/guards/meta-api-limiter.guard';
+import { Acl } from '~/middlewares/extract-ids/extract-ids.middleware';
 
 @Controller()
 @UseGuards(MetaApiLimiterGuard, GlobalGuard)
@@ -24,6 +25,7 @@ export class CalendarsController {
     '/api/v1/db/meta/calendars/:calendarViewId',
     '/api/v2/meta/calendars/:calendarViewId',
   ])
+  // #TODO Enable ACL Later
   // @Acl('calendarViewGet')
   async calendarViewGet(@Param('calendarViewId') calendarViewId: string) {
     return await this.calendarsService.calendarViewGet({
@@ -36,6 +38,7 @@ export class CalendarsController {
     '/api/v2/meta/tables/:tableId/calendars',
   ])
   @HttpCode(200)
+  // #TODO Enable ACL Later
   // @Acl('calendarViewCreate')
   async calendarViewCreate(
     @Param('tableId') tableId: string,

packages/nocodb/src/meta/migrations/v2/nc_041_calander_view.ts

@@ -49,6 +49,8 @@ const up = async (knex: Knex) => {
 
     table.string('fk_to_column_id', 20);
 
+    table.string('label', 20);
+
     table.string('fk_from_column_id', 20);
 
     table.timestamps(true, true);

packages/nocodb/src/services/public-datas.service.ts

@@ -36,7 +36,8 @@ export class PublicDatasService {
       view.type !== ViewTypes.GRID &&
       view.type !== ViewTypes.KANBAN &&
       view.type !== ViewTypes.GALLERY &&
-      view.type !== ViewTypes.MAP
+      view.type !== ViewTypes.MAP &&
+      view.type !== ViewTypes.CALENDAR
     ) {
       NcError.notFound('Not found');
     }
@@ -495,7 +496,8 @@ export class PublicDatasService {
     if (
       view.type !== ViewTypes.GRID &&
       view.type !== ViewTypes.KANBAN &&
-      view.type !== ViewTypes.GALLERY
+      view.type !== ViewTypes.GALLERY &&
+      view.type !== ViewTypes.CALENDAR
     ) {
       NcError.notFound('Not found');
     }
@@ -569,7 +571,8 @@ export class PublicDatasService {
     if (
       view.type !== ViewTypes.GRID &&
       view.type !== ViewTypes.KANBAN &&
-      view.type !== ViewTypes.GALLERY
+      view.type !== ViewTypes.GALLERY &&
+      view.type !== ViewTypes.CALENDAR
     ) {
       NcError.notFound('Not found');
     }