108 lines
2.8 KiB
JavaScript
108 lines
2.8 KiB
JavaScript
import sanitizeUrl from "./utils/sanitizeUrl"
|
|
import { newRowUrl } from "./newRowScreen"
|
|
import { Screen } from "./utils/Screen"
|
|
import { Component } from "./utils/Component"
|
|
import { makePropSafe } from "@budibase/string-templates"
|
|
|
|
export default function (tables) {
|
|
return tables.map(table => {
|
|
return {
|
|
name: `${table.name} - List`,
|
|
create: () => createScreen(table),
|
|
id: ROW_LIST_TEMPLATE,
|
|
}
|
|
})
|
|
}
|
|
|
|
export const ROW_LIST_TEMPLATE = "ROW_LIST_TEMPLATE"
|
|
export const rowListUrl = table => sanitizeUrl(`/${table.name}`)
|
|
|
|
function generateTitleContainer(table) {
|
|
const newButton = new Component("@budibase/standard-components/button")
|
|
.text("Create New")
|
|
.customProps({
|
|
size: "M",
|
|
type: "primary",
|
|
onClick: [
|
|
{
|
|
parameters: {
|
|
url: newRowUrl(table),
|
|
},
|
|
"##eventHandlerType": "Navigate To",
|
|
},
|
|
],
|
|
})
|
|
.instanceName("New Button")
|
|
|
|
const heading = new Component("@budibase/standard-components/heading")
|
|
.instanceName("Title")
|
|
.text(table.name)
|
|
.customProps({
|
|
size: "M",
|
|
align: "left",
|
|
})
|
|
|
|
return new Component("@budibase/standard-components/container")
|
|
.customProps({
|
|
direction: "row",
|
|
hAlign: "stretch",
|
|
vAlign: "middle",
|
|
size: "shrink",
|
|
gap: "M",
|
|
})
|
|
.instanceName("Title Container")
|
|
.addChild(heading)
|
|
.addChild(newButton)
|
|
}
|
|
|
|
const createScreen = table => {
|
|
const provider = new Component("@budibase/standard-components/dataprovider")
|
|
.instanceName(`Data Provider`)
|
|
.customProps({
|
|
dataSource: {
|
|
label: table.name,
|
|
name: table._id,
|
|
tableId: table._id,
|
|
type: "table",
|
|
},
|
|
size: "spectrum--medium",
|
|
paginate: true,
|
|
limit: 8,
|
|
})
|
|
|
|
const spectrumTable = new Component("@budibase/standard-components/table")
|
|
.customProps({
|
|
dataProvider: `{{ literal ${makePropSafe(provider._json._id)} }}`,
|
|
showAutoColumns: false,
|
|
quiet: false,
|
|
rowCount: 8,
|
|
})
|
|
.instanceName(`${table.name} Table`)
|
|
|
|
const safeTableId = makePropSafe(spectrumTable._json._id)
|
|
const safeRowId = makePropSafe("_id")
|
|
const viewLink = new Component("@budibase/standard-components/link")
|
|
.customProps({
|
|
text: "View",
|
|
url: `${rowListUrl(table)}/{{ ${safeTableId}.${safeRowId} }}`,
|
|
size: "S",
|
|
color: "var(--spectrum-global-color-gray-600)",
|
|
align: "left",
|
|
})
|
|
.normalStyle({
|
|
["margin-left"]: "16px",
|
|
["margin-right"]: "16px",
|
|
})
|
|
.instanceName("View Link")
|
|
|
|
spectrumTable.addChild(viewLink)
|
|
provider.addChild(spectrumTable)
|
|
|
|
return new Screen()
|
|
.route(rowListUrl(table))
|
|
.instanceName(`${table.name} - List`)
|
|
.addChild(generateTitleContainer(table))
|
|
.addChild(provider)
|
|
.json()
|
|
}
|