[pull] develop from baserow:develop

web-frontend/modules/automation/locales/en.json

@@ -158,29 +158,6 @@
     "coreHTTPTrigger": "HTTP trigger",
     "coreHTTPTriggerDescription": "Receive HTTP requests to trigger workflows"
   },
-  "periodicTriggerServiceForm": {
-    "intervalLabel": "Interval",
-    "intervalHelper": "Choose how frequently you want this workflow to run",
-    "everyMinute": "Every minute",
-    "everyHour": "Every hour",
-    "everyDay": "Every day",
-    "everyWeek": "Every week",
-    "everyMonth": "Every month",
-    "hour": "Hour",
-    "minute": "Minute",
-    "dayOfWeek": "Day of week",
-    "dayOfMonth": "Day of month",
-    "hourPlaceholder": "0-23",
-    "minutePlaceholder": "0-59",
-    "dayOfMonthPlaceholder": "1-31",
-    "minuteHelper": "This workflow will run every minute",
-    "hourHelper": "This workflow will run every hour at the specified minute in your local timezone ({timezone})",
-    "dayHelper": "This workflow will run every day at the specified time in your local timezone ({timezone})",
-    "weekHelper": "This workflow will run every week on the specified day and time in your local timezone ({timezone})",
-    "monthHelper": "This workflow will run every month on the specified day and time in your local timezone ({timezone})",
-    "deactivatedTitle": "Periodic trigger deactivated",
-    "deactivatedText": "This periodic trigger has been automatically deactivated due to consecutive failures."
-  },
   "workflowEditor": {
     "chooseEvent": "Choose an event..."
   },

web-frontend/modules/automation/plugin.js

@@ -45,6 +45,7 @@ import {
 } from '@baserow/modules/automation/dataProviderTypes'
 
 export default defineNuxtPlugin({
+  name: 'automation',
   dependsOn: ['core', 'store'],
   setup(nuxtApp) {
     const { $registry, $store, $clientErrorMap, $i18n } = nuxtApp

web-frontend/modules/builder/components/page/header/DataSourceContext.vue

@@ -112,7 +112,6 @@
       </div>
     </template>
     <DataSourceCreateEditModal
-      v-if="editModalVisible"
       :key="currentDataSourceId"
       ref="dataSourceCreateEditModal"
       :data-source-id="currentDataSourceId"
@@ -145,7 +144,6 @@ export default {
       state: 'loaded',
       creationInProgress: false,
       currentDataSourceId: null,
-      editModalVisible: false,
     }
   },
   computed: {
@@ -196,8 +194,8 @@ export default {
         notifyIf(error)
       }
     },
-    onHide() {
-      this.editModalVisible = false
+    async onHide() {
+      await this.$nextTick()
       this.currentDataSourceId = null
     },
     orderDS(shared) {
@@ -215,7 +213,6 @@ export default {
     },
     async createDataSource() {
       this.currentDataSourceId = null
-      this.editModalVisible = true
       await this.$nextTick()
       this.$refs.dataSourceCreateEditModal.show()
     },
@@ -244,7 +241,6 @@ export default {
     },
     async editDataSource(dataSource) {
       this.currentDataSourceId = dataSource.id
-      this.editModalVisible = true
       await this.$nextTick()
       this.$refs.dataSourceCreateEditModal.show()
     },

web-frontend/modules/builder/pages/pageEditor.vue

@@ -59,12 +59,7 @@ useHead(() => ({
 }))
 
 // Load page data
-const {
-  data: pageData,
-  error: pageError,
-  pending: pagePending,
-  refresh: refreshPage,
-} = await useAsyncData(
+const { data: pageData, error: pageError } = await useAsyncData(
   () => `page-editor-${route.params.builderId}-${route.params.pageId}`,
   async () => {
     // The objects are selected by the middleware
@@ -103,10 +98,14 @@ const {
         mode,
       })
 
+      const sharedPage =
+        await $store.getters['page/getSharedPage'](loadedBuilder)
+
       return {
         workspace: loadedWorkspace,
         builder: loadedBuilder,
         page,
+        sharedPage,
       }
     } catch (e) {
       if (e.response === undefined && !(e instanceof StoreItemLookupError)) {
@@ -121,21 +120,24 @@ const {
   }
 )
 
+if (pageError.value) {
+  // If we have an error we want to display it.
+  throw pageError.value
+}
+
 const workspace = computed(() => pageData.value?.workspace ?? null)
 const builder = computed(() => pageData.value?.builder ?? null)
 const currentPage = computed(() => pageData.value?.page ?? null)
+const sharedPage = computed(() => pageData.value?.sharedPage ?? null)
 
 // Computed properties
 const dataSources = computed(() => {
+  if (!currentPage.value) return []
   return $store.getters['dataSource/getPageDataSources'](currentPage.value)
 })
 
-const sharedPage = computed(() => {
-  if (!builder.value) return null
-  return $store.getters['page/getSharedPage'](builder.value)
-})
-
 const sharedDataSources = computed(() => {
+  if (!sharedPage.value) return []
   return $store.getters['dataSource/getPageDataSources'](sharedPage.value)
 })
 

web-frontend/modules/builder/plugins/router.js

@@ -3,28 +3,24 @@
  */
 export default defineNuxtPlugin({
   name: 'router',
-  dependsOn: ['core', 'builder', 'database'],
-  setup() {
-    const router = useRouter()
-    const runtimeConfig = useRuntimeConfig()
-
-    // SSR-safe host detection
-    const requestHostname = useRequestURL().hostname
-
-    const frontendHostname = new URL(runtimeConfig.public.publicWebFrontendUrl)
-      .hostname
+  dependsOn: [
+    'is-web-frontend-hostname',
+    'core',
+    'builder',
+    'database',
+    'automation',
+    'dashboard',
+    // Should execute after other applications are loaded to remove all the
+    // unnecessary routes
+  ],
 
-    const extraPublicHostnames =
-      runtimeConfig.public.extraPublicWebFrontendHostnames || []
-
-    // Check if request hostname matches main hostname or any extra hostname so we know
-    // whether the tool or a published application must be served.
-    const isWebFrontendHostname =
-      frontendHostname === requestHostname ||
-      extraPublicHostnames.includes(requestHostname)
+  setup(nuxtApp) {
+    const router = useRouter()
+    const { $isWebFrontendHostname } = nuxtApp
 
+    // Ensure only published routes are available if this is a published hostname
     for (const r of router.getRoutes()) {
-      if (isWebFrontendHostname) {
+      if ($isWebFrontendHostname) {
         if (r.meta?.publishedBuilderRoute && router.hasRoute(r.name)) {
           router.removeRoute(r.name)
         }

web-frontend/modules/builder/utils/routing.js

@@ -4,12 +4,10 @@ export const resolveApplicationRoute = (pages, fullPath) => {
   if (fullPath === undefined || fullPath === null) {
     return undefined
   }
-  // Nuxt route.fullPath usually includes query/hash; path-to-regexp matches pathnames.
-  const pathname = fullPath.split('?')[0].split('#')[0]
 
   for (const page of pages) {
     const matcher = match(page.path.slice(1))
-    const matched = matcher(pathname)
+    const matched = matcher(fullPath)
 
     if (matched) {
       // matched = { path, params, index? }

web-frontend/modules/core/mixins/moveToBody.js

@@ -23,19 +23,15 @@ export default {
     // to prevent closing when clicking in a child. We also check which parent
     // is first so can correctly move the element.
     while (parent) {
-      if (Object.prototype.hasOwnProperty.call(parent, 'moveToBody')) {
+      if (parent?.$data?.moveToBody) {
         parent.registerMoveToBodyChild(this)
-        if (first === null) {
-          first = parent
-        }
+        if (first === null) first = parent
       }
       // There could be components that need to know which child element have
-      // been moved to the body, but haven't moved to the body themself. If they
+      // been moved to the body, but haven't moved to the body themselves. If they
       // only have a `registerMoveToBodyChild` method, we register this
       // component a there.
-      else if (
-        Object.prototype.hasOwnProperty.call(parent, 'registerMoveToBodyChild')
-      ) {
+      else if (parent && typeof parent.registerMoveToBodyChild === 'function') {
         parent.registerMoveToBodyChild(this)
       }
       parent = parent.$parent
@@ -64,11 +60,9 @@ export default {
       }
     } else if (this.$el) {
       // Because there is no parent we can directly move the component to the
-      // end of the body. Elements that mount later are appended after earlier
-      // ones so that they appear on top when sharing the same z-index (DOM
-      // order determines visual stacking for equal z-index values).
+      // top of the body so it will be positioned over any other element.
       const body = document.body
-      body.appendChild(this.$el)
+      body.insertBefore(this.$el, body.firstChild)
       this.fireMovedToBodyHandlers()
     }
 

web-frontend/modules/core/module.js

@@ -135,6 +135,7 @@ export default defineNuxtModule({
     //addPlugin(resolve('plugins/router.js'))
     addPlugin(resolve('plugins/routeMounted.js'))
     addPlugin(resolve('plugins/storeRegister.js'))
+    addPlugin(resolve('plugins/isWebFrontendHostname.js'))
 
     addRouteMiddleware({
       name: 'authentication',

web-frontend/modules/core/pages/workspace.vue

@@ -243,7 +243,6 @@ definePageMeta({
     'impersonate',
     'workspacesAndApplications',
   ],
-  useRouteWorkspaceParam: 'test',
 })
 
 defineOptions({

web-frontend/modules/core/plugins/isWebFrontendHostname.js

@@ -0,0 +1,26 @@
+/**
+ * Whether the current hostname is a webfrontend hostname or not...
+ */
+export default defineNuxtPlugin({
+  name: 'is-web-frontend-hostname',
+  setup() {
+    const runtimeConfig = useRuntimeConfig()
+
+    // SSR-safe host detection
+    const requestHostname = useRequestURL().hostname
+
+    const frontendHostname = new URL(runtimeConfig.public.publicWebFrontendUrl)
+      .hostname
+
+    const extraPublicHostnames =
+      runtimeConfig.public.extraPublicWebFrontendHostnames || []
+
+    // Check if request hostname matches main hostname or any extra hostname so we know
+    // whether the tool or a published application must be served.
+    const isWebFrontendHostname =
+      frontendHostname === requestHostname ||
+      extraPublicHostnames.includes(requestHostname)
+
+    return { provide: { isWebFrontendHostname } }
+  },
+})

web-frontend/modules/core/plugins/realTimeHandler.js

@@ -1,6 +1,6 @@
 import { isSecureURL } from '@baserow/modules/core/utils/string'
 import { logoutAndRedirectToLogin } from '@baserow/modules/core/utils/auth'
-import { useRouter, useRuntimeConfig } from '#imports'
+import { useRuntimeConfig } from '#imports'
 
 export class RealTimeHandler {
   constructor(context) {

web-frontend/modules/core/utils/workspace.js

@@ -5,14 +5,7 @@ import { useCookie } from '#app'
 const cookieWorkspaceName = 'baserow_group_id'
 
 export const setWorkspaceCookie = (workspaceId, { $config }) => {
-  if (import.meta.server) return
   const secure = isSecureURL($config.public.publicWebFrontendUrl)
-  /*$cookies.set(cookieWorkspaceName, workspaceId, {
-    path: '/',
-    maxAge: 60 * 60 * 24 * 7,
-    sameSite: $config.BASEROW_FRONTEND_SAME_SITE_COOKIE,
-    secure,
-  })*/
   const cookie = useCookie(cookieWorkspaceName, {
     path: '/',
     maxAge: 60 * 60 * 24 * 7,
@@ -23,16 +16,10 @@ export const setWorkspaceCookie = (workspaceId, { $config }) => {
 }
 
 export const unsetWorkspaceCookie = () => {
-  if (import.meta.server) return
   const cookie = useCookie(cookieWorkspaceName)
   cookie.value = null
-  //deleteCookie(cookieWorkspaceName)
-  //$cookies.remove(cookieWorkspaceName)
 }
 
 export const getWorkspaceCookie = () => {
-  if (import.meta.server) return
   return useCookie(cookieWorkspaceName).value
-  //return getCookie(cookieWorkspaceName)
-  //return $cookies.get(cookieWorkspaceName)
 }