Update table settings migration to handle new behaviour settings for table blocks

This commit is contained in:
Andrew Kingston 2022-11-17 10:11:25 +00:00
parent 03cf4153fc
commit f47ae91ce1
1 changed files with 59 additions and 17 deletions

View File

@ -6,14 +6,23 @@ import { makePropSafe as safe } from "@budibase/string-templates"
* November 2022 * November 2022
* *
* Description: * Description:
* Update table settings to use actions instead of links. * Update table settings to use actions instead of links. We do not remove the
* legacy values here as we cannot guarantee that their apps are up-t-date.
* It is safe to simply save both the new and old structure in the definition.
*
* Migration 1:
* Legacy "linkRows", "linkURL", "linkPeek" and "linkColumn" settings on tables * Legacy "linkRows", "linkURL", "linkPeek" and "linkColumn" settings on tables
* and table blocks are migrated into a "Navigate To" action under the new * and table blocks are migrated into a "Navigate To" action under the new
* "onClick" setting. * "onClick" setting.
*
* Migration 2:
* Legacy "titleButtonURL" and "titleButtonPeek" settings on table blocks are
* migrated into a "Navigate To" action under the new "onClickTitleButton"
* setting.
*/ */
export const run = async (appDb: any) => { export const run = async (appDb: any) => {
// Get all app screens
let screens: Screen[] let screens: Screen[]
try { try {
screens = ( screens = (
await appDb.allDocs( await appDb.allDocs(
@ -38,7 +47,7 @@ export const run = async (appDb: any) => {
delete screen.touched delete screen.touched
appDb.put(screen) appDb.put(screen)
console.log( console.log(
`Screen ${screen.routing?.route} contained tables which were migrated` `Screen ${screen.routing?.route} contained table settings which were migrated`
) )
} }
}) })
@ -50,24 +59,49 @@ const migrateTableSettings = (component: any, screen: any) => {
if (!component) { if (!component) {
return return
} }
// Migrate table setting
// Migration 1: migrate table row click settings
if ( if (
component._component.endsWith("/table") || component._component.endsWith("/table") ||
component._component.endsWith("/tableblock") component._component.endsWith("/tableblock")
) { ) {
const { linkRows, linkURL, linkPeek, linkColumn, onClick } = component const { linkRows, linkURL, linkPeek, linkColumn, onClick } = component
if (linkRows && !onClick) { if (linkRows && !onClick) {
const action = convertLinkSettingToAction(linkURL, linkPeek, linkColumn) const column = linkColumn || "_id"
const action = convertLinkSettingToAction(linkURL, !!linkPeek, column)
if (action) { if (action) {
screen.touched = true screen.touched = true
component.onClick = action component.onClick = action
if (component._component.endsWith("/tableblock")) {
component.clickBehaviour = "actions"
}
} }
} }
} }
if (!component._children?.length) {
return // Migration 2: migrate table block title button settings
if (component._component.endsWith("/tableblock")) {
const {
showTitleButton,
titleButtonURL,
titleButtonPeek,
onClickTitleButton,
} = component
if (showTitleButton && !onClickTitleButton) {
const action = convertLinkSettingToAction(
titleButtonURL,
!!titleButtonPeek
)
if (action) {
screen.touched = true
component.onClickTitleButton = action
component.titleButtonClickBehaviour = "actions"
}
}
} }
component._children.forEach((child: any) => {
// Recurse down the tree as needed
component._children?.forEach((child: any) => {
migrateTableSettings(child, screen) migrateTableSettings(child, screen)
}) })
} }
@ -75,26 +109,34 @@ const migrateTableSettings = (component: any, screen: any) => {
// Util ti convert the legacy settings into a navigation action structure // Util ti convert the legacy settings into a navigation action structure
const convertLinkSettingToAction = ( const convertLinkSettingToAction = (
linkURL: string, linkURL: string,
linkPeek?: boolean, linkPeek: boolean,
linkColumn?: string linkColumn?: string
) => { ) => {
if (!linkURL?.includes("/:")) { // Sanity check we have a URL
if (!linkURL) {
return null return null
} }
// Convert old link URL setting, which is a screen URL, into a valid // Default URL to the old URL setting
// binding using the new clicked row binding let url = linkURL
const split = linkURL.split("/:")
const col = linkColumn || "_id"
const binding = `{{ ${safe("eventContext")}.${safe("row")}.${safe(col)} }}`
const url = `${split[0]}/${binding}`
// If we enriched the old URL with a column, update the url
if (linkColumn && linkURL.includes("/:")) {
// Convert old link URL setting, which is a screen URL, into a valid
// binding using the new clicked row binding
const split = linkURL.split("/:")
const col = linkColumn || "_id"
const binding = `{{ ${safe("eventContext")}.${safe("row")}.${safe(col)} }}`
url = `${split[0]}/${binding}`
}
// Create action structure
return [ return [
{ {
"##eventHandlerType": "Navigate To", "##eventHandlerType": "Navigate To",
parameters: { parameters: {
url, url,
peek: !!linkPeek, peek: linkPeek,
}, },
}, },
] ]