fixing reactive chart issue

This commit is contained in:
Martin McKeaveney 2020-11-13 10:29:54 +00:00
parent 28360ded59
commit ea09c6e459
5 changed files with 30 additions and 29 deletions

View File

@ -193,8 +193,8 @@ export const getFrontendStore = () => {
) )
state.currentComponentInfo = safeProps state.currentComponentInfo = safeProps
screen.props = safeProps screen.props = safeProps
savePromise = store.actions.pages.save()
} }
savePromise = store.actions.pages.save()
return state return state
}) })
@ -223,7 +223,7 @@ export const getFrontendStore = () => {
// TODO: Should be done server side // TODO: Should be done server side
state.pages[pageName]._screens = state.pages[ state.pages[pageName]._screens = state.pages[
pageName pageName
]._screens.filter(scr => scr.name !== screenToDelete.name) ]._screens.filter(scr => scr._id !== screenToDelete._id)
deletePromise = api.delete( deletePromise = api.delete(
`/api/screens/${screenToDelete._id}/${screenToDelete._rev}` `/api/screens/${screenToDelete._id}/${screenToDelete._rev}`
) )
@ -277,18 +277,20 @@ export const getFrontendStore = () => {
const pageToSave = page || storeContents.pages[pageName] const pageToSave = page || storeContents.pages[pageName]
// TODO: revisit. This sends down a very weird payload // TODO: revisit. This sends down a very weird payload
const response = await api const response = await api.post(`/api/pages/${pageToSave._id}`, {
.post(`/api/pages/${pageToSave._id}`, { page: {
page: { componentLibraries: storeContents.pages.componentLibraries,
componentLibraries: storeContents.pages.componentLibraries, ...pageToSave,
...pageToSave, },
}, screens: pageToSave._screens,
screens: pageToSave._screens, })
})
.then(response => response.json()) const json = await response.json()
if (!json.ok) throw new Error("Error updating page")
store.update(state => { store.update(state => {
state.pages[pageName]._rev = response.rev state.pages[pageName]._rev = json.rev
return state return state
}) })
}, },
@ -304,7 +306,6 @@ export const getFrontendStore = () => {
return state return state
}) })
}, },
// addChildComponent
create: (componentToAdd, presetProps) => { create: (componentToAdd, presetProps) => {
store.update(state => { store.update(state => {
function findSlot(component_array) { function findSlot(component_array) {

View File

@ -39,9 +39,13 @@
class="category" class="category"
on:click={() => onCategoryChosen(category, idx)} on:click={() => onCategoryChosen(category, idx)}
class:active={idx === selectedIndex}> class:active={idx === selectedIndex}>
{#if category.icon}<i class={category.icon} />{/if} {#if category.icon}
<i class={category.icon} />
{/if}
<span>{category.name}</span> <span>{category.name}</span>
{#if category.isCategory}<i class="ri-arrow-down-s-line arrow" />{/if} {#if category.isCategory}
<i class="ri-arrow-down-s-line arrow" />
{/if}
</div> </div>
{/each} {/each}
</div> </div>
@ -68,7 +72,6 @@
flex-direction: row; flex-direction: row;
justify-content: flex-start; justify-content: flex-start;
align-items: center; align-items: center;
z-index: 1;
min-height: 24px; min-height: 24px;
flex-wrap: wrap; flex-wrap: wrap;
gap: var(--spacing-l); gap: var(--spacing-l);

View File

@ -7,8 +7,6 @@
export let onChange = () => {} export let onChange = () => {}
let boundValue = getValidOptions(value, options) let boundValue = getValidOptions(value, options)
$: setValue(boundValue)
$: sanitiseOptions(options)
function getValidOptions(selectedOptions, allOptions) { function getValidOptions(selectedOptions, allOptions) {
// Fix the hardcoded default string value // Fix the hardcoded default string value
@ -18,17 +16,14 @@
return selectedOptions.filter(val => allOptions.indexOf(val) !== -1) return selectedOptions.filter(val => allOptions.indexOf(val) !== -1)
} }
function setValue(val) { function setValue(value) {
onChange(val) boundValue = getValidOptions(value.detail, options)
} onChange(boundValue)
function sanitiseOptions(options) {
boundValue = getValidOptions(value, options)
} }
</script> </script>
<div> <div>
<Multiselect extraThin secondary bind:value={boundValue}> <Multiselect extraThin secondary value={boundValue} on:change={setValue}>
{#each options as option} {#each options as option}
<option value={option}>{option}</option> <option value={option}>{option}</option>
{/each} {/each}

View File

@ -50,8 +50,8 @@
const isDuplicateName = name => { const isDuplicateName = name => {
let duplicate = false let duplicate = false
const lookForDuplicate = rootPops => { const lookForDuplicate = rootProps => {
walkProps(rootPops, (inst, cancel) => { walkProps(rootProps, (inst, cancel) => {
if (inst._instanceName === name && inst._id !== componentInstance._id) { if (inst._instanceName === name && inst._id !== componentInstance._id) {
duplicate = true duplicate = true
cancel() cancel()
@ -62,7 +62,7 @@
lookForDuplicate($store.pages[$store.currentPageName].props) lookForDuplicate($store.pages[$store.currentPageName].props)
if (duplicate) return true if (duplicate) return true
// if viwing screen, check current screen for duplicate // if viewing screen, check current screen for duplicate
if ($store.currentFrontEndType === "screen") { if ($store.currentFrontEndType === "screen") {
lookForDuplicate($store.currentPreviewItem.props) lookForDuplicate($store.currentPreviewItem.props)
} else { } else {

View File

@ -35,7 +35,9 @@
{#if logoUrl} {#if logoUrl}
<img class="logo" alt="logo" src={logoUrl} height="48" /> <img class="logo" alt="logo" src={logoUrl} height="48" />
{/if} {/if}
{#if title}<span>{title}</span>{/if} {#if title}
<span>{title}</span>
{/if}
</a> </a>
<div class="nav__controls"> <div class="nav__controls">
<div on:click={logOut}>Log out</div> <div on:click={logOut}>Log out</div>