Merge pull request #13636 from Budibase/fix/builder-tabs-underline

Fix for positioning of selected builder navigation tab on page load
This commit is contained in:
Martin McKeaveney 2024-05-13 17:00:37 +01:00 committed by GitHub
commit 9c312826ca
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 28 additions and 11 deletions

View File

@ -104,6 +104,10 @@
} }
onMount(async () => { onMount(async () => {
document.fonts.onloadingdone = e => {
builderStore.loadFonts(e.fontfaces)
}
if (!hasSynced && application) { if (!hasSynced && application) {
try { try {
await API.syncApp(application) await API.syncApp(application)
@ -144,17 +148,19 @@
/> />
</span> </span>
<Tabs {selected} size="M"> <Tabs {selected} size="M">
{#each $layout.children as { path, title }} {#key $builderStore?.fonts}
<TourWrap stepKeys={[`builder-${title}-section`]}> {#each $layout.children as { path, title }}
<Tab <TourWrap stepKeys={[`builder-${title}-section`]}>
quiet <Tab
selected={$isActive(path)} quiet
on:click={topItemNavigate(path)} selected={$isActive(path)}
title={capitalise(title)} on:click={topItemNavigate(path)}
id={`builder-${title}-tab`} title={capitalise(title)}
/> id={`builder-${title}-tab`}
</TourWrap> />
{/each} </TourWrap>
{/each}
{/key}
</Tabs> </Tabs>
</div> </div>
<div class="topcenternav"> <div class="topcenternav">

View File

@ -14,6 +14,7 @@ export const INITIAL_BUILDER_STATE = {
tourKey: null, tourKey: null,
tourStepKey: null, tourStepKey: null,
hoveredComponentId: null, hoveredComponentId: null,
fonts: null,
} }
export class BuilderStore extends BudiStore { export class BuilderStore extends BudiStore {
@ -36,6 +37,16 @@ export class BuilderStore extends BudiStore {
this.websocket this.websocket
} }
loadFonts(fontFaces) {
const ff = fontFaces.map(
fontFace => `${fontFace.family}-${fontFace.weight}`
)
this.update(state => ({
...state,
fonts: [...(state.fonts || []), ...ff],
}))
}
init(app) { init(app) {
if (!app?.appId) { if (!app?.appId) {
console.error("BuilderStore: No appId supplied for websocket") console.error("BuilderStore: No appId supplied for websocket")