Merge branch 'develop' of github.com:Budibase/budibase into frontend-core

.gitignore

@@ -93,5 +93,5 @@ hosting/.generated-envoy.dev.yaml
 # Sublime text
 *.sublime-project
 *.sublime-workspace
-
+packages/builder/cypress.env.json
 bin/

lerna.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "npmClient": "yarn",
   "packages": [
     "packages/*"

packages/backend-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/backend-core",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Budibase backend core libraries used in server and worker",
   "main": "src/index.js",
   "author": "Budibase",

packages/backend-core/src/constants.js

@@ -8,6 +8,7 @@ exports.Cookies = {
   Auth: "budibase:auth",
   Init: "budibase:init",
   OIDC_CONFIG: "budibase:oidc:config",
+  RETURN_URL: "budibase:returnurl",
 }
 
 exports.Headers = {

packages/backend-core/src/utils.js

@@ -96,7 +96,12 @@ exports.getCookie = (ctx, name) => {
  * @param {string|object} value The value of cookie which will be set.
  * @param {object} opts options like whether to sign.
  */
-exports.setCookie = (ctx, value, name = "builder", opts = { sign: true }) => {
+exports.setCookie = (
+  ctx,
+  value,
+  name = "builder",
+  opts = { sign: true, requestDomain: false }
+) => {
   if (value && opts && opts.sign) {
     value = jwt.sign(value, options.secretOrKey)
   }
@@ -108,7 +113,7 @@ exports.setCookie = (ctx, value, name = "builder", opts = { sign: true }) => {
     overwrite: true,
   }
 
-  if (environment.COOKIE_DOMAIN) {
+  if (environment.COOKIE_DOMAIN && !opts.requestDomain) {
     config.domain = environment.COOKIE_DOMAIN
   }
 

packages/bbui/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/bbui",
   "description": "A UI solution used in the different Budibase projects.",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "license": "MPL-2.0",
   "svelte": "src/index.js",
   "module": "dist/bbui.es.js",

packages/bbui/src/Form/Core/Dropzone.svelte

@@ -22,6 +22,7 @@
   export let error = null
   export let fileTags = []
   export let maximum = null
+  export let extensions = "*"
 
   const dispatch = createEventDispatcher()
   const imageExtensions = [
@@ -207,6 +208,7 @@
           {disabled}
           type="file"
           multiple
+          accept={extensions}
           on:change={handleFile}
         />
         <svg

packages/builder/cypress.json

@@ -1,9 +1,11 @@
 {
-  "baseUrl": "http://localhost:10001/builder/",
+  "baseUrl": "http://localhost:10001",
   "video": true,
   "projectId": "bmbemn",
   "env": {
     "PORT": "10001",
-    "JWT_SECRET": "test"
+    "JWT_SECRET": "test",
+    "HOST_IP": "52.49.184.138",
+    "TEST_ENV" : false
   }
 }

packages/builder/cypress/integration/addMultiOptionDatatype.spec.js

@@ -10,35 +10,33 @@ context("Add Multi-Option Datatype", () => {
     cy.addRowMultiValue(["1", "2", "3", "4", "5"])
   })
 
-  it("should add form with multi select picker, containing 5 options", () => {
+    it ("should add form with multi select picker, containing 5 options", () => {
-    cy.navigateToFrontend()
+        cy.navigateToFrontend()
-    cy.wait(500)
+        cy.wait(500)
-    // Add data provider
+        // Add data provider
-    cy.get(`[data-cy="category-Data"]`).click()
+        cy.addComponent("Data", "Data Provider")
-    cy.get(`[data-cy="component-Data Provider"]`).click()
+        cy.get('[data-cy="dataSource-prop-control"]').click()
-    cy.get('[data-cy="dataSource-prop-control"]').click()
+        cy.get(".dropdown").contains("Multi Data").click()
-    cy.get(".dropdown").contains("Multi Data").click()
+        cy.wait(500)
-    cy.wait(500)
+        // Add Form with schema to match table
-    // Add Form with schema to match table
+        cy.addComponent("Form", "Form")
-    cy.addComponent("Form", "Form")
+        cy.get('[data-cy="dataSource-prop-control"').click()
-    cy.get('[data-cy="dataSource-prop-control"').click()
+        cy.get(".dropdown").contains("Multi Data").click()
-    cy.get(".dropdown").contains("Multi Data").click()
+        cy.wait(500)
-    cy.wait(500)
+        // Add multi-select picker to form
-    // Add multi-select picker to form
+        cy.addComponent("Form", "Multi-select Picker").then((componentId) => {
-    cy.addComponent("Form", "Multi-select Picker").then(componentId => {
+            cy.get('[data-cy="field-prop-control"]').type("Test Data").type('{enter}')
-      cy.get('[data-cy="field-prop-control"]').type("Test Data").type("{enter}")
+            cy.wait(1000)
-      cy.wait(1000)
+            cy.getComponent(componentId).contains("Choose some options").click()
-      cy.getComponent(componentId).contains("Choose some options").click()
+            // Check picker has 5 items
-      // Check picker has 5 items
+            cy.getComponent(componentId).find('li').should('have.length', 5)
-      cy.getComponent(componentId).find("li").should("have.length", 5)
+            // Select all items
-      // Select all items
+            for (let i = 1; i < 6; i++) {
-      for (let i = 1; i < 6; i++) {
+                cy.getComponent(componentId).find('li').contains(i).click()
-        cy.getComponent(componentId).find("li").contains(i).click()
+            }
-      }
+            // Check items have been selected
-      // Check items have been selected
+            cy.getComponent(componentId).find('.spectrum-Picker-label').contains("(5)")
-      cy.getComponent(componentId)
+        })
-        .find(".spectrum-Picker-label")
-        .contains("(5)")
     })
   })
-})
+

packages/builder/cypress/integration/autoScreensUI.spec.js

@@ -0,0 +1,47 @@
+context("Auto Screens UI", () => {
+    before(() => {
+    cy.login()
+    cy.createTestApp()
+    })
+    
+    it("should generate internal table screens", () => {
+        // Create autogenerated screens from the internal table
+        cy.createAutogeneratedScreens(["Cypress Tests"])
+        // Confirm screens have been auto generated
+        cy.get(".nav-items-container").contains("cypress-tests").click()
+        cy.get(".nav-items-container").should('contain', 'cypress-tests/:id')
+        .and('contain', 'cypress-tests/new/row')
+    })
+    
+    it("should generate multiple internal table screens at once", () => {
+        // Create a second internal table
+        const initialTable = "Cypress Tests"
+        const secondTable = "Table Two"
+        cy.createTable(secondTable)
+        // Create autogenerated screens from the internal tables
+        cy.createAutogeneratedScreens([initialTable, secondTable])
+        // Confirm screens have been auto generated
+        cy.get(".nav-items-container").contains("cypress-tests").click()
+        // Previously generated tables are suffixed with numbers - as expected
+        cy.get(".nav-items-container").should('contain', 'cypress-tests-2/:id')
+        .and('contain', 'cypress-tests-2/new/row')
+        cy.get(".nav-items-container").contains("table-two").click()
+        cy.get(".nav-items-container").should('contain', 'table-two/:id')
+        .and('contain', 'table-two/new/row')
+    })
+    
+    if (Cypress.env("TEST_ENV")) {
+        it("should generate data source screens", () => {
+            // Using MySQL data source for testing this
+            const datasource = "MySQL"
+            // Select & configure MySQL data source
+            cy.selectExternalDatasource(datasource)
+            cy.addDatasourceConfig(datasource)
+            // Create autogenerated screens from a MySQL table - MySQL contains books table
+            cy.createAutogeneratedScreens(["books"])
+            cy.get(".nav-items-container").contains("books").click()
+            cy.get(".nav-items-container").should('contain', 'books/:id')
+            .and('contain', 'books/new/row')
+        })
+    }
+})

packages/builder/cypress/integration/changeAppIconAndColour.spec.js

@@ -0,0 +1,39 @@
+context("Change Application Icon and Colour", () => {
+    before(() => {
+      cy.login()
+    })
+    
+    it("should change the icon and colour for an application", () => {
+        // Search for test application
+        cy.searchForApplication("Cypress Tests")
+        cy.get(".appTable")
+          .within(() => {
+            cy.get(".spectrum-Icon").eq(1).click()
+          })
+        cy.get(".spectrum-Menu").contains("Edit icon").click()
+        // Select random icon
+        cy.get(".grid").within(() => {
+            cy.get(".icon-item").eq(Math.floor(Math.random() * 23) + 1).click()
+        })
+        // Select random colour
+        cy.get(".fill").click()
+        cy.get(".colors").within(() => {
+            cy.get(".color").eq(Math.floor(Math.random() * 33) + 1).click()
+        })
+        cy.intercept('**/applications/**').as('iconChange')
+        cy.get(".spectrum-Button").contains("Save").click({ force: true })
+        cy.wait("@iconChange")
+        cy.get("@iconChange").its('response.statusCode')
+        .should('eq', 200)
+        cy.wait(1000)
+        // Confirm icon has changed from default
+        // Confirm colour has been applied - There is no default colour
+        cy.get(".appTable")
+          .within(() => {
+            cy.get('[aria-label]').eq(0).children()
+            .should('have.attr', 'xlink:href').and('not.contain', '#spectrum-icon-18-Apps')
+            cy.get(".title").children().children()
+            .should('have.attr', 'style').and('contains', 'color')
+          })
+    })
+})

packages/builder/cypress/integration/createApp.spec.js

@@ -2,7 +2,7 @@ context("Create an Application", () => {
   it("should create a new application", () => {
     cy.login()
     cy.createTestApp()
-    cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
+    cy.visit(`${Cypress.config().baseUrl}/builder`)
     cy.contains("Cypress Tests").should("exist")
   })
 })

packages/builder/cypress/integration/createAutomation.spec.js

@@ -4,7 +4,6 @@ context("Create a automation", () => {
     cy.createTestApp()
   })
 
-  // https://on.cypress.io/interacting-with-elements
   it("should create a automation", () => {
     cy.createTestTableWithData()
     cy.wait(2000)
@@ -24,7 +23,7 @@ context("Create a automation", () => {
     cy.contains("dog").click()
     cy.wait(2000)
     // Create action
-    cy.get(".block > .spectrum-Icon").click()
+    cy.get('[aria-label="AddCircle"]').eq(1).click()
     cy.get(".modal-inner-wrapper").within(() => {
       cy.wait(1000)
       cy.contains("Create Row").trigger('mouseover').click().click()

packages/builder/cypress/integration/createTable.spec.js

@@ -30,7 +30,6 @@ context("Create a Table", () => {
     cy.contains("Save Column").click()
     cy.contains("nameupdated ").should("contain", "nameupdated")
   })
-
   
   it("edits a row", () => {
     cy.contains("button", "Edit").click({ force: true })
@@ -47,13 +46,43 @@ context("Create a Table", () => {
     cy.get(".spectrum-Modal").contains("Delete").click()
     cy.contains("RoverUpdated").should("not.exist")
   })
+  
+  it("Adds 15 rows and checks pagination", () => {
+    // 10 rows per page, 15 rows should create 2 pages within table
+    const totalRows = 16
+    for (let i = 1; i < totalRows; i++){
+      cy.addRow([i])
+    }
+    cy.wait(1000)
+    cy.get(".spectrum-Pagination").within(() => {
+      cy.get(".spectrum-ActionButton").eq(1).click()
+    })
+    cy.get(".spectrum-Pagination").within(() => {
+      cy.get(".spectrum-Body--secondary").contains("Page 2")
+    })
+  })
+  
+  it("Deletes rows and checks pagination", () => {
+    // Delete rows, removing second page of rows from table
+    const deleteRows = 5
+    cy.get(".spectrum-Checkbox-input").check({ force: true })
+    cy.get(".spectrum-Table-body")
+    cy.contains("Delete 5 row(s)").click()
+    cy.get(".spectrum-Modal").contains("Delete").click()
+    cy.wait(1000)
+    
+    // Confirm table only has one page
+    cy.get(".spectrum-Pagination").within(() => {
+      cy.get(".spectrum-ActionButton").eq(1).should('not.be.enabled')
+    })
+  })
 
   it("deletes a column", () => {
+    const columnName = "nameupdated"
     cy.get(".title").click()
     cy.get(".spectrum-Table-editIcon > use").click()
     cy.contains("Delete").click()
-    cy.wait(50)
+    cy.get('[data-cy="delete-column-confirm"]').type(columnName)
-    cy.get(`[data-cy="delete-column-confirm"]`).type("nameupdated")
     cy.contains("Delete Column").click()
     cy.contains("nameupdated").should("not.exist")
   })
@@ -67,7 +96,7 @@ context("Create a Table", () => {
         cy.get(".actions .spectrum-Icon").click({ force: true })
       })
     cy.get(".spectrum-Menu > :nth-child(2)").click()
-    cy.get(`[data-cy="delete-table-confirm"]`).type("dog")
+    cy.get('[data-cy="delete-table-confirm"]').type("dog")
     cy.contains("Delete Table").click()
     cy.contains("dog").should("not.exist")
   })

packages/builder/cypress/integration/createUser.spec.js

@@ -1,10 +0,0 @@
-context("Create a User", () => {
-  before(() => {
-    cy.login()
-  })
-
-  it("should create a user", () => {
-    cy.createUser("bbuser@test.com")
-    cy.contains("bbuser").should("be.visible")
-  })
-})

packages/builder/cypress/integration/createUserAndRoles.spec.js

@@ -0,0 +1,128 @@
+context("Create a User and Assign Roles", () => {
+  before(() => {
+    cy.login()
+  })
+
+  it("should create a user", () => {
+    cy.createUser("bbuser@test.com")
+    cy.get(".spectrum-Table-body").should('contain', 'bbuser')
+  })
+  
+  it("should confirm there is No Access for a New User", () => {
+    // Click into the user
+    cy.contains("bbuser").click()
+    cy.wait(500)
+    // Get No Access table - Confirm it has apps in it
+    cy.get(".spectrum-Table").eq(1).should('not.contain', 'No rows found')
+    // Get Configure Roles table - Confirm it has no apps
+    cy.get(".spectrum-Table").eq(0).contains('No rows found')
+  })
+  
+  it("should assign role types", () => {
+    // 3 apps minimum required - to assign an app to each role type
+    cy.request(`${Cypress.config().baseUrl}/api/applications?status=all`)
+    .its("body")
+    .then(val => {
+      if (val.length < 3) {
+        for (let i = 1; i < 3; i++) {
+          const uuid = () => Cypress._.random(0, 1e6)
+          const name = uuid()
+          cy.createApp(name)
+        }
+      }
+    })
+    // Navigate back to the user
+    cy.visit(`${Cypress.config().baseUrl}/builder`)
+    cy.wait(1000)
+    cy.get(".spectrum-SideNav").contains("Users").click()
+    cy.get(".spectrum-Table").contains("bbuser").click()
+    cy.wait(500)
+    for (let i = 0; i < 3; i++) {
+      cy.get(".spectrum-Table-body").eq(1).find('tr').eq(0).click()
+      cy.wait(500)
+      cy.get(".spectrum-Dialog-grid").contains("Choose an option").click().then(() => {
+        cy.wait(500)
+        if (i == 0) {
+          cy.get(".spectrum-Popover").contains("Admin").click()
+        }
+        if (i == 1) {
+          cy.get(".spectrum-Popover").contains("Power").click()
+        }
+        if (i == 2) {
+          cy.get(".spectrum-Popover").contains("Basic").click()
+        }
+        cy.wait(500)
+        cy.get(".spectrum-Button").contains("Update role").click({ force: true })
+        })
+      }
+      // Confirm roles exist within Configure roles table
+      cy.wait(500)
+      cy.get(".spectrum-Table-body").eq(0).within((assginedRoles) => {
+        expect(assginedRoles).to.contain("Admin")
+        expect(assginedRoles).to.contain("Power")
+        expect(assginedRoles).to.contain("Basic")
+      })
+    })
+    
+  it("should unassign role types", () => {
+    // Set each app within Configure roles table to 'No Access'
+    cy.get(".spectrum-Table-body").eq(0).find('tr').its('length').then((len) => {
+      for (let i = 0; i < len; i ++){
+        cy.get(".spectrum-Table-body").eq(0).find('tr').eq(0).click().then(() => {
+          cy.get(".spectrum-Form-item").contains("Role").parent().within(() => {
+            cy.get(".spectrum-Picker").click({ force: true })
+            cy.wait(500)
+            cy.get(".spectrum-Popover").contains("No Access").click()
+          })
+          cy.get(".spectrum-Button").contains("Update role").click({ force: true })
+          cy.wait(1000)
+        })
+      }
+    })
+    // Confirm Configure roles table no longer has any apps in it
+    cy.get(".spectrum-Table-body").eq(0).contains('No rows found')
+  })
+    
+  it("should enable Developer access", () => {
+    // Enable Developer access
+    cy.get(".field").eq(4).within(() => {
+      cy.get(".spectrum-Switch-input").click({ force: true })
+    })
+    // No Access table should now be empty
+    cy.get(".container").contains("No Access").parent().within(() => {
+      cy.get(".spectrum-Table").contains("No rows found")
+    })
+    
+    // Each app within Configure roles should have Admin access
+    cy.get(".spectrum-Table-body").eq(0).find('tr').its('length').then((len) => {
+      for (let i = 0; i < len; i++) {
+        cy.get(".spectrum-Table-body").eq(0).find('tr').eq(i).contains("Admin")
+        cy.wait(500)
+      }
+    })
+  })
+    
+  it("should disable Developer access", () => {
+    // Disable Developer access
+    cy.get(".field").eq(4).within(() => {
+      cy.get(".spectrum-Switch-input").click({ force: true })
+    })
+    // Configure roles table should now be empty
+    cy.get(".container").contains("Configure roles").parent().within(() => {
+      cy.get(".spectrum-Table").contains("No rows found")
+    })
+  })
+  
+  it("should delete a user", () => {
+    // Click Delete user button
+    cy.get(".spectrum-Button").contains("Delete user").click({force: true}).then(() => {
+      // Confirm deletion within modal
+      cy.wait(500)
+      cy.get(".spectrum-Dialog-grid").within(() => {
+        cy.get(".spectrum-Button").contains("Delete user").click({force: true})
+        cy.wait(4000)
+      })
+    })
+    cy.get(".spectrum-Table-body").should("not.have.text", "bbuser")
+  })
+})

packages/builder/cypress/integration/customThemingProperties.spec.js

@@ -80,5 +80,4 @@ xcontext("Custom Theming Properties", () => {
         .parent().find(".container.svelte-z3cm5a").click()
         .get('[title="Gray 800"]').children().find('[aria-label="Checkmark"]')
     }
-
 })

packages/builder/cypress/integration/datasources/datasourceWizard.spec.js

@@ -0,0 +1,37 @@
+context("Datasource Wizard", () => {
+    before(() => {
+      cy.login()
+      cy.createTestApp()
+    })
+
+  it("should navigate in and out of a datasource via wizard", () => {
+    // Select PostgreSQL and add config (without fetch)
+    const datasource = "Oracle"
+    cy.selectExternalDatasource(datasource)
+    cy.addDatasourceConfig(datasource, true)
+    
+    // Navigate back within datasource wizard
+    cy.get(".spectrum-Dialog-grid").within(() => {
+      cy.get(".spectrum-Button").contains("Back").click({ force: true })
+      cy.wait(1000)
+    })
+  
+    // Select PostgreSQL datasource again
+    cy.get(".item-list").contains(datasource).click()
+    cy.get(".spectrum-Dialog-grid").within(() => {
+      cy.get(".spectrum-Button").contains("Continue").click({ force: true })
+    })
+    
+    // Fetch tables after selection
+    // Previously entered config should not have been saved
+    // Config is back to default values
+    // Modal will close and provide 500 error
+    cy.intercept('**/datasources').as('datasourceConnection')
+    cy.get(".spectrum-Dialog-grid").within(() => {
+      cy.get(".spectrum-Button").contains("Save and fetch tables").click({ force: true })
+    })
+    cy.wait("@datasourceConnection")
+    cy.get("@datasourceConnection").its('response.body')
+        .should('have.property', 'status', 500)
+  })
+})

packages/builder/cypress/integration/datasources/mySql.spec.js

@@ -0,0 +1,187 @@
+context("MySQL Datasource Testing", () => {
+    if (Cypress.env("TEST_ENV")) {
+    
+        before(() => {
+        cy.login()
+        cy.createTestApp()
+        })
+        const datasource = "MySQL"
+        const queryName = "Cypress Test Query"
+        const queryRename = "CT Query Rename"
+        
+        it("Should add MySQL data source without configuration", () => {
+            // Select MySQL data source
+            cy.selectExternalDatasource(datasource)
+            // Attempt to fetch tables without applying configuration
+            cy.intercept('**/datasources').as('datasource')
+            cy.get(".spectrum-Button")
+            .contains("Save and fetch tables")
+            .click({ force: true })
+            // Intercept Request after button click & apply assertions
+            cy.wait("@datasource")
+            cy.get("@datasource").its('response.body')
+            .should('have.property', 'message', 'connect ECONNREFUSED 127.0.0.1:3306')
+            cy.get("@datasource").its('response.body')
+            .should('have.property', 'status', 500)
+        })
+        
+        it("should add MySQL data source and fetch tables", () => {
+            // Add & configure MySQL data source
+            cy.selectExternalDatasource(datasource)
+            cy.intercept('**/datasources').as('datasource')
+            cy.addDatasourceConfig(datasource)
+            // Check response from datasource after adding configuration
+            cy.wait("@datasource")
+            cy.get("@datasource").its('response.statusCode')
+            .should('eq', 200)
+            // Confirm fetch tables was successful
+            cy.get(".spectrum-Table-body").eq(0)
+            .find('tr')
+            .its('length')
+            .should('be.gt', 0)
+        })
+        
+        it("should check table fetching error", () => {
+            // MySQL test data source contains tables without primary keys
+            cy.get(".spectrum-InLineAlert")
+            .should('contain', 'Error fetching tables')
+            .and('contain', 'No primary key constraint found')
+        })
+        
+        it("should define a One relationship type", () => {
+            // Select relationship type & configure
+            cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Picker").eq(0).click()
+                cy.get(".spectrum-Popover").contains("One").click()
+                cy.get(".spectrum-Picker").eq(1).click()
+                cy.get(".spectrum-Popover").contains("REGIONS").click()
+                cy.get(".spectrum-Picker").eq(2).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                cy.get(".spectrum-Picker").eq(3).click()
+                cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+                cy.get(".spectrum-Picker").eq(4).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                // Save relationship & reload page
+                cy.get(".spectrum-Button").contains("Save").click({ force: true })
+                cy.reload()
+            })
+            // Confirm table length & column name
+            cy.get(".spectrum-Table-body").eq(1)
+            .find('tr')
+            .its('length')
+            .should('eq', 1)
+            cy.get(".spectrum-Table-cell").should('contain', "COUNTRIES to REGIONS")
+        })
+        
+        it("should define a Many relationship type", () => {
+            // Select relationship type & configure
+            cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Picker").eq(0).click()
+                cy.get(".spectrum-Popover").contains("Many").click()
+                cy.get(".spectrum-Picker").eq(1).click()
+                cy.get(".spectrum-Popover").contains("LOCATIONS").click()
+                cy.get(".spectrum-Picker").eq(2).click()
+                cy.get(".spectrum-Popover").contains("REGIONS").click()
+                cy.get(".spectrum-Picker").eq(3).click()
+                cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+                cy.get(".spectrum-Picker").eq(4).click()
+                cy.get(".spectrum-Popover").contains("COUNTRY_ID").click()
+                cy.get(".spectrum-Picker").eq(5).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                // Save relationship & reload page
+                cy.get(".spectrum-Button").contains("Save").click({ force: true })
+                cy.reload()
+                cy.wait(1000)
+            })
+            // Confirm table length & relationship name
+            cy.get(".spectrum-Table-body").eq(1)
+            .find('tr')
+            .its('length')
+            .should('eq', 2)
+            cy.get(".spectrum-Table-cell")
+            .should('contain', "LOCATIONS through COUNTRIES → REGIONS")
+        })
+        
+        it("should delete relationships", () => {
+            // Delete both relationships
+            cy.get(".spectrum-Table-body")
+            .eq(1).find('tr').its('length')
+            .then((len) => {
+                for (let i = 0; i < len; i++) {
+                    cy.get(".spectrum-Table-body").eq(1).within(() => {
+                        cy.get(".spectrum-Table-row").eq(0).click()
+                        cy.wait(500)
+                    })
+                    cy.get(".spectrum-Dialog-grid").within(() => {
+                        cy.get(".spectrum-Button").contains("Delete").click({ force: true })
+                    })
+                    cy.reload()
+                }
+                // Confirm relationships no longer exist
+                cy.get(".spectrum-Body").should('contain', 'No relationships configured')
+            })
+        })
+        
+        it("should add a query", () => {
+            // Add query
+            cy.get(".spectrum-Button").contains("Add query").click({ force: true })
+            cy.get(".spectrum-Form-item").eq(0).within(() => {
+                cy.get("input").type(queryName)
+            })
+            // Insert Query within Fields section
+            cy.get(".CodeMirror textarea").eq(0)
+            .type("SELECT * FROM books", { force: true })
+            // Intercept query execution
+            cy.intercept('**/queries/preview').as('query')
+            cy.get(".spectrum-Button").contains("Run Query").click({ force: true })
+            cy.wait(500)
+            cy.wait("@query")
+            // Assert against Status Code & Body
+            cy.get("@query").its('response.statusCode')
+            .should('eq', 200)
+            cy.get("@query").its('response.body')
+            .should('not.be.empty')
+            // Save query
+            cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+            cy.get(".nav-item").should('contain', queryName)
+        })
+        
+        it("should duplicate a query", () => {
+            // Get last nav item - The query
+            cy.get(".nav-item").last().within(() => {
+                    cy.get(".icon").eq(1).click({ force: true })
+                })
+            // Select and confirm duplication
+            cy.get(".spectrum-Menu").contains("Duplicate").click()
+            cy.get(".nav-item").should('contain', queryName + ' (1)')
+        })
+        
+        it("should edit a query name", () => {
+            // Rename query
+            cy.get(".spectrum-Form-item").eq(0).within(() => {
+                cy.get("input").clear().type(queryRename)
+            })
+            // Save query
+            cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+            cy.get(".nav-item").should('contain', queryRename)
+        })
+        
+        it("should delete a query", () => {
+            // Get last nav item - The query
+            for (let i = 0; i < 2; i++) {
+                cy.get(".nav-item").last().within(() => {
+                    cy.get(".icon").eq(1).click({ force: true })
+                })
+                // Select Delete
+                cy.get(".spectrum-Menu").contains("Delete").click()
+                cy.get(".spectrum-Button").contains("Delete Query").click({ force: true })
+                cy.wait(1000)
+            }
+            // Confirm deletion
+            cy.get(".nav-item").should('not.contain', queryName)
+            cy.get(".nav-item").should('not.contain', queryRename)
+        })
+    }
+})

packages/builder/cypress/integration/datasources/oracle.spec.js

@@ -0,0 +1,191 @@
+context("Oracle Datasource Testing", () => {
+    before(() => {
+    cy.login()
+    cy.createTestApp()
+    })
+    const datasource = "Oracle"
+    const queryName = "Cypress Test Query"
+    const queryRename = "CT Query Rename"
+    
+    it("Should add Oracle data source and skip table fetch", () => {
+        // Select Oracle data source
+        cy.selectExternalDatasource(datasource)
+        // Skip table fetch - no config added
+        cy.get(".spectrum-Button").contains("Skip table fetch").click({ force: true })
+        cy.wait(500)
+        // Confirm config contains localhost
+        cy.get(".spectrum-Textfield-input").eq(1).should('have.value', 'localhost')
+        // Add another Oracle data source, configure & skip table fetch
+        cy.selectExternalDatasource(datasource)
+        cy.addDatasourceConfig(datasource, true)
+        // Confirm config and no tables
+        cy.get(".spectrum-Textfield-input").eq(1).should('have.value', Cypress.env("oracle").HOST)
+        cy.get(".spectrum-Body").eq(2).should('contain', 'No tables found.')
+    })
+    
+    it("Should add Oracle data source and fetch tables without configuration", () => {
+        // Select Oracle data source
+        cy.selectExternalDatasource(datasource)
+        // Attempt to fetch tables without applying configuration
+        cy.intercept('**/datasources').as('datasource')
+        cy.get(".spectrum-Button")
+        .contains("Save and fetch tables")
+        .click({ force: true })
+        // Intercept Request after button click & apply assertions
+        cy.wait("@datasource")
+        cy.get("@datasource").its('response.body')
+        .should('have.property', 'message', 'NJS-007: invalid value for "user" in parameter 1')
+        cy.get("@datasource").its('response.body')
+        .should('have.property', 'status', 500)
+    })
+    
+    it("should add Oracle data source and fetch tables", () => {
+        // Add & configure Oracle data source
+        cy.selectExternalDatasource(datasource)
+        cy.intercept('**/datasources').as('datasource')
+        cy.addDatasourceConfig(datasource)
+        // Check response from datasource after adding configuration
+        cy.wait("@datasource")
+        cy.get("@datasource").its('response.statusCode')
+        .should('eq', 200)
+        // Confirm fetch tables was successful
+        cy.get(".spectrum-Table-body").eq(0)
+        .find('tr')
+        .its('length')
+        .should('be.gt', 0)
+    })
+    
+    it("should define a One relationship type", () => {
+        // Select relationship type & configure
+        cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+        cy.get(".spectrum-Dialog-grid").within(() => {
+            cy.get(".spectrum-Picker").eq(0).click()
+            cy.get(".spectrum-Popover").contains("One").click()
+            cy.get(".spectrum-Picker").eq(1).click()
+            cy.get(".spectrum-Popover").contains("REGIONS").click()
+            cy.get(".spectrum-Picker").eq(2).click()
+            cy.get(".spectrum-Popover").contains("REGION_ID").click()
+            cy.get(".spectrum-Picker").eq(3).click()
+            cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+            cy.get(".spectrum-Picker").eq(4).click()
+            cy.get(".spectrum-Popover").contains("REGION_ID").click()
+            // Save relationship & reload page
+            cy.get(".spectrum-Button").contains("Save").click({ force: true })
+            cy.reload()
+        })
+        // Confirm table length & column name
+        cy.get(".spectrum-Table-body").eq(1)
+        .find('tr')
+        .its('length')
+        .should('eq', 1)
+        cy.get(".spectrum-Table-cell").should('contain', "COUNTRIES to REGIONS")
+    })
+    
+    it("should define a Many relationship type", () => {
+        // Select relationship type & configure
+        cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+        cy.get(".spectrum-Dialog-grid").within(() => {
+            cy.get(".spectrum-Picker").eq(0).click()
+            cy.get(".spectrum-Popover").contains("Many").click()
+            cy.get(".spectrum-Picker").eq(1).click()
+            cy.get(".spectrum-Popover").contains("LOCATIONS").click()
+            cy.get(".spectrum-Picker").eq(2).click()
+            cy.get(".spectrum-Popover").contains("REGIONS").click()
+            cy.get(".spectrum-Picker").eq(3).click()
+            cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+            cy.get(".spectrum-Picker").eq(4).click()
+            cy.get(".spectrum-Popover").contains("COUNTRY_ID").click()
+            cy.get(".spectrum-Picker").eq(5).click()
+            cy.get(".spectrum-Popover").contains("REGION_ID").click()
+            // Save relationship & reload page
+            cy.get(".spectrum-Button").contains("Save").click({ force: true })
+            cy.reload()
+        })
+        // Confirm table length & relationship name
+        cy.get(".spectrum-Table-body").eq(1)
+        .find('tr')
+        .its('length')
+        .should('eq', 2)
+        cy.get(".spectrum-Table-cell")
+        .should('contain', "LOCATIONS through COUNTRIES → REGIONS")
+    })
+    
+    it("should delete relationships", () => {
+        // Delete both relationships
+        cy.get(".spectrum-Table-body")
+        .eq(1).find('tr').its('length')
+        .then((len) => {
+            for (let i = 0; i < len; i++) {
+                cy.get(".spectrum-Table-body").eq(1).within(() => {
+                    cy.get(".spectrum-Table-row").eq(0).click()
+                    cy.wait(500)
+                })
+                cy.get(".spectrum-Dialog-grid").within(() => {
+                    cy.get(".spectrum-Button").contains("Delete").click({ force: true })
+                })
+                cy.reload()
+            }
+            // Confirm relationships no longer exist
+            cy.get(".spectrum-Body").should('contain', 'No relationships configured')
+        })
+    })
+    
+    it("should add a query", () => {
+        // Add query
+        cy.get(".spectrum-Button").contains("Add query").click({ force: true })
+        cy.get(".spectrum-Form-item").eq(0).within(() => {
+            cy.get("input").type(queryName)
+        })
+        // Insert Query within Fields section
+        cy.get(".CodeMirror textarea").eq(0)
+        .type("SELECT * FROM JOBS", { force: true })
+        // Intercept query execution
+        cy.intercept('**/queries/preview').as('query')
+        cy.get(".spectrum-Button").contains("Run Query").click({ force: true })
+        cy.wait(500)
+        cy.wait("@query")
+        // Assert against Status Code & Body
+        cy.get("@query").its('response.statusCode')
+        .should('eq', 200)
+        cy.get("@query").its('response.body')
+        .should('not.be.empty')
+        // Save query
+        cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+        cy.get(".nav-item").should('contain', queryName)
+    })
+    
+    it("should duplicate a query", () => {
+        // Get query nav item
+        cy.get(".nav-item").contains(queryName).parent().within(() => {
+            cy.get(".spectrum-Icon").eq(1).click({ force: true })  
+        })
+        // Select and confirm duplication
+        cy.get(".spectrum-Menu").contains("Duplicate").click()
+        cy.get(".nav-item").should('contain', queryName + ' (1)')
+    })
+    
+    it("should edit a query name", () => {
+        // Rename query
+        cy.get(".spectrum-Form-item").eq(0).within(() => {
+            cy.get("input").clear().type(queryRename)
+        })
+        // Save query
+        cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+        cy.get(".nav-item").should('contain', queryRename)
+    })
+    
+    it("should delete a query", () => {
+        // Get query nav item - QueryName
+        cy.get(".nav-item").contains(queryName).parent().within(() => {
+            cy.get(".spectrum-Icon").eq(1).click({ force: true })  
+        })
+        
+        // Select Delete
+        cy.get(".spectrum-Menu").contains("Delete").click()
+        cy.get(".spectrum-Button").contains("Delete Query").click({ force: true })
+        cy.wait(1000)
+        
+        // Confirm deletion
+        cy.get(".nav-item").should('not.contain', queryName)
+    })
+})

packages/builder/cypress/integration/datasources/postgreSql.spec.js

@@ -0,0 +1,237 @@
+context("PostgreSQL Datasource Testing", () => {
+    if (Cypress.env("TEST_ENV")) {
+    
+        before(() => {
+        cy.login()
+        cy.createTestApp()
+        })
+        const datasource = "PostgreSQL"
+        const queryName = "Cypress Test Query"
+        const queryRename = "CT Query Rename"
+        
+        it("Should add PostgreSQL data source without configuration", () => {
+            // Select PostgreSQL data source
+            cy.selectExternalDatasource(datasource)
+            // Attempt to fetch tables without applying configuration
+            cy.intercept('**/datasources').as('datasource')
+            cy.get(".spectrum-Button")
+            .contains("Save and fetch tables")
+            .click({ force: true })
+            // Intercept Request after button click & apply assertions
+            cy.wait("@datasource")
+            cy.get("@datasource").its('response.body')
+            .should('have.property', 'message', 'connect ECONNREFUSED 127.0.0.1:5432')
+            cy.get("@datasource").its('response.body')
+            .should('have.property', 'status', 500)
+        })
+        
+        it("should add PostgreSQL data source and fetch tables", () => {
+            // Add & configure PostgreSQL data source
+            cy.selectExternalDatasource(datasource)
+            cy.intercept('**/datasources').as('datasource')
+            cy.addDatasourceConfig(datasource)
+            // Check response from datasource after adding configuration
+            cy.wait("@datasource")
+            cy.get("@datasource").its('response.statusCode')
+            .should('eq', 200)
+            // Confirm fetch tables was successful
+            cy.get(".spectrum-Table-body").eq(0)
+            .find('tr')
+            .its('length')
+            .should('be.gt', 0)
+        })
+        
+        it("should define a One relationship type", () => {
+            // Select relationship type & configure
+            cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Picker").eq(0).click()
+                cy.get(".spectrum-Popover").contains("One").click()
+                cy.get(".spectrum-Picker").eq(1).click()
+                cy.get(".spectrum-Popover").contains("REGIONS").click()
+                cy.get(".spectrum-Picker").eq(2).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                cy.get(".spectrum-Picker").eq(3).click()
+                cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+                cy.get(".spectrum-Picker").eq(4).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                // Save relationship & reload page
+                cy.get(".spectrum-Button").contains("Save").click({ force: true })
+                cy.reload()
+            })
+            // Confirm table length & column name
+            cy.get(".spectrum-Table-body").eq(1)
+            .find('tr')
+            .its('length')
+            .should('eq', 1)
+            cy.get(".spectrum-Table-cell").should('contain', "COUNTRIES to REGIONS")
+        })
+        
+        it("should define a Many relationship type", () => {
+            // Select relationship type & configure
+            cy.get(".spectrum-Button").contains("Define relationship").click({ force: true })
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Picker").eq(0).click()
+                cy.get(".spectrum-Popover").contains("Many").click()
+                cy.get(".spectrum-Picker").eq(1).click()
+                cy.get(".spectrum-Popover").contains("LOCATIONS").click()
+                cy.get(".spectrum-Picker").eq(2).click()
+                cy.get(".spectrum-Popover").contains("REGIONS").click()
+                cy.get(".spectrum-Picker").eq(3).click()
+                cy.get(".spectrum-Popover").contains("COUNTRIES").click()
+                cy.get(".spectrum-Picker").eq(4).click()
+                cy.get(".spectrum-Popover").contains("COUNTRY_ID").click()
+                cy.get(".spectrum-Picker").eq(5).click()
+                cy.get(".spectrum-Popover").contains("REGION_ID").click()
+                // Save relationship & reload page
+                cy.get(".spectrum-Button").contains("Save").click({ force: true })
+                cy.reload()
+            })
+            // Confirm table length & relationship name
+            cy.get(".spectrum-Table-body").eq(1)
+            .find('tr')
+            .its('length')
+            .should('eq', 2)
+            cy.get(".spectrum-Table-cell")
+            .should('contain', "LOCATIONS through COUNTRIES → REGIONS")
+        })
+        
+        it("should delete a relationship", () => {
+            cy.get(".hierarchy-items-container").contains(datasource).click()
+            cy.reload()
+            // Delete one relationship
+            cy.get(".spectrum-Table-body").eq(1).within(() => {
+                cy.get(".spectrum-Table-row").eq(0).click()
+                cy.wait(500)
+                })
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Button").contains("Delete").click({ force: true })
+                })
+            cy.reload()
+            // Confirm relationship was deleted
+            cy.get(".spectrum-Table-body")
+            .eq(1).find('tr').its('length').should('eq', 1)
+        })
+        
+        it("should add a query", () => {
+            // Add query
+            cy.get(".spectrum-Button").contains("Add query").click({ force: true })
+            cy.get(".spectrum-Form-item").eq(0).within(() => {
+                cy.get("input").type(queryName)
+            })
+            // Insert Query within Fields section
+            cy.get(".CodeMirror textarea").eq(0)
+            .type("SELECT * FROM books", { force: true })
+            // Intercept query execution
+            cy.intercept('**/queries/preview').as('query')
+            cy.get(".spectrum-Button").contains("Run Query").click({ force: true })
+            cy.wait(500)
+            cy.wait("@query")
+            // Assert against Status Code & Body
+            cy.get("@query").its('response.statusCode')
+            .should('eq', 200)
+            cy.get("@query").its('response.body')
+            .should('not.be.empty')
+            // Save query
+            cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+            cy.get(".hierarchy-items-container").should('contain', queryName)
+        })
+        
+        it("should switch to schema with no tables", () => {
+            // Switch Schema - To one without any tables
+            cy.get(".hierarchy-items-container").contains(datasource).click()
+            switchSchema("randomText")
+            
+            // No tables displayed
+            cy.get(".spectrum-Body").eq(2).should('contain', 'No tables found')
+            
+            // Previously created query should be visible
+            cy.get(".spectrum-Table-body").should('contain', queryName)
+        })
+        
+        it("should switch schemas", () => {
+            // Switch schema - To one with tables
+            switchSchema("1")
+            
+            // Confirm tables exist - Check for specific one
+            cy.get(".spectrum-Table-body").eq(0).should('contain', 'test')
+            cy.get(".spectrum-Table-body").eq(0).find('tr').its('length').should('eq', 1)
+            
+            // Confirm specific table visible within left nav bar
+            cy.get(".hierarchy-items-container").should('contain', 'test')
+            
+            // Switch back to public schema
+            switchSchema("public")
+            
+            // Confirm tables exist - again
+            cy.get(".spectrum-Table-body").eq(0).should('contain', 'REGIONS')
+            cy.get(".spectrum-Table-body").eq(0)
+            .find('tr').its('length').should('be.gt', 1)
+            
+            // Confirm specific table visible within left nav bar
+            cy.get(".hierarchy-items-container").should('contain', 'REGIONS')
+            
+            // No relationships and one query
+            cy.get(".spectrum-Body").eq(3).should('contain', 'No relationships configured.')
+            cy.get(".spectrum-Table-body").eq(1).should('contain', queryName)
+        })
+        
+        it("should duplicate a query", () => {
+            // Get last nav item - The query
+            cy.get(".nav-item").last().within(() => {
+                    cy.get(".icon").eq(1).click({ force: true })
+                })
+            // Select and confirm duplication
+            cy.get(".spectrum-Menu").contains("Duplicate").click()
+            cy.get(".nav-item").should('contain', queryName + ' (1)')
+        })
+        
+        it("should edit a query name", () => {
+            // Access query
+            cy.get(".hierarchy-items-container").contains(queryName + ' (1)').click()
+            
+            // Rename query
+            cy.get(".spectrum-Form-item").eq(0).within(() => {
+                cy.get("input").clear().type(queryRename)
+            })
+            
+            // Run and Save query
+            cy.get(".spectrum-Button").contains("Run Query").click({ force: true })
+            cy.wait(500)
+            cy.get(".spectrum-Button").contains("Save Query").click({ force: true })
+            cy.get(".nav-item").should('contain', queryRename)
+        })
+        
+        it("should delete a query", () => {
+            // Get last nav item - The query
+            for (let i = 0; i < 2; i++) {
+                cy.get(".nav-item").last().within(() => {
+                    cy.get(".icon").eq(1).click({ force: true })
+                })
+                // Select Delete
+                cy.get(".spectrum-Menu").contains("Delete").click()
+                cy.get(".spectrum-Button").contains("Delete Query").click({ force: true })
+                cy.wait(1000)
+            }
+            // Confirm deletion
+            cy.get(".nav-item").should('not.contain', queryName)
+            cy.get(".nav-item").should('not.contain', queryRename)
+        })
+        
+        const switchSchema = (schema) => {
+            // Edit configuration - Change Schema
+            cy.get(".spectrum-Textfield").eq(6).within(() => {
+                cy.get('input').clear().type(schema)
+            })
+            // Save configuration & fetch
+            cy.get(".spectrum-Button").contains("Save").click({ force: true })
+            cy.get(".spectrum-Button").contains("Fetch tables").click({ force: true })
+            // Click fetch tables again within modal
+            cy.get(".spectrum-Dialog-grid").within(() => {
+                cy.get(".spectrum-Button").contains("Fetch tables").click({ force: true })
+            })
+            cy.reload()
+            cy.wait(5000)
+        }
+    }
+})

packages/builder/cypress/integration/datasources/rest.spec.js

@@ -0,0 +1,39 @@
+context("REST Datasource Testing", () => {
+    before(() => {
+      cy.login()
+      cy.createTestApp()
+    })
+    
+    const datasource = "REST"
+    const restUrl = "https://api.openbrewerydb.org/breweries"
+    
+    it("Should add REST data source with incorrect API", () => {
+        // Select REST data source
+        cy.selectExternalDatasource(datasource)
+        // Enter incorrect api & attempt to send query
+        cy.wait(500)
+        cy.get(".spectrum-Button").contains("Add query").click({ force: true })
+        cy.intercept('**/preview').as('queryError')
+        cy.get("input").clear().type("random text")
+        cy.get(".spectrum-Button").contains("Send").click({ force: true })
+        // Intercept Request after button click & apply assertions
+        cy.wait("@queryError")
+        cy.get("@queryError").its('response.body')
+        .should('have.property', 'message', 'request to http://random/%20text? failed, reason: getaddrinfo ENOTFOUND random')
+        cy.get("@queryError").its('response.body')
+        .should('have.property', 'status', 400)
+    })
+    
+    it("should add and configure a REST datasource", () => {
+        // Select REST datasource and create query
+        cy.selectExternalDatasource(datasource)
+        cy.wait(500)
+        // createRestQuery confirms query creation
+        cy.createRestQuery("GET", restUrl)
+        // Confirm status code response within REST datasource
+        cy.get(".spectrum-FieldLabel")
+        .contains("Status")
+        .children()
+        .should('contain', 200)
+    })
+})

packages/builder/cypress/integration/queryLevelTransformers.spec.js

@@ -0,0 +1,112 @@
+context("Query Level Transformers", () => {
+  before(() => {
+    cy.login()
+    cy.deleteApp("Cypress Tests")
+    cy.createApp("Cypress Tests")
+  })
+    
+  it("should write a transformer function", () => {
+      // Add REST datasource - contains API for breweries
+      const datasource = "REST"
+      const restUrl = "https://api.openbrewerydb.org/breweries"
+      cy.selectExternalDatasource(datasource)
+      cy.createRestQuery("GET", restUrl)
+      cy.get(".spectrum-Tabs-itemLabel").contains("Transformer").click()
+      // Get Transformer Function from file
+      cy.readFile("cypress/support/queryLevelTransformerFunction.js").then((transformerFunction) => {
+        cy.get(".CodeMirror textarea")
+        // Highlight current text and overwrite with file contents
+        .type(Cypress.platform === 'darwin' ? '{cmd}a' : '{ctrl}a', { force: true })
+        .type(transformerFunction, { parseSpecialCharSequences: false })
+      })
+      // Send Query
+      cy.intercept('**/queries/preview').as('query')
+      cy.get(".spectrum-Button").contains("Send").click({ force: true })
+      cy.wait("@query")
+      // Assert against Status Code, body, & body rows
+      cy.get("@query").its('response.statusCode')
+      .should('eq', 200)
+      cy.get("@query").its('response.body').should('not.be.empty')
+      cy.get("@query").its('response.body.rows').should('not.be.empty')
+    })
+      
+  it("should add data to the previous query", () => {
+    // Add REST datasource - contains API for breweries
+    const datasource = "REST"
+    const restUrl = "https://api.openbrewerydb.org/breweries"
+    cy.selectExternalDatasource(datasource)
+    cy.createRestQuery("GET", restUrl)
+    cy.get(".spectrum-Tabs-itemLabel").contains("Transformer").click()
+    // Get Transformer Function with Data from file
+    cy.readFile("cypress/support/queryLevelTransformerFunctionWithData.js").then((transformerFunction) => {
+      //console.log(transformerFunction[1])
+      cy.get(".CodeMirror textarea")
+      // Highlight current text and overwrite with file contents
+      .type(Cypress.platform === 'darwin' ? '{cmd}a' : '{ctrl}a', { force: true })
+      .type(transformerFunction, { parseSpecialCharSequences: false })
+    })
+    // Send Query
+    cy.intercept('**/queries/preview').as('query')
+    cy.get(".spectrum-Button").contains("Send").click({ force: true })
+    cy.wait("@query")
+    // Assert against Status Code, body, & body rows
+    cy.get("@query").its('response.statusCode')
+    .should('eq', 200)
+    cy.get("@query").its('response.body').should('not.be.empty')
+    cy.get("@query").its('response.body.rows').should('not.be.empty')
+  })
+  
+  it("should run an invalid query within the transformer section", () => {
+    // Add REST datasource - contains API for breweries
+    const datasource = "REST"
+    const restUrl = "https://api.openbrewerydb.org/breweries"
+    cy.selectExternalDatasource(datasource)
+    cy.createRestQuery("GET", restUrl)
+    cy.get(".spectrum-Tabs-itemLabel").contains("Transformer").click()
+    // Clear the code box and add "test"
+    cy.get(".CodeMirror textarea")
+    .type(Cypress.platform === 'darwin' ? '{cmd}a' : '{ctrl}a', { force: true })
+    .type("test")
+    // Run Query and intercept
+    cy.intercept('**/preview').as('queryError')
+    cy.get(".spectrum-Button").contains("Send").click({ force: true })
+    cy.wait("@queryError")
+    cy.wait(500)
+    // Assert against message and status for the query error
+    cy.get("@queryError").its('response.body').should('have.property', 'message', "test is not defined")
+    cy.get("@queryError").its('response.body').should('have.property', 'status', 400)
+  })
+  
+  it("should run an invalid query via POST request", () => {
+    // POST request with transformer as null
+    cy.request({method: 'POST',
+    url: `${Cypress.config().baseUrl}/api/queries/`,
+    body: {fields : {"headers":{},"queryString":null,"path":null},
+    parameters : [],
+    schema : {},
+    name : "test",
+    queryVerb : "read",
+    transformer : null,
+    datasourceId: "test"},
+    // Expected 400 error - Transformer must be a string
+    failOnStatusCode: false}).then((response) => {
+      expect(response.status).to.equal(400)
+      expect(response.body.message).to.include('Invalid body - "transformer" must be a string')
+    })
+  })
+  
+  it("should run an empty query", () => {
+    // POST request with Transformer as an empty string
+    cy.request({method: 'POST',
+    url: `${Cypress.config().baseUrl}/api/queries/preview`,
+    body: {fields : {"headers":{},"queryString":null,"path":null},
+    queryVerb : "read",
+    transformer : "",
+    datasourceId: "test"},
+    // Expected 400 error - Transformer is not allowed to be empty
+    failOnStatusCode: false}).then((response) => {
+      expect(response.status).to.equal(400)
+      expect(response.body.message).to.include('Invalid body - "transformer" is not allowed to be empty')
+    })
+  })
+})

packages/builder/cypress/integration/renameAnApplication.spec.js

@@ -5,17 +5,24 @@ context("Rename an App", () => {
     })
 
 it("should rename an unpublished application", () => {
+    const appName = "Cypress Tests"
     const appRename = "Cypress Renamed"
     // Rename app, Search for app, Confirm name was changed
     cy.get(".home-logo").click()
-    renameApp(appRename)
+    renameApp(appName, appRename)
+    cy.reload()
+    cy.wait(1000)
     cy.searchForApplication(appRename)
     cy.get(".appTable").find(".title").should("have.length", 1)
-    cy.deleteApp(appRename)
+    // Set app name back to Cypress Tests
+    cy.reload()
+    cy.wait(1000)
+    renameApp(appRename, appName)
 })
     
 xit("Should rename a published application", () => {
     // It is not possible to rename a published application
+    const appName = "Cypress Tests"
     const appRename = "Cypress Renamed"
     // Publish the app
     cy.get(".toprightnav")
@@ -27,24 +34,28 @@ xit("Should rename a published application", () => {
         })
     // Rename app, Search for app, Confirm name was changed
     cy.get(".home-logo").click()
-    renameApp(appRename, true)
+    renameApp(appName, appRename, true)
     cy.searchForApplication(appRename)
-    cy.get(".appTable").find(".title").should("have.length", 1)
+    cy.get(".appTable").find(".wrapper").should("have.length", 1)
 })
 
 it("Should try to rename an application to have no name", () => {
+    const appName = "Cypress Tests"
     cy.get(".home-logo").click()
-    renameApp(" ", false, true)
+    renameApp(appName, " ", false, true)
+    cy.wait(500)
     // Close modal and confirm name has not been changed
     cy.get(".spectrum-Dialog-grid").contains("Cancel").click()
-    cy.searchForApplication("Cypress Tests")
+    cy.reload() 
+    cy.wait(1000)
+    cy.searchForApplication(appName)
     cy.get(".appTable").find(".title").should("have.length", 1)
 })
 
 xit("Should create two applications with the same name", () => {
     // It is not possible to have applications with the same name
     const appName = "Cypress Tests"
-    cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
+    cy.visit(`${Cypress.config().baseUrl}/builder`)
     cy.wait(500)
     cy.get(".spectrum-Button").contains("Create app").click({force: true})
     cy.contains(/Start from scratch/).click()
@@ -59,22 +70,35 @@ xit("Should create two applications with the same name", () => {
 it("should validate application names", () => {
     // App name must be letters, numbers and spaces only
     // This test checks numbers and special characters specifically
+    const appName = "Cypress Tests"
     const numberName = 12345
     const specialCharName = "£$%^"
     cy.get(".home-logo").click()
-    renameApp(numberName)
+    renameApp(appName, numberName)
+    cy.reload()
+    cy.wait(1000)
     cy.searchForApplication(numberName)
     cy.get(".appTable").find(".title").should("have.length", 1)
-    renameApp(specialCharName)
+    cy.reload()
+    cy.wait(1000)
+    renameApp(numberName, specialCharName)
     cy.get(".error").should("have.text", "App name must be letters, numbers and spaces only")
+    // Set app name back to Cypress Tests
+    cy.reload()
+    cy.wait(1000)
+    renameApp(numberName, appName)
 })
     
-    const renameApp = (appName, published, noName) => {
+    const renameApp = (originalName, changedName, published, noName) => {
-    cy.request(`localhost:${Cypress.env("PORT")}/api/applications?status=all`)
+        cy.searchForApplication(originalName)
+        cy.request(`${Cypress.config().baseUrl}/api/applications?status=all`)
     .its("body")
     .then(val => {
         if (val.length > 0) {
-            cy.get(".appTable > :nth-child(5) > :nth-child(2) > .spectrum-Icon").click()
+            cy.get(".appTable")
+            .within(() => {
+                cy.get(".spectrum-Icon").eq(1).click()
+                })
             // Check for when an app is published
             if (published == true){
                 // Should not have Edit as option, will unpublish app
@@ -93,7 +117,7 @@ it("should validate application names", () => {
                     return cy
                 }
                 cy.get("input").clear()
-                cy.get("input").eq(0).type(appName).should("have.value", appName).blur()
+                cy.get("input").eq(0).type(changedName).should("have.value", changedName).blur()
                 cy.get(".spectrum-ButtonGroup").contains("Save").click({force: true})
                 cy.wait(500)
       })

packages/builder/cypress/integration/revertApp.spec.js

@@ -0,0 +1,62 @@
+context("Revert apps", () => {
+    before(() => {
+    cy.login()
+    cy.createTestApp()
+    })
+    
+    it("should try to revert an unpublished app", () => {
+        // Click revert icon
+        cy.get(".toprightnav").within(() => {
+            cy.get(".spectrum-Icon").eq(1).click()
+        })
+        cy.get(".spectrum-Dialog-grid").within(() => {
+            // Enter app name before revert
+            cy.get("input").type("Cypress Tests")
+            cy.intercept('**/revert').as('revertApp')
+            // Click Revert
+            cy.get(".spectrum-Button").contains("Revert").click({ force: true })
+            // Intercept Request after button click & apply assertions
+            cy.wait("@revertApp")
+            cy.get("@revertApp").its('response.body').should('have.property', 'message', "App has not yet been deployed")
+            cy.get("@revertApp").its('response.body').should('have.property', 'status', 400)
+        })
+    })
+    
+    it("should revert a published app", () => {
+        // Add initial component - Paragraph
+        cy.addComponent("Elements", "Paragraph")
+        // Publish app
+        cy.get(".spectrum-Button").contains("Publish").click({ force: true })
+        cy.get(".spectrum-ButtonGroup").within(() => {
+            cy.get(".spectrum-Button").contains("Publish").click({ force: true })
+        })
+        // Add second component - Button
+        cy.addComponent("Elements", "Button")
+        // Click Revert
+        cy.get(".toprightnav").within(() => {
+            cy.get(".spectrum-Icon").eq(1).click()
+        })
+        cy.get(".spectrum-Dialog-grid").within(() => {
+            // Click Revert
+            cy.get(".spectrum-Button").contains("Revert").click({ force: true })
+            cy.wait(1000)
+        })
+        // Confirm Paragraph component is still visible
+        cy.get(".root").contains("New Paragraph")
+        // Confirm Button component is not visible
+        cy.get(".root").should("not.have.text", "New Button")
+    })
+    
+    it("should enter incorrect app name when reverting", () => {
+        // Click Revert
+        cy.get(".toprightnav").within(() => {
+            cy.get(".spectrum-Icon").eq(1).click()
+        })
+        // Enter incorrect app name
+        cy.get(".spectrum-Dialog-grid").within(() => {
+            cy.get("input").type("Cypress Tests")
+            // Revert button within modal should be disabled
+            cy.get(".spectrum-Button").eq(1).should('be.disabled')
+        })
+    })
+})

packages/builder/cypress/support/commands.js

@@ -10,7 +10,7 @@ Cypress.on("uncaught:exception", () => {
 })
 
 Cypress.Commands.add("login", () => {
-  cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
+  cy.visit(`${Cypress.config().baseUrl}/builder`)
   cy.wait(2000)
   cy.url().then(url => {
     if (url.includes("builder/admin")) {
@@ -33,31 +33,77 @@ Cypress.Commands.add("login", () => {
 })
 
 Cypress.Commands.add("createApp", name => {
-  cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
+  cy.visit(`${Cypress.config().baseUrl}/builder`)
   cy.wait(500)
+  cy.request(`${Cypress.config().baseUrl}/api/applications?status=all`)
+    .its("body")
+    .then(body => {
+      if (body.length > 0) {
+        cy.get(".spectrum-Button").contains("Create app").click({ force: true })
+      }
+    })
   cy.contains(/Start from scratch/).dblclick()
+  cy.wait(2000)
   cy.get(".spectrum-Modal").within(() => {
     cy.get("input").eq(0).type(name).should("have.value", name).blur()
     cy.get(".spectrum-ButtonGroup").contains("Create app").click()
-    cy.wait(7000)
+    cy.wait(5000)
   })
+  cy.createTable("Cypress Tests", true)
 })
 
-Cypress.Commands.add("deleteApp", appName => {
+Cypress.Commands.add("deleteApp", name => {
-  cy.visit(`localhost:${Cypress.env("PORT")}/builder`)
+  cy.visit(`${Cypress.config().baseUrl}/builder`)
-  cy.wait(1000)
+  cy.wait(2000)
-  cy.request(`localhost:${Cypress.env("PORT")}/api/applications?status=all`)
+  cy.request(`${Cypress.config().baseUrl}/api/applications?status=all`)
     .its("body")
     .then(val => {
       if (val.length > 0) {
-        cy.get(
+        cy.searchForApplication(name)
-          ".appTable > :nth-child(5) > :nth-child(2) > .spectrum-Icon"
+        cy.get(".appTable").within(() => {
-        ).click()
+          cy.get(".spectrum-Icon").eq(1).click()
-        cy.contains("Delete").click()
+        })
-        cy.get(".spectrum-Modal").within(() => {
+        cy.get(".spectrum-Menu").then($menu => {
-          cy.get("input").type(appName)
+          if ($menu.text().includes("Unpublish")) {
-          cy.get(".spectrum-Button--warning").click()
+            cy.get(".spectrum-Menu").contains("Unpublish").click()
+            cy.get(".spectrum-Dialog-grid").contains("Unpublish app").click()
+          } else {
+            cy.get(".spectrum-Menu").contains("Delete").click()
+            cy.get(".spectrum-Dialog-grid").within(() => {
+              cy.get("input").type(name)
+            })
+            cy.get(".spectrum-Button--warning").click()
+          }
         })
+      } else {
+        return
+      }
+    })
+})
+
+Cypress.Commands.add("deleteAllApps", () => {
+  cy.visit(`${Cypress.config().baseUrl}/builder`)
+  cy.wait(500)
+  cy.request(`${Cypress.config().baseUrl}/api/applications?status=all`)
+    .its("body")
+    .then(val => {
+      for (let i = 0; i < val.length; i++) {
+        cy.get(".spectrum-Heading")
+          .eq(1)
+          .then(app => {
+            const name = app.text()
+            cy.get(".title")
+              .children()
+              .within(() => {
+                cy.get(".spectrum-Icon").eq(0).click()
+              })
+            cy.get(".spectrum-Menu").contains("Delete").click()
+            cy.get(".spectrum-Dialog-grid").within(() => {
+              cy.get("input").type(name)
+              cy.get(".spectrum-Button--warning").click()
+            })
+            cy.reload()
+          })
       }
     })
 })
@@ -66,6 +112,7 @@ Cypress.Commands.add("createTestApp", () => {
   const appName = "Cypress Tests"
   cy.deleteApp(appName)
   cy.createApp(appName, "This app is used for Cypress testing.")
+  cy.createScreen("home", "home")
 })
 
 Cypress.Commands.add("createTestTableWithData", () => {
@@ -74,10 +121,18 @@ Cypress.Commands.add("createTestTableWithData", () => {
   cy.addColumn("dog", "age", "Number")
 })
 
-Cypress.Commands.add("createTable", tableName => {
+Cypress.Commands.add("createTable", (tableName, initialTable) => {
-  cy.contains("Budibase DB").click()
+  if (!initialTable) {
-  cy.contains("Create new table").click()
+    cy.navigateToDataSection()
-
+    cy.get(".add-button").click()
+  }
+  cy.wait(7000)
+  cy.get(".spectrum-Modal")
+    .contains("Budibase DB")
+    .click()
+    .then(() => {
+      cy.get(".spectrum-Button").contains("Continue").click({ force: true })
+    })
   cy.get(".spectrum-Modal").within(() => {
     cy.wait(1000)
     cy.get("input").first().type(tableName).blur()
@@ -184,22 +239,49 @@ Cypress.Commands.add("navigateToFrontend", () => {
   cy.wait(1000)
   cy.contains("Design").click()
   cy.get(".spectrum-Search").type("/")
-  cy.createScreen("home", "home")
-  cy.addComponent("Elements", "Headline")
   cy.get(".nav-item").contains("home").click()
 })
 
+Cypress.Commands.add("navigateToDataSection", () => {
+  // Clicks on the Data tab
+  cy.wait(500)
+  cy.contains("Data").click()
+})
+
 Cypress.Commands.add("createScreen", (screenName, route) => {
+  cy.contains("Design").click()
   cy.get("[aria-label=AddCircle]").click()
   cy.get(".spectrum-Modal").within(() => {
-    cy.get(".item").first().click()
+    cy.get(".item").contains("Blank").click()
-    cy.get(".spectrum-Button--cta").click()
+    cy.get(".spectrum-Button").contains("Add Screens").click({ force: true })
+    cy.wait(500)
+  })
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    cy.get(".spectrum-Form-itemField").eq(0).type(screenName)
+    cy.get(".spectrum-Form-itemField").eq(1).type(route)
+    cy.get(".spectrum-Button").contains("Continue").click({ force: true })
+    cy.wait(1000)
   })
+})
+
+Cypress.Commands.add("createAutogeneratedScreens", screenNames => {
+  // Screen name must already exist within data source
+  cy.contains("Design").click()
+  cy.get("[aria-label=AddCircle]").click()
+  for (let i = 0; i < screenNames.length; i++) {
+    cy.get(".item").contains(screenNames[i]).click()
+  }
+  cy.get(".spectrum-Button").contains("Add Screens").click({ force: true })
+  cy.wait(2000)
+})
+
+Cypress.Commands.add("addRow", values => {
+  cy.contains("Create row").click()
   cy.get(".spectrum-Modal").within(() => {
-    cy.get("input").first().clear().type(screenName)
+    for (let i = 0; i < values.length; i++) {
-    cy.get("input").eq(1).clear().type(route)
+      cy.get("input").eq(i).type(values[i]).blur()
-    cy.get(".spectrum-Button--cta").click()
+    }
-    cy.wait(2000)
+    cy.get(".spectrum-ButtonGroup").contains("Create").click()
   })
 })
 
@@ -237,7 +319,145 @@ Cypress.Commands.add("addCustomSourceOptions", totalOptions => {
 })
 
 Cypress.Commands.add("searchForApplication", appName => {
-  cy.get(".spectrum-Textfield").within(() => {
+  cy.wait(1000)
-    cy.get("input").eq(0).type(appName)
+  // Searches for the app
+  cy.get(".filter").then(() => {
+    cy.get(".spectrum-Textfield").within(() => {
+      cy.get("input").eq(0).type(appName)
+    })
+  })
+  // Confirms app exists after search
+  cy.get(".appTable").contains(appName)
+})
+
+Cypress.Commands.add("selectExternalDatasource", datasourceName => {
+  // Navigates to Data Section
+  cy.navigateToDataSection()
+  // Open Data Source modal
+  cy.get(".nav").within(() => {
+    cy.get(".add-button").click()
+  })
+  // Clicks specified datasource & continue
+  cy.get(".item-list").contains(datasourceName).click()
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    cy.get(".spectrum-Button").contains("Continue").click({ force: true })
+  })
+})
+
+Cypress.Commands.add("addDatasourceConfig", (datasource, skipFetch) => {
+  // selectExternalDatasource should be called prior to this
+  // Adds the config for specified datasource & fetches tables
+  // Currently supports MySQL, PostgreSQL, Oracle
+  // Host IP Address
+  cy.wait(500)
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    cy.get(".form-row")
+      .eq(0)
+      .within(() => {
+        cy.get(".spectrum-Textfield").within(() => {
+          cy.log(datasource)
+          if (datasource == "Oracle") {
+            cy.get("input").clear().type(Cypress.env("oracle").HOST)
+          } else {
+            cy.get("input").clear().type(Cypress.env("HOST_IP"))
+          }
+        })
+      })
+  })
+  // Database Name
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    if (datasource == "MySQL") {
+      cy.get(".form-row")
+        .eq(4)
+        .within(() => {
+          cy.get("input").clear().type(Cypress.env("mysql").DATABASE)
+        })
+    } else {
+      cy.get(".form-row")
+        .eq(2)
+        .within(() => {
+          if (datasource == "PostgreSQL") {
+            cy.get("input").clear().type(Cypress.env("postgresql").DATABASE)
+          }
+          if (datasource == "Oracle") {
+            cy.get("input").clear().type(Cypress.env("oracle").DATABASE)
+          }
+        })
+    }
+  })
+  // User
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    if (datasource == "MySQL") {
+      cy.get(".form-row")
+        .eq(2)
+        .within(() => {
+          cy.get("input").clear().type(Cypress.env("mysql").USER)
+        })
+    } else {
+      cy.get(".form-row")
+        .eq(3)
+        .within(() => {
+          if (datasource == "PostgreSQL") {
+            cy.get("input").clear().type(Cypress.env("postgresql").USER)
+          }
+          if (datasource == "Oracle") {
+            cy.get("input").clear().type(Cypress.env("oracle").USER)
+          }
+        })
+    }
+  })
+  // Password
+  cy.get(".spectrum-Dialog-grid").within(() => {
+    if (datasource == "MySQL") {
+      cy.get(".form-row")
+        .eq(3)
+        .within(() => {
+          cy.get("input").clear().type(Cypress.env("mysql").PASSWORD)
+        })
+    } else {
+      cy.get(".form-row")
+        .eq(4)
+        .within(() => {
+          if (datasource == "PostgreSQL") {
+            cy.get("input").clear().type(Cypress.env("postgresql").PASSWORD)
+          }
+          if (datasource == "Oracle") {
+            cy.get("input").clear().type(Cypress.env("oracle").PASSWORD)
+          }
+        })
+    }
   })
+  // Click to fetch tables
+  if (skipFetch) {
+    cy.get(".spectrum-Dialog-grid").within(() => {
+      cy.get(".spectrum-Button")
+        .contains("Skip table fetch")
+        .click({ force: true })
+    })
+  } else {
+    cy.get(".spectrum-Dialog-grid").within(() => {
+      cy.get(".spectrum-Button")
+        .contains("Save and fetch tables")
+        .click({ force: true })
+      cy.wait(1000)
+    })
+  }
+})
+
+Cypress.Commands.add("createRestQuery", (method, restUrl) => {
+  // addExternalDatasource should be called prior to this
+  // Configures REST datasource & sends query
+  cy.wait(500)
+  cy.get(".spectrum-Button").contains("Add query").click({ force: true })
+  // Select Method & add Rest URL
+  cy.get(".spectrum-Picker-label").eq(1).click()
+  cy.get(".spectrum-Menu").contains(method).click()
+  cy.get("input").clear().type(restUrl)
+  // Send query
+  cy.get(".spectrum-Button").contains("Send").click({ force: true })
+  cy.wait(500)
+  cy.get(".spectrum-Button").contains("Save query").click({ force: true })
+  cy.get(".hierarchy-items-container")
+    .should("contain", method)
+    .and("contain", restUrl)
 })

packages/builder/cypress/support/queryLevelTransformerFunction.js

@@ -0,0 +1,14 @@
+// eslint-disable-next-line
+const breweries = data
+const totals = {}
+
+for (let brewery of breweries) {
+  const state = brewery.state
+  if (totals[state] == null) {
+    totals[state] = 1
+  } else {
+    totals[state]++
+  }
+}
+const entries = Object.entries(totals)
+return entries.map(([state, count]) => ({ state, count }))

packages/builder/cypress/support/queryLevelTransformerFunctionWithData.js

@@ -0,0 +1,31 @@
+// eslint-disable-next-line
+const breweries = data
+const totals = {}
+for (let brewery of breweries) {
+  const state = brewery.state
+  if (totals[state] == null) {
+    totals[state] = 1
+  } else {
+    totals[state]++
+  }
+}
+const stateCodes = {
+  texas: "tx",
+  colorado: "co",
+  florida: "fl",
+  iwoa: "ia",
+  louisiana: "la",
+  california: "ca",
+  pennsylvania: "pa",
+  georgia: "ga",
+  "new hampshire": "nh",
+  virginia: "va",
+  michigan: "mi",
+  maryland: "md",
+  ohio: "oh",
+}
+const entries = Object.entries(totals)
+return entries.map(([state, count]) => {
+  stateCodes[state.toLowerCase()]
+  return { state, count, flag: "http://flags.ox3.in/svg/us/${stateCode}.svg" }
+})

packages/builder/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/builder",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "license": "GPL-3.0",
   "private": true,
   "scripts": {
@@ -65,10 +65,10 @@
     }
   },
   "dependencies": {
-    "@budibase/bbui": "^1.0.27-alpha.19",
+    "@budibase/bbui": "^1.0.44-alpha.2",
-    "@budibase/client": "^1.0.27-alpha.19",
+    "@budibase/client": "^1.0.44-alpha.2",
     "@budibase/colorpicker": "1.1.2",
-    "@budibase/string-templates": "^1.0.27-alpha.19",
+    "@budibase/string-templates": "^1.0.44-alpha.2",
     "@sentry/browser": "5.19.1",
     "@spectrum-css/page": "^3.0.1",
     "@spectrum-css/vars": "^3.0.1",
@@ -95,7 +95,7 @@
     "@testing-library/jest-dom": "^5.11.10",
     "@testing-library/svelte": "^3.0.0",
     "babel-jest": "^26.6.3",
-    "cypress": "^5.1.0",
+    "cypress": "9.2.1",
     "cypress-terminal-report": "^1.4.1",
     "identity-obj-proxy": "^3.0.0",
     "jest": "^26.6.3",

packages/builder/src/builderStore/api.js

@@ -13,6 +13,9 @@ const apiCall =
       headers,
     })
     if (resp.status === 403) {
+      if (url.includes("/api/templates")) {
+        return { json: () => [] }
+      }
       removeCookie(Cookies.Auth)
       // reload after removing cookie, go to login
       if (!url.includes("self") && !url.includes("login")) {

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

@@ -126,7 +126,12 @@
     }
   }
 
+  function cancelEdit() {
+    field.name = originalName
+  }
+
   function deleteColumn() {
+    field.name = deleteColName
     if (field.name === $tables.selected.primaryDisplay) {
       notifications.error("You cannot delete the display column")
     } else {
@@ -307,6 +312,7 @@
   title={originalName ? "Edit Column" : "Create Column"}
   confirmText="Save Column"
   onConfirm={saveColumn}
+  onCancel={cancelEdit}
   disabled={invalid}
 >
   <Input
@@ -470,16 +476,16 @@
   onOk={deleteColumn}
   onCancel={hideDeleteDialog}
   title="Confirm Deletion"
-  disabled={deleteColName !== field.name}
+  disabled={deleteColName !== originalName}
 >
   <p>
-    Are you sure you wish to delete the column <b>{field.name}?</b>
+    Are you sure you wish to delete the column <b>{originalName}?</b>
     Your data will be deleted and this action cannot be undone - enter the column
     name to confirm.
   </p>
   <Input
     dataCy="delete-column-confirm"
     bind:value={deleteColName}
-    placeholder={field.name}
+    placeholder={originalName}
   />
 </ConfirmDialog>

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

@@ -9,6 +9,7 @@
     Select,
     Body,
     Layout,
+    ActionButton,
   } from "@budibase/bbui"
   import { onMount, createEventDispatcher } from "svelte"
   import { FIELDS } from "constants/backend"
@@ -20,8 +21,8 @@
   let dispatcher = createEventDispatcher()
   let mode = "Form"
   let fieldCount = 0
-  let fieldKeys = {},
+  let fieldKeys = [],
-    fieldTypes = {}
+    fieldTypes = []
   let keyValueOptions = [
     { label: "String", value: FIELDS.STRING.type },
     { label: "Number", value: FIELDS.NUMBER.type },
@@ -50,27 +51,48 @@
     if (!schema) {
       schema = {}
     }
-    let i = 0
+    // find the entries which aren't in the list
-    for (let [key, value] of Object.entries(schema)) {
+    const schemaEntries = Object.entries(schema).filter(
-      fieldKeys[i] = key
+      ([key]) => !fieldKeys.includes(key)
-      fieldTypes[i] = value.type
+    )
-      i++
+    for (let [key, value] of schemaEntries) {
+      fieldKeys.push(key)
+      fieldTypes.push(value.type)
     }
-    fieldCount = i
+    fieldCount = fieldKeys.length
   }
 
   function saveSchema() {
-    for (let i of Object.keys(fieldKeys)) {
+    const newSchema = {}
-      const key = fieldKeys[i]
+    for (let [index, key] of fieldKeys.entries()) {
       // they were added to schema, rather than generated
-      if (!schema[key]) {
+      newSchema[key] = {
-        schema[key] = {
+        ...schema[key],
-          type: fieldTypes[i],
+        type: fieldTypes[index],
-        }
       }
     }
+    dispatcher("save", { schema: newSchema, json })
+    schema = newSchema
+  }
 
-    dispatcher("save", { schema, json })
+  function removeKey(index) {
+    const keyToRemove = fieldKeys[index]
+    if (fieldKeys[index + 1] != null) {
+      fieldKeys[index] = fieldKeys[index + 1]
+      fieldTypes[index] = fieldTypes[index + 1]
+    }
+    fieldKeys.splice(index, 1)
+    fieldTypes.splice(index, 1)
+    fieldCount--
+    if (json) {
+      try {
+        const parsed = JSON.parse(json)
+        delete parsed[keyToRemove]
+        json = JSON.stringify(parsed, null, 2)
+      } catch (err) {
+        // json not valid, ignore
+      }
+    }
   }
 
   onMount(() => {
@@ -97,6 +119,7 @@
             getOptionValue={field => field.value}
             getOptionLabel={field => field.label}
           />
+          <ActionButton icon="Close" quiet on:click={() => removeKey(i)} />
         </div>
       {/each}
       <div class:add-field-btn={fieldCount !== 0}>
@@ -118,9 +141,9 @@
 <style>
   .horizontal {
     display: grid;
-    grid-template-columns: 30% 1fr;
+    grid-template-columns: 30% 1fr 40px;
     grid-gap: var(--spacing-s);
-    align-items: center;
+    align-items: end;
   }
 
   .add-field-btn {

packages/builder/src/components/design/PropertiesPanel/PropertyControls/FilterEditor/FilterDrawer.svelte

@@ -14,6 +14,7 @@
   import ClientBindingPanel from "components/common/bindings/ClientBindingPanel.svelte"
   import { generate } from "shortid"
   import { getValidOperatorsForType, OperatorOptions } from "constants/lucene"
+  import { getFields } from "helpers/searchFields"
 
   export let schemaFields
   export let filters = []
@@ -21,11 +22,8 @@
   export let panel = ClientBindingPanel
   export let allowBindings = true
 
-  const BannedTypes = ["link", "attachment", "formula", "json", "jsonarray"]
+  $: enrichedSchemaFields = getFields(schemaFields || [])
-
+  $: fieldOptions = enrichedSchemaFields.map(field => field.name) || []
-  $: fieldOptions = (schemaFields ?? [])
-    .filter(field => !BannedTypes.includes(field.type))
-    .map(field => field.name)
   $: valueTypeOptions = allowBindings ? ["Value", "Binding"] : ["Value"]
 
   const addFilter = () => {
@@ -53,7 +51,7 @@
 
   const onFieldChange = (expression, field) => {
     // Update the field type
-    expression.type = schemaFields.find(x => x.name === field)?.type
+    expression.type = enrichedSchemaFields.find(x => x.name === field)?.type
 
     // Ensure a valid operator is set
     const validOperators = getValidOperatorsForType(expression.type).map(
@@ -85,7 +83,7 @@
   }
 
   const getFieldOptions = field => {
-    const schema = schemaFields.find(x => x.name === field)
+    const schema = enrichedSchemaFields.find(x => x.name === field)
     return schema?.constraints?.inclusion || []
   }
 </script>

packages/builder/src/components/design/PropertiesPanel/PropertyControls/SearchFieldSelect.svelte

@@ -0,0 +1,47 @@
+<script>
+  import { Multiselect } from "@budibase/bbui"
+  import {
+    getDatasourceForProvider,
+    getSchemaForDatasource,
+  } from "builderStore/dataBinding"
+  import { currentAsset } from "builderStore"
+  import { tables } from "stores/backend"
+  import { createEventDispatcher } from "svelte"
+  import { getFields } from "helpers/searchFields"
+
+  export let componentInstance = {}
+  export let value = ""
+  export let placeholder
+
+  const dispatch = createEventDispatcher()
+  $: datasource = getDatasourceForProvider($currentAsset, componentInstance)
+  $: schema = getSchemaForDatasource($currentAsset, datasource).schema
+  $: options = getOptions(datasource, schema || {})
+  $: boundValue = getSelectedOption(value, options)
+
+  function getOptions(ds, dsSchema) {
+    let base = Object.values(dsSchema)
+    if (!ds?.tableId) {
+      return base
+    }
+    const currentTable = $tables.list.find(table => table._id === ds.tableId)
+    return getFields(base, { allowLinks: currentTable.sql }).map(
+      field => field.name
+    )
+  }
+
+  function getSelectedOption(selectedOptions, allOptions) {
+    // Fix the hardcoded default string value
+    if (!Array.isArray(selectedOptions)) {
+      selectedOptions = []
+    }
+    return selectedOptions.filter(val => allOptions.indexOf(val) !== -1)
+  }
+
+  const setValue = value => {
+    boundValue = getSelectedOption(value.detail, options)
+    dispatch("change", boundValue)
+  }
+</script>
+
+<Multiselect {placeholder} value={boundValue} on:change={setValue} {options} />

packages/builder/src/components/design/PropertiesPanel/PropertyControls/componentSettings.js

@@ -7,6 +7,7 @@ import ColorPicker from "./ColorPicker.svelte"
 import { IconSelect } from "./IconSelect"
 import FieldSelect from "./FieldSelect.svelte"
 import MultiFieldSelect from "./MultiFieldSelect.svelte"
+import SearchFieldSelect from "./SearchFieldSelect.svelte"
 import SchemaSelect from "./SchemaSelect.svelte"
 import SectionSelect from "./SectionSelect.svelte"
 import NavigationEditor from "./NavigationEditor/NavigationEditor.svelte"
@@ -30,6 +31,7 @@ const componentMap = {
   icon: IconSelect,
   field: FieldSelect,
   multifield: MultiFieldSelect,
+  searchfield: SearchFieldSelect,
   options: OptionsEditor,
   schema: SchemaSelect,
   section: SectionSelect,

packages/builder/src/constants/backend/index.js

@@ -229,3 +229,11 @@ export const PaginationLocations = [
   { label: "Query parameters", value: "query" },
   { label: "Request body", value: "body" },
 ]
+
+export const BannedSearchTypes = [
+  "link",
+  "attachment",
+  "formula",
+  "json",
+  "jsonarray",
+]

packages/builder/src/helpers/searchFields.js

@@ -0,0 +1,31 @@
+import { tables } from "../stores/backend"
+import { BannedSearchTypes } from "../constants/backend"
+import { get } from "svelte/store"
+
+export function getTableFields(linkField) {
+  const table = get(tables).list.find(table => table._id === linkField.tableId)
+  if (!table || !table.sql) {
+    return []
+  }
+  const linkFields = getFields(Object.values(table.schema), {
+    allowLinks: false,
+  })
+  return linkFields.map(field => ({
+    ...field,
+    name: `${table.name}.${field.name}`,
+  }))
+}
+
+export function getFields(fields, { allowLinks } = { allowLinks: true }) {
+  let filteredFields = fields.filter(
+    field => !BannedSearchTypes.includes(field.type)
+  )
+  if (allowLinks) {
+    const linkFields = fields.filter(field => field.type === "link")
+    for (let linkField of linkFields) {
+      // only allow one depth of SQL relationship filtering
+      filteredFields = filteredFields.concat(getTableFields(linkField))
+    }
+  }
+  return filteredFields
+}

packages/builder/src/pages/builder/_layout.svelte

@@ -2,6 +2,12 @@
   import { isActive, redirect, params } from "@roxi/routify"
   import { admin, auth } from "stores/portal"
   import { onMount } from "svelte"
+  import {
+    Cookies,
+    getCookie,
+    removeCookie,
+    setCookie,
+  } from "builderStore/cookies"
 
   let loaded = false
 
@@ -67,6 +73,24 @@
 
   $: {
     const apiReady = $admin.loaded && $auth.loaded
+
+    // firstly, set the return url
+    if (
+      loaded &&
+      apiReady &&
+      !$auth.user &&
+      !getCookie(Cookies.ReturnUrl) &&
+      // logout triggers a page refresh, so we don't want to set the return url
+      !$auth.postLogout &&
+      // don't set the return url on pre-login pages
+      !$isActive("./auth") &&
+      !$isActive("./invite") &&
+      !$isActive("./admin")
+    ) {
+      const url = window.location.pathname
+      setCookie(Cookies.ReturnUrl, url)
+    }
+
     // if tenant is not set go to it
     if (
       loaded &&
@@ -90,13 +114,20 @@
       !$isActive("./invite") &&
       !$isActive("./admin")
     ) {
-      const returnUrl = encodeURIComponent(window.location.pathname)
+      $redirect("./auth")
-      $redirect("./auth?", { returnUrl })
     }
     // check if password reset required for user
     else if ($auth.user?.forceResetPassword) {
       $redirect("./auth/reset")
     }
+    // lastly, redirect to the return url if it has been set
+    else if (loaded && apiReady && $auth.user) {
+      const returnUrl = getCookie(Cookies.ReturnUrl)
+      if (returnUrl) {
+        removeCookie(Cookies.ReturnUrl)
+        window.location.href = returnUrl
+      }
+    }
   }
 </script>
 

packages/builder/src/pages/builder/auth/login.svelte

@@ -10,7 +10,7 @@
     notifications,
     Link,
   } from "@budibase/bbui"
-  import { goto, params } from "@roxi/routify"
+  import { goto } from "@roxi/routify"
   import { auth, organisation, oidc, admin } from "stores/portal"
   import GoogleButton from "./_components/GoogleButton.svelte"
   import OIDCButton from "./_components/OIDCButton.svelte"
@@ -35,12 +35,8 @@
       if ($auth?.user?.forceResetPassword) {
         $goto("./reset")
       } else {
-        if ($params["?returnUrl"]) {
+        notifications.success("Logged in successfully")
-          window.location = decodeURIComponent($params["?returnUrl"])
+        $goto("../portal")
-        } else {
-          notifications.success("Logged in successfully")
-          $goto("../portal")
-        }
       }
     } catch (err) {
       console.error(err)

packages/builder/src/pages/builder/portal/apps/index.svelte

@@ -274,6 +274,9 @@
   onMount(async () => {
     await apps.load()
     await templates.load()
+    if ($templates?.length === 0) {
+      notifications.error("There was a problem loading quick start templates.")
+    }
     // if the portal is loaded from an external URL with a template param
     const initInfo = await auth.getInitInfo()
     if (initInfo?.init_template) {

packages/builder/src/stores/portal/auth.js

@@ -9,6 +9,7 @@ export function createAuthStore() {
     tenantId: "default",
     tenantSet: false,
     loaded: false,
+    postLogout: false,
   })
   const store = derived(auth, $store => {
     let initials = null
@@ -34,6 +35,7 @@ export function createAuthStore() {
       tenantId: $store.tenantId,
       tenantSet: $store.tenantSet,
       loaded: $store.loaded,
+      postLogout: $store.postLogout,
       initials,
       isAdmin,
       isBuilder,
@@ -89,6 +91,13 @@ export function createAuthStore() {
     return info
   }
 
+  async function setPostLogout() {
+    auth.update(store => {
+      store.postLogout = true
+      return store
+    })
+  }
+
   async function getInitInfo() {
     const response = await api.get(`/api/global/auth/init`)
     const json = response.json()
@@ -145,6 +154,7 @@ export function createAuthStore() {
       await response.json()
       await setInitInfo({})
       setUser(null)
+      setPostLogout()
     },
     updateSelf: async fields => {
       const newUser = { ...get(auth).user, ...fields }

packages/cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/cli",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Budibase CLI, for developers, self hosting and migrations.",
   "main": "src/index.js",
   "bin": {

packages/client/manifest.json

@@ -2236,7 +2236,7 @@
           "setting": "optionsSource",
           "value": "provider"
         }
-      }, 
+      },
       {
         "type": "options",
         "key": "customOptions",
@@ -2419,6 +2419,11 @@
         "label": "Label",
         "key": "label"
       },
+      {
+        "type": "text",
+        "label": "Extensions",
+        "key": "extensions"
+      },
       {
         "type": "boolean",
         "label": "Disabled",
@@ -2811,7 +2816,7 @@
         "key": "dataSource"
       },
       {
-        "type": "multifield",
+        "type": "searchfield",
         "label": "Search Columns",
         "key": "searchColumns",
         "placeholder": "Choose search columns"
@@ -2958,7 +2963,7 @@
         "key": "dataSource"
       },
       {
-        "type": "multifield",
+        "type": "searchfield",
         "label": "Search Columns",
         "key": "searchColumns",
         "placeholder": "Choose search columns"

packages/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/client",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "license": "MPL-2.0",
   "module": "dist/budibase-client.js",
   "main": "dist/budibase-client.js",
@@ -19,10 +19,10 @@
     "dev:builder": "rollup -cw"
   },
   "dependencies": {
-    "@budibase/bbui": "^1.0.27-alpha.19",
+    "@budibase/bbui": "^1.0.44-alpha.2",
-    "@budibase/frontend-core": "^1.0.27-alpha.19",
+    "@budibase/frontend-core": "^1.0.44-alpha.2",
     "@budibase/standard-components": "^0.9.139",
-    "@budibase/string-templates": "^1.0.27-alpha.19",
+    "@budibase/string-templates": "^1.0.44-alpha.2",
     "regexparam": "^1.3.0",
     "shortid": "^2.2.15",
     "svelte-spa-router": "^3.0.5"

packages/client/src/components/ClientApp.svelte

@@ -63,8 +63,9 @@
       } else {
         // The user is not logged in, redirect them to login
         const returnUrl = `${window.location.pathname}${window.location.hash}`
-        const encodedUrl = encodeURIComponent(returnUrl)
+        // TODO: reuse `Cookies` from builder when frontend-core is added
-        window.location = `/builder/auth/login?returnUrl=${encodedUrl}`
+        window.document.cookie = `budibase:returnurl=${returnUrl}; Path=/`
+        window.location = `/builder/auth/login`
       }
     }
   }

packages/client/src/components/app/DataProvider.svelte

@@ -66,6 +66,7 @@
   $: dataContext = {
     rows: $fetch.rows,
     info: $fetch.info,
+    datasource: dataSource || {},
     schema: $fetch.schema,
     rowsLength: $fetch.rows.length,
 

packages/client/src/components/app/blocks/CardsBlock.svelte

@@ -71,12 +71,13 @@
   const enrichFilter = (filter, columns, formId) => {
     let enrichedFilter = [...(filter || [])]
     columns?.forEach(column => {
+      const safePath = column.name.split(".").map(safe).join(".")
       enrichedFilter.push({
         field: column.name,
         operator: column.type === "string" ? "string" : "equal",
         type: column.type === "string" ? "string" : "number",
         valueType: "Binding",
-        value: `{{ [${formId}].[${column.name}] }}`,
+        value: `{{ ${safe(formId)}.${safePath} }}`,
       })
     })
     return enrichedFilter
@@ -112,7 +113,9 @@
   // Load the datasource schema so we can determine column types
   const fetchSchema = async dataSource => {
     if (dataSource) {
-      schema = await fetchDatasourceSchema(dataSource)
+      schema = await fetchDatasourceSchema(dataSource, {
+        enrichRelationships: true,
+      })
     }
     schemaLoaded = true
   }

packages/client/src/components/app/blocks/TableBlock.svelte

@@ -59,12 +59,13 @@
   const enrichFilter = (filter, columns, formId) => {
     let enrichedFilter = [...(filter || [])]
     columns?.forEach(column => {
+      const safePath = column.name.split(".").map(safe).join(".")
       enrichedFilter.push({
         field: column.name,
         operator: column.type === "string" ? "string" : "equal",
         type: column.type === "string" ? "string" : "number",
         valueType: "Binding",
-        value: `{{ ${safe(formId)}.${safe(column.name)} }}`,
+        value: `{{ ${safe(formId)}.${safePath} }}`,
       })
     })
     return enrichedFilter
@@ -90,7 +91,9 @@
   // Load the datasource schema so we can determine column types
   const fetchSchema = async dataSource => {
     if (dataSource) {
-      schema = await fetchDatasourceSchema(dataSource)
+      schema = await fetchDatasourceSchema(dataSource, {
+        enrichRelationships: true,
+      })
     }
     schemaLoaded = true
   }

packages/client/src/components/app/dynamic-filter/DynamicFilter.svelte

@@ -11,11 +11,14 @@
   export let size = "M"
 
   const component = getContext("component")
-  const { builderStore, ActionTypes, getAction } = getContext("sdk")
+  const { builderStore, ActionTypes, getAction, fetchDatasourceSchema } =
+    getContext("sdk")
 
   let modal
   let tmpFilters = []
   let filters = []
+  let schemaLoaded = false,
+    schema
 
   $: dataProviderId = dataProvider?.id
   $: addExtension = getAction(
@@ -26,7 +29,7 @@
     dataProviderId,
     ActionTypes.RemoveDataProviderQueryExtension
   )
-  $: schema = dataProvider?.schema
+  $: fetchSchema(dataProvider || {})
   $: schemaFields = getSchemaFields(schema, allowedFields)
 
   // Add query extension to data provider
@@ -39,7 +42,20 @@
     }
   }
 
-  const getSchemaFields = (schema, allowedFields) => {
+  async function fetchSchema(dataProvider) {
+    const datasource = dataProvider?.datasource
+    if (datasource) {
+      schema = await fetchDatasourceSchema(datasource, {
+        enrichRelationships: true,
+      })
+    }
+    schemaLoaded = true
+  }
+
+  function getSchemaFields(schema, allowedFields) {
+    if (!schemaLoaded) {
+      return {}
+    }
     let clonedSchema = {}
     if (!allowedFields?.length) {
       clonedSchema = schema
@@ -68,18 +84,20 @@
   })
 </script>
 
-<Button
+{#if schemaLoaded}
-  onClick={openEditor}
+  <Button
-  icon="Properties"
+    onClick={openEditor}
-  text="Filter"
+    icon="Properties"
-  {size}
+    text="Filter"
-  type="secondary"
+    {size}
-  quiet
+    type="secondary"
-  active={filters?.length > 0}
+    quiet
-/>
+    active={filters?.length > 0}
+  />
 
-<Modal bind:this={modal}>
+  <Modal bind:this={modal}>
-  <ModalContent title="Edit filters" size="XL" onConfirm={updateQuery}>
+    <ModalContent title="Edit filters" size="XL" onConfirm={updateQuery}>
-    <FilterModal bind:filters={tmpFilters} {schemaFields} />
+      <FilterModal bind:filters={tmpFilters} {schemaFields} />
-  </ModalContent>
+    </ModalContent>
-</Modal>
+  </Modal>
+{/if}

packages/client/src/components/app/forms/AttachmentField.svelte

@@ -7,6 +7,7 @@
   export let label
   export let disabled = false
   export let validation
+  export let extensions
 
   let fieldState
   let fieldApi
@@ -52,6 +53,7 @@
       }}
       {processFiles}
       {handleFileTooLarge}
+      {extensions}
     />
   {/if}
 </Field>

packages/client/src/components/app/forms/InnerForm.svelte

@@ -141,8 +141,18 @@
         return
       }
 
+      // Create validation function based on field schema
+      const schemaConstraints = schema?.[field]?.constraints
+      const validator = createValidatorFromConstraints(
+        schemaConstraints,
+        validationRules,
+        field,
+        table
+      )
+
       // If we've already registered this field then keep some existing state
       let initialValue = deepGet(initialValues, field) ?? defaultValue
+      let initialError = null
       let fieldId = `id-${generateID()}`
       const existingField = getField(field)
       if (existingField) {
@@ -156,20 +166,17 @@
         } else {
           initialValue = fieldState.value ?? initialValue
         }
+
+        // If this field has already been registered and we previously had an
+        // error set, then re-run the validator to see if we can unset it
+        if (fieldState.error) {
+          initialError = validator(initialValue)
+        }
       }
 
       // Auto columns are always disabled
       const isAutoColumn = !!schema?.[field]?.autocolumn
 
-      // Create validation function based on field schema
-      const schemaConstraints = schema?.[field]?.constraints
-      const validator = createValidatorFromConstraints(
-        schemaConstraints,
-        validationRules,
-        field,
-        table
-      )
-
       // Construct field info
       const fieldInfo = writable({
         name: field,
@@ -178,7 +185,7 @@
         fieldState: {
           fieldId,
           value: initialValue,
-          error: null,
+          error: initialError,
           disabled: disabled || fieldDisabled || isAutoColumn,
           defaultValue,
           validator,

packages/client/src/components/app/forms/MultiFieldSelect.svelte

@@ -20,6 +20,7 @@
   let fieldSchema
 
   $: flatOptions = optionsSource == null || optionsSource === "schema"
+  $: expandedDefaultValue = expand(defaultValue)
   $: options = getOptions(
     optionsSource,
     fieldSchema,
@@ -28,6 +29,18 @@
     valueColumn,
     customOptions
   )
+
+  const expand = values => {
+    if (!values) {
+      return []
+    }
+
+    if (Array.isArray(values)) {
+      return values
+    }
+
+    return values.split(",").map(value => value.trim())
+  }
 </script>
 
 <Field
@@ -35,7 +48,7 @@
   {label}
   {disabled}
   {validation}
-  {defaultValue}
+  defaultValue={expandedDefaultValue}
   type="array"
   bind:fieldState
   bind:fieldApi

packages/client/src/components/app/forms/validation.js

@@ -37,7 +37,7 @@ export const createValidatorFromConstraints = (
       const length = schemaConstraints.length.maximum
       rules.push({
         type: "string",
-        constraint: "length",
+        constraint: "maxLength",
         value: length,
         error: `Maximum length is ${length}`,
       })

packages/frontend-core/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/frontend-core",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Budibase frontend core libraries used in builder and client",
   "author": "Budibase",
   "license": "GPL-3.0",

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

@@ -67,7 +67,6 @@ export default class DataFetch {
     this.getPage = this.getPage.bind(this)
     this.getInitialData = this.getInitialData.bind(this)
     this.determineFeatureFlags = this.determineFeatureFlags.bind(this)
-    this.enrichSchema = this.enrichSchema.bind(this)
     this.refresh = this.refresh.bind(this)
     this.update = this.update.bind(this)
     this.hasNextPage = this.hasNextPage.bind(this)
@@ -129,7 +128,7 @@ export default class DataFetch {
 
     // Fetch and enrich schema
     let schema = this.constructor.getSchema(datasource, definition)
-    schema = this.enrichSchema(schema)
+    schema = DataFetch.enrichSchema(schema)
     if (!schema) {
       return
     }
@@ -248,7 +247,7 @@ export default class DataFetch {
    * @param schema the datasource schema
    * @return {object} the enriched datasource schema
    */
-  enrichSchema(schema) {
+  static enrichSchema(schema) {
     if (schema == null) {
       return null
     }

packages/frontend-core/src/utils/cookies.js

@@ -1,16 +1,26 @@
 export const Cookies = {
   Auth: "budibase:auth",
   CurrentApp: "budibase:currentapp",
+  ReturnUrl: "budibase:returnurl",
+}
+
+export function setCookie(name, value) {
+  if (getCookie(name)) {
+    removeCookie(name)
+  }
+  window.document.cookie = `${name}=${value}; Path=/;`
 }
 
 export function getCookie(cookieName) {
-  return document.cookie.split(";").some(cookie => {
+  const value = `; ${document.cookie}`
-    return cookie.trim().startsWith(`${cookieName}=`)
+  const parts = value.split(`; ${cookieName}=`)
-  })
+  if (parts.length === 2) {
+    return parts[1].split(";").shift()
+  }
 }
 
 export function removeCookie(cookieName) {
   if (getCookie(cookieName)) {
-    document.cookie = `${cookieName}=; Max-Age=-99999999;`
+    document.cookie = `${cookieName}=; Max-Age=-99999999; Path=/;`
   }
 }

packages/frontend-core/src/utils/schema.js

@@ -1,4 +1,5 @@
 import { convertJSONSchemaToTableSchema } from "./json"
+import DataFetch from "../fetch/DataFetch.js"
 import TableFetch from "../fetch/TableFetch.js"
 import ViewFetch from "../fetch/ViewFetch.js"
 import QueryFetch from "../fetch/QueryFetch.js"
@@ -11,8 +12,13 @@ import JSONArrayFetch from "../fetch/JSONArrayFetch.js"
  * Fetches the schema of any kind of datasource.
  * All datasource fetch classes implement their own functionality to get the
  * schema of a datasource of their respective types.
+ * @param datasource the datasource to fetch the schema for
+ * @param options options for enriching the schema
  */
-export const fetchDatasourceSchema = async datasource => {
+export const fetchDatasourceSchema = async (
+  datasource,
+  options = { enrichRelationships: false }
+) => {
   const handler = {
     table: TableFetch,
     view: ViewFetch,
@@ -28,7 +34,7 @@ export const fetchDatasourceSchema = async datasource => {
 
   // Get the datasource definition and then schema
   const definition = await handler.getDefinition(datasource)
-  const schema = handler.getSchema(datasource, definition)
+  let schema = handler.getSchema(datasource, definition)
   if (!schema) {
     return null
   }
@@ -49,5 +55,28 @@ export const fetchDatasourceSchema = async datasource => {
       })
     }
   })
-  return { ...schema, ...jsonAdditions }
+  schema = { ...schema, ...jsonAdditions }
+
+  // Check for any relationship fields if required
+  if (options?.enrichRelationships && definition.sql) {
+    let relationshipAdditions = {}
+    for (let fieldKey of Object.keys(schema)) {
+      const fieldSchema = schema[fieldKey]
+      if (fieldSchema?.type === "link") {
+        const linkSchema = await fetchDatasourceSchema({
+          type: "table",
+          tableId: fieldSchema?.tableId,
+        })
+        Object.keys(linkSchema || {}).forEach(linkKey => {
+          relationshipAdditions[`${fieldKey}.${linkKey}`] = {
+            type: linkSchema[linkKey].type,
+          }
+        })
+      }
+    }
+    schema = { ...schema, ...relationshipAdditions }
+  }
+
+  // Ensure schema structure is correct
+  return DataFetch.enrichSchema(schema)
 }

packages/server/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/server",
   "email": "hi@budibase.com",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Budibase Web Server",
   "main": "src/index.ts",
   "repository": {
@@ -70,9 +70,9 @@
   "license": "GPL-3.0",
   "dependencies": {
     "@apidevtools/swagger-parser": "^10.0.3",
-    "@budibase/backend-core": "^1.0.27-alpha.19",
+    "@budibase/backend-core": "^1.0.44-alpha.2",
-    "@budibase/client": "^1.0.27-alpha.19",
+    "@budibase/client": "^1.0.44-alpha.2",
-    "@budibase/string-templates": "^1.0.27-alpha.19",
+    "@budibase/string-templates": "^1.0.44-alpha.2",
     "@bull-board/api": "^3.7.0",
     "@bull-board/koa": "^3.7.0",
     "@elastic/elasticsearch": "7.10.0",

packages/server/src/api/controllers/query/index.js

@@ -9,8 +9,11 @@ const { Thread, ThreadType } = require("../../../threads")
 const { save: saveDatasource } = require("../datasource")
 const { RestImporter } = require("./import")
 const { invalidateDynamicVariables } = require("../../../threads/utils")
+const environment = require("../../../environment")
 
-const Runner = new Thread(ThreadType.QUERY, { timeoutMs: 10000 })
+const Runner = new Thread(ThreadType.QUERY, {
+  timeoutMs: environment.QUERY_THREAD_TIMEOUT || 10000,
+})
 
 // simple function to append "readable" to all read queries
 function enrichQueries(input) {

packages/server/src/api/controllers/row/utils.js

@@ -61,12 +61,17 @@ exports.validate = async ({ appId, tableId, row, table }) => {
     let res
 
     // Validate.js doesn't seem to handle array
-    if (type === FieldTypes.ARRAY && row[fieldName] && row[fieldName].length) {
+    if (type === FieldTypes.ARRAY && row[fieldName]) {
-      row[fieldName].map(val => {
+      if (row[fieldName].length) {
-        if (!constraints.inclusion.includes(val)) {
+        row[fieldName].map(val => {
-          errors[fieldName] = "Field not in list"
+          if (!constraints.inclusion.includes(val)) {
-        }
+            errors[fieldName] = "Field not in list"
-      })
+          }
+        })
+      } else if (constraints.presence && row[fieldName].length === 0) {
+        // non required MultiSelect creates an empty array, which should not throw errors
+        errors[fieldName] = [`${fieldName} is required`]
+      }
     } else if (type === FieldTypes.JSON && typeof row[fieldName] === "string") {
       // this should only happen if there is an error
       try {

packages/server/src/api/controllers/table/index.js

@@ -2,7 +2,7 @@ const CouchDB = require("../../../db")
 const internal = require("./internal")
 const external = require("./external")
 const csvParser = require("../../../utilities/csvParser")
-const { isExternalTable } = require("../../../integrations/utils")
+const { isExternalTable, isSQL } = require("../../../integrations/utils")
 const {
   getTableParams,
   getDatasourceParams,
@@ -32,8 +32,8 @@ exports.fetch = async function (ctx) {
     })
   )
 
-  const internal = internalTables.rows.map(row => ({
+  const internal = internalTables.rows.map(tableDoc => ({
-    ...row.doc,
+    ...tableDoc.doc,
     type: "internal",
     sourceId: BudibaseInternalDB._id,
   }))
@@ -44,12 +44,18 @@ exports.fetch = async function (ctx) {
     })
   )
 
-  const external = externalTables.rows.flatMap(row => {
+  const external = externalTables.rows.flatMap(tableDoc => {
-    return Object.values(row.doc.entities || {}).map(entity => ({
+    let entities = tableDoc.doc.entities
-      ...entity,
+    if (entities) {
-      type: "external",
+      return Object.values(entities).map(entity => ({
-      sourceId: row.doc._id,
+        ...entity,
-    }))
+        type: "external",
+        sourceId: tableDoc.doc._id,
+        sql: isSQL(tableDoc.doc),
+      }))
+    } else {
+      return []
+    }
   })
 
   ctx.body = [...internal, ...external]

packages/server/src/api/controllers/table/utils.js

@@ -12,6 +12,7 @@ const { USERS_TABLE_SCHEMA, SwitchableTypes } = require("../../../constants")
 const {
   isExternalTable,
   breakExternalTableId,
+  isSQL,
 } = require("../../../integrations/utils")
 const { getViews, saveView } = require("../view/utils")
 const viewTemplate = require("../view/viewBuilder")
@@ -242,7 +243,9 @@ exports.getTable = async (appId, tableId) => {
   const db = new CouchDB(appId)
   if (isExternalTable(tableId)) {
     let { datasourceId, tableName } = breakExternalTableId(tableId)
-    return exports.getExternalTable(appId, datasourceId, tableName)
+    const datasource = await db.get(datasourceId)
+    const table = await exports.getExternalTable(appId, datasourceId, tableName)
+    return { ...table, sql: isSQL(datasource) }
   } else {
     return db.get(tableId)
   }

packages/server/src/integrations/base/sql.ts

@@ -72,16 +72,22 @@ class InternalBuilder {
 
   // right now we only do filters on the specific table being queried
   addFilters(
-    tableName: string,
     query: KnexQuery,
-    filters: SearchFilters | undefined
+    filters: SearchFilters | undefined,
+    opts: { relationship?: boolean; tableName?: string }
   ): KnexQuery {
     function iterate(
       structure: { [key: string]: any },
       fn: (key: string, value: any) => void
     ) {
       for (let [key, value] of Object.entries(structure)) {
-        fn(`${tableName}.${key}`, value)
+        const isRelationshipField = key.includes(".")
+        if (!opts.relationship && !isRelationshipField) {
+          fn(`${opts.tableName}.${key}`, value)
+        }
+        if (opts.relationship && isRelationshipField) {
+          fn(key, value)
+        }
       }
     }
     if (!filters) {
@@ -272,7 +278,7 @@ class InternalBuilder {
     if (foundOffset) {
       query = query.offset(foundOffset)
     }
-    query = this.addFilters(tableName, query, filters)
+    query = this.addFilters(query, filters, { tableName })
     // add sorting to pre-query
     query = this.addSorting(query, json)
     // @ts-ignore
@@ -285,20 +291,21 @@ class InternalBuilder {
       preQuery = this.addSorting(preQuery, json)
     }
     // handle joins
-    return this.addRelationships(
+    query = this.addRelationships(
       knex,
       preQuery,
       selectStatement,
       tableName,
       relationships
     )
+    return this.addFilters(query, filters, { relationship: true })
   }
 
   update(knex: Knex, json: QueryJson, opts: QueryOptions): KnexQuery {
     const { endpoint, body, filters } = json
     let query: KnexQuery = knex(endpoint.entityId)
     const parsedBody = parseBody(body)
-    query = this.addFilters(endpoint.entityId, query, filters)
+    query = this.addFilters(query, filters, { tableName: endpoint.entityId })
     // mysql can't use returning
     if (opts.disableReturning) {
       return query.update(parsedBody)
@@ -310,7 +317,7 @@ class InternalBuilder {
   delete(knex: Knex, json: QueryJson, opts: QueryOptions): KnexQuery {
     const { endpoint, filters } = json
     let query: KnexQuery = knex(endpoint.entityId)
-    query = this.addFilters(endpoint.entityId, query, filters)
+    query = this.addFilters(query, filters, { tableName: endpoint.entityId })
     // mysql can't use returning
     if (opts.disableReturning) {
       return query.delete()

packages/server/src/integrations/s3.ts

@@ -38,7 +38,7 @@ module S3Module {
       signatureVersion: {
         type: "string",
         required: false,
-        default: "v4"
+        default: "v4",
       },
     },
     query: {

packages/server/src/integrations/tests/sql.spec.js

@@ -119,6 +119,22 @@ describe("SQL query builder", () => {
     })
   })
 
+  it("should allow filtering on a related field", () => {
+    const query = sql._query(generateReadJson({
+      filters: {
+        equal: {
+          age: 10,
+          "task.name": "task 1",
+        },
+      },
+    }))
+    // order of bindings changes because relationship filters occur outside inner query
+    expect(query).toEqual({
+      bindings: [10, limit, "task 1"],
+      sql: `select * from (select * from "${TABLE_NAME}" where "${TABLE_NAME}"."age" = $1 limit $2) as "${TABLE_NAME}" where "task"."name" = $3`
+    })
+  })
+
   it("should test an create statement", () => {
     const query = sql._query(generateCreateJson(TABLE_NAME, {
       name: "Michael",

packages/server/src/integrations/utils.ts

@@ -1,6 +1,5 @@
-import { SqlQuery } from "../definitions/datasource"
+import { SourceNames, SqlQuery } from "../definitions/datasource"
 import { Datasource, Table } from "../definitions/common"
-import { SourceNames } from "../definitions/datasource"
 import { DocumentTypes, SEPARATOR } from "../db/utils"
 import { FieldTypes, BuildSchemaErrors, InvalidColumns } from "../constants"
 
@@ -127,7 +126,12 @@ export function isSQL(datasource: Datasource): boolean {
   if (!datasource || !datasource.source) {
     return false
   }
-  const SQL = [SourceNames.POSTGRES, SourceNames.SQL_SERVER, SourceNames.MYSQL]
+  const SQL = [
+    SourceNames.POSTGRES,
+    SourceNames.SQL_SERVER,
+    SourceNames.MYSQL,
+    SourceNames.ORACLE,
+  ]
   return SQL.indexOf(datasource.source) !== -1
 }
 

packages/server/src/middleware/currentapp.js

@@ -47,6 +47,15 @@ module.exports = async (ctx, next) => {
     (!ctx.user || !ctx.user.builder || !ctx.user.builder.global)
   ) {
     clearCookie(ctx, Cookies.CurrentApp)
+    // have to set the return url on the server side as client side is not available
+    setCookie(ctx, ctx.url, Cookies.RETURN_URL, {
+      // don't sign so the browser can easily read
+      sign: false,
+      // use the request domain to match how ui handles the return url cookie.
+      // it's important we don't use the shared domain here as the builder
+      // can't delete from it without awareness of the domain.
+      requestDomain: true,
+    })
     return ctx.redirect("/")
   }
 

packages/string-templates/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@budibase/string-templates",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Handlebars wrapper for Budibase templating.",
   "main": "src/index.cjs",
   "module": "dist/bundle.mjs",
@@ -32,7 +32,7 @@
     "@rollup/plugin-json": "^4.1.0",
     "doctrine": "^3.0.0",
     "jest": "^26.6.3",
-    "marked": "^2.0.0",
+    "marked": "^4.0.10",
     "rollup": "^2.36.2",
     "rollup-plugin-node-builtins": "^2.1.2",
     "rollup-plugin-node-globals": "^1.4.0",

packages/string-templates/test/basic.spec.js

@@ -146,3 +146,14 @@ describe("check manifest", () => {
     )
   })
 })
+
+describe("check full stops that are safe", () => {
+  it("should allow using an escaped full stop", async () => {
+    const data = {
+      "c53a4a604fa754d33baaafd5bca4d3658-YXuUBqt5vI": { "persons.firstname": "1" }
+    }
+    const template = "{{ [c53a4a604fa754d33baaafd5bca4d3658-YXuUBqt5vI].[persons.firstname] }}"
+    const output = await processString(template, data)
+    expect(output).toEqual("1")
+  })
+})

packages/string-templates/yarn.lock

@@ -3090,10 +3090,10 @@ map-visit@^1.0.0:
   dependencies:
     object-visit "^1.0.0"
 
-marked@^2.0.0:
+marked@^4.0.10:
-  version "2.1.3"
+  version "4.0.10"
-  resolved "https://registry.yarnpkg.com/marked/-/marked-2.1.3.tgz#bd017cef6431724fd4b27e0657f5ceb14bff3753"
+  resolved "https://registry.yarnpkg.com/marked/-/marked-4.0.10.tgz#423e295385cc0c3a70fa495e0df68b007b879423"
-  integrity sha512-/Q+7MGzaETqifOMWYEA7HVMaZb4XbcRfaOzcSsHZEith83KGlvaSG33u0SKu89Mj5h+T8V2hM+8O45Qc5XTgwA==
+  integrity sha512-+QvuFj0nGgO970fySghXGmuw+Fd0gD2x3+MqCWLIPf5oxdv1Ka6b2q+z9RP01P/IaKPMEramy+7cNy/Lw8c3hw==
 
 md5.js@^1.3.4:
   version "1.3.5"

packages/worker/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@budibase/worker",
   "email": "hi@budibase.com",
-  "version": "1.0.27-alpha.19",
+  "version": "1.0.44-alpha.2",
   "description": "Budibase background service",
   "main": "src/index.js",
   "repository": {
@@ -29,8 +29,8 @@
   "author": "Budibase",
   "license": "GPL-3.0",
   "dependencies": {
-    "@budibase/backend-core": "^1.0.27-alpha.19",
+    "@budibase/backend-core": "^1.0.44-alpha.2",
-    "@budibase/string-templates": "^1.0.27-alpha.19",
+    "@budibase/string-templates": "^1.0.44-alpha.2",
     "@koa/router": "^8.0.0",
     "@sentry/node": "^6.0.0",
     "@techpass/passport-openidconnect": "^0.3.0",