Add ability to update views, create views with existing filters and sorting applied

packages/builder/src/components/backend/DataTable/modals/CreateViewModal.svelte

@@ -1,11 +1,17 @@
 <script>
+  import { getContext } from "svelte"
   import { Input, notifications, ModalContent } from "@budibase/bbui"
   import { goto } from "@roxi/routify"
   import { viewsV2 } from "stores/backend"
   import { tables } from "stores/backend"
+  import { LuceneUtils } from "@budibase/frontend-core"
+
+  const { filter, sort, table } = getContext("grid")
+
+  $: query = LuceneUtils.buildLuceneQuery($filter)
+  $: console.log($table.schema)
 
   let name
-  let field
 
   $: views = Object.keys($tables.selected?.views || {})
   $: nameExists = views.includes(name?.trim())
@@ -16,7 +22,12 @@
       const newView = await viewsV2.create({
         name,
         tableId: $tables.selected._id,
-        field,
+        query,
+        sort: {
+          field: $sort.column,
+          order: $sort.order,
+        },
+        columns: $table.schema,
       })
       notifications.success(`View ${name} created`)
       $goto(`../../view/v2/${newView.id}`)

packages/frontend-core/src/components/grid/lib/websocket.js

@@ -14,7 +14,10 @@ export const createGridWebsocket = context => {
     const appId = API.getAppID()
     socket.emit(
       GridSocketEvent.SelectDatasource,
-      { datasource, appId },
+      {
+        datasource,
+        appId,
+      },
       ({ users: gridUsers }) => {
         users.set(gridUsers)
       }

packages/frontend-core/src/components/grid/stores/columns.js

@@ -69,7 +69,8 @@ export const deriveStores = context => {
 }
 
 export const createActions = context => {
-  const { table, columns, stickyColumn, API, dispatch, config } = context
+  const { table, columns, stickyColumn, API, dispatch, config, datasource } =
+    context
 
   // Checks if we have a certain column by name
   const hasColumn = column => {
@@ -137,12 +138,19 @@ export const createActions = context => {
   }
 
   const saveTable = async newTable => {
+    const $config = get(config)
+    const $datasource = get(datasource)
+
     // Update local state
     table.set(newTable)
 
     // Update server
-    if (get(config).canSaveSchema) {
+    if ($config.canSaveSchema) {
+      if ($datasource.type === "table") {
         await API.saveTable(newTable)
+      } else if ($datasource.type === "viewV2") {
+        await API.viewV2.update({ ...newTable })
+      }
     }
 
     // Broadcast change to external state can be updated, as this change

packages/frontend-core/src/fetch/ViewV2Fetch.js

@@ -8,11 +8,9 @@ export default class ViewV2Fetch extends DataFetch {
   async getDefinition(datasource) {
     try {
       const table = await this.API.fetchTableDefinition(datasource.tableId)
-      const view = Object.values(table.views || {}).find(
+      return Object.values(table.views || {}).find(
         view => view.id === datasource.id
       )
-      const { schema } = view
-      return { schema }
     } catch (error) {
       this.store.update(state => ({
         ...state,

packages/server/src/sdk/app/views/index.ts

@@ -45,6 +45,7 @@ export async function update(tableId: string, view: ViewV2): Promise<ViewV2> {
     throw new HTTPError(`View ${view.id} not found in table ${tableId}`, 404)
   }
 
+  console.log("set to", view)
   delete table.views[existingView.name]
   table.views[view.name] = view
   await db.put(table)