1
0
Fork 0
mirror of synced 2024-06-30 03:50:37 +12:00
budibase/packages/standard-components/src/RowDetail.svelte

58 lines
1.3 KiB
Svelte
Raw Normal View History

2020-07-02 00:19:14 +12:00
<script>
import { onMount, getContext } from "svelte"
export let table
2020-07-02 00:19:14 +12:00
const {
API,
screenStore,
routeStore,
Provider,
styleable,
ActionTypes,
} = getContext("sdk")
const component = getContext("component")
2020-07-02 00:19:14 +12:00
let headers = []
2020-11-19 00:24:01 +13:00
let row
const fetchFirstRow = async tableId => {
const rows = await API.fetchTableData(tableId)
return Array.isArray(rows) && rows.length ? rows[0] : { tableId }
2020-07-02 00:19:14 +12:00
}
const fetchData = async (rowId, tableId) => {
if (!tableId) {
2020-10-10 00:24:18 +13:00
return
}
const pathParts = window.location.pathname.split("/")
2020-07-02 00:19:14 +12:00
// if srcdoc, then we assume this is the builder preview
if ((pathParts.length === 0 || pathParts[0] === "srcdoc") && tableId) {
row = await fetchFirstRow(tableId)
} else if (rowId) {
row = await API.fetchRow({ tableId, rowId })
} else {
throw new Error("Row ID was not supplied to RowDetail")
2020-07-02 00:19:14 +12:00
}
}
$: actions = [
{
type: ActionTypes.RefreshDatasource,
callback: () => fetchData($routeStore.routeParams.id, table),
metadata: { datasource: { type: "table", tableId: table } },
},
]
onMount(() => fetchData($routeStore.routeParams.id, table))
2020-07-02 00:19:14 +12:00
</script>
2020-11-19 00:24:01 +13:00
{#if row}
<Provider data={row} {actions}>
<div use:styleable={$component.styles}>
<slot />
</div>
</Provider>
2020-11-19 00:24:01 +13:00
{/if}