2022-04-29 04:30:48 +12:00
|
|
|
import { derived } from "svelte/store"
|
2020-11-18 01:08:24 +13:00
|
|
|
import { routeStore } from "./routes"
|
2020-11-24 22:31:54 +13:00
|
|
|
import { builderStore } from "./builder"
|
2021-07-01 07:35:02 +12:00
|
|
|
import { appStore } from "./app"
|
2020-11-14 04:42:32 +13:00
|
|
|
|
2020-11-19 08:18:18 +13:00
|
|
|
const createScreenStore = () => {
|
2020-11-24 22:31:54 +13:00
|
|
|
const store = derived(
|
2021-07-01 07:35:02 +12:00
|
|
|
[appStore, routeStore, builderStore],
|
|
|
|
([$appStore, $routeStore, $builderStore]) => {
|
2021-07-07 22:28:53 +12:00
|
|
|
let activeLayout, activeScreen
|
2022-04-27 23:30:35 +12:00
|
|
|
let screens
|
|
|
|
|
2020-11-24 22:31:54 +13:00
|
|
|
if ($builderStore.inBuilder) {
|
|
|
|
// Use builder defined definitions if inside the builder preview
|
|
|
|
activeScreen = $builderStore.screen
|
2021-07-07 22:28:53 +12:00
|
|
|
screens = [activeScreen]
|
2021-05-21 01:47:17 +12:00
|
|
|
|
2022-04-27 23:30:35 +12:00
|
|
|
// Legacy - allow the builder to specify a layout
|
|
|
|
if ($builderStore.layout) {
|
|
|
|
activeLayout = $builderStore.layout
|
|
|
|
}
|
|
|
|
} else {
|
2021-05-21 01:47:17 +12:00
|
|
|
// Find the correct screen by matching the current route
|
2021-07-07 22:48:38 +12:00
|
|
|
screens = $appStore.screens
|
2021-05-21 01:47:17 +12:00
|
|
|
if ($routeStore.activeRoute) {
|
2020-12-05 03:04:07 +13:00
|
|
|
activeScreen = screens.find(
|
2021-05-04 22:32:22 +12:00
|
|
|
screen => screen._id === $routeStore.activeRoute.screenId
|
2020-12-05 03:04:07 +13:00
|
|
|
)
|
|
|
|
}
|
2022-04-27 23:30:35 +12:00
|
|
|
|
|
|
|
// Legacy - find the custom layout for the selected screen
|
2020-12-05 03:04:07 +13:00
|
|
|
if (activeScreen) {
|
2022-04-27 23:30:35 +12:00
|
|
|
const screenLayout = $appStore.layouts?.find(
|
2021-05-04 22:32:22 +12:00
|
|
|
layout => layout._id === activeScreen.layoutId
|
2020-12-05 03:04:07 +13:00
|
|
|
)
|
2022-04-27 23:30:35 +12:00
|
|
|
if (screenLayout) {
|
|
|
|
activeLayout = screenLayout
|
|
|
|
}
|
2020-12-05 03:04:07 +13:00
|
|
|
}
|
2020-11-24 22:31:54 +13:00
|
|
|
}
|
2022-04-27 23:30:35 +12:00
|
|
|
|
|
|
|
// If we don't have a legacy custom layout, build a layout structure
|
|
|
|
// from the screen navigation settings
|
|
|
|
if (!activeLayout) {
|
2022-04-29 04:30:48 +12:00
|
|
|
let navigationSettings = {
|
2022-04-27 23:47:54 +12:00
|
|
|
navigation: "None",
|
|
|
|
}
|
2022-04-28 23:18:08 +12:00
|
|
|
if (activeScreen?.showNavigation) {
|
2022-04-29 04:30:48 +12:00
|
|
|
navigationSettings =
|
|
|
|
$builderStore.navigation || $appStore.application?.navigation
|
2022-04-27 23:47:54 +12:00
|
|
|
|
|
|
|
// Legacy - if this is a legacy screen without any navigation
|
|
|
|
// settings fall back to just showing the app title
|
2022-04-29 04:30:48 +12:00
|
|
|
if (!navigationSettings) {
|
|
|
|
navigationSettings = {
|
|
|
|
title: $appStore.application?.name,
|
2022-04-27 23:47:54 +12:00
|
|
|
}
|
|
|
|
}
|
2022-04-29 04:30:48 +12:00
|
|
|
if (!navigationSettings.navigation) {
|
|
|
|
navigationSettings.navigation = "Top"
|
2022-04-28 00:28:17 +12:00
|
|
|
}
|
2022-04-27 23:47:54 +12:00
|
|
|
}
|
2022-04-27 23:30:35 +12:00
|
|
|
activeLayout = {
|
|
|
|
_id: "layout",
|
|
|
|
props: {
|
|
|
|
_component: "@budibase/standard-components/layout",
|
|
|
|
_children: [
|
|
|
|
{
|
|
|
|
_component: "screenslot",
|
|
|
|
_id: "screenslot",
|
|
|
|
_styles: {
|
|
|
|
normal: {
|
|
|
|
flex: "1 1 auto",
|
|
|
|
display: "flex",
|
|
|
|
"flex-direction": "column",
|
|
|
|
"justify-content": "flex-start",
|
|
|
|
"align-items": "stretch",
|
|
|
|
},
|
|
|
|
},
|
|
|
|
},
|
|
|
|
],
|
2022-04-29 04:30:48 +12:00
|
|
|
...navigationSettings,
|
2022-04-27 23:30:35 +12:00
|
|
|
},
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
return { screens, activeLayout, activeScreen }
|
2020-11-18 01:08:24 +13:00
|
|
|
}
|
2020-11-24 22:31:54 +13:00
|
|
|
)
|
2020-11-14 04:42:32 +13:00
|
|
|
|
2020-11-18 01:08:24 +13:00
|
|
|
return {
|
|
|
|
subscribe: store.subscribe,
|
2020-11-14 04:42:32 +13:00
|
|
|
}
|
2020-11-18 01:08:24 +13:00
|
|
|
}
|
2020-11-14 04:42:32 +13:00
|
|
|
|
2020-11-19 08:18:18 +13:00
|
|
|
export const screenStore = createScreenStore()
|