diff --git a/frontend/src/lib/components/apps/components/buttons/AppButton.svelte b/frontend/src/lib/components/apps/components/buttons/AppButton.svelte index 9614db06eb..e4c96b05e3 100644 --- a/frontend/src/lib/components/apps/components/buttons/AppButton.svelte +++ b/frontend/src/lib/components/apps/components/buttons/AppButton.svelte @@ -10,6 +10,7 @@ import RunnableWrapper from '../helpers/RunnableWrapper.svelte' import { loadIcon } from '../icon' import { twMerge } from 'tailwind-merge' + import { goto } from '$app/navigation' export let id: string export let componentInput: AppInput | undefined @@ -32,7 +33,8 @@ let runnableComponent: RunnableComponent let disabled: boolean | undefined = undefined let fillContainer: boolean | undefined = undefined - let goto: string | undefined = undefined + let gotoUrl: string | undefined = undefined + let gotoNewTab: boolean | undefined = undefined let isLoading: boolean = false let ownClick: boolean = false @@ -87,7 +89,7 @@ - + @@ -101,6 +103,7 @@ bind:error={errors.disabled} /> + {#if errorsMessage} @@ -134,7 +138,18 @@ e?.stopPropagation() e?.preventDefault() ownClick = true - await runnableComponent?.runComponent() + + if (!runnableComponent) { + if (gotoUrl) { + if (gotoNewTab) { + window.open(gotoUrl, '_blank') + } else { + goto(gotoUrl) + } + } + } else { + await runnableComponent?.runComponent() + } if (recomputeIds) { recomputeIds.forEach((id) => { diff --git a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte index 2f4d9fb817..aeb8e7068c 100644 --- a/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte +++ b/frontend/src/lib/components/apps/components/helpers/RunnableComponent.svelte @@ -26,6 +26,7 @@ export let wrapperStyle = '' export let initializing: boolean | undefined = undefined export let gotoUrl: string | undefined = undefined + export let gotoNewTab: boolean | undefined = undefined const { worldStore, @@ -241,7 +242,13 @@ delete $errorByComponent[previousJobId] $errorByComponent = $errorByComponent } - gotoUrl && gotoUrl != '' && result?.error == undefined && goto(gotoUrl) + if (gotoUrl && gotoUrl != '' && result?.error == undefined) { + if (gotoNewTab) { + window.open(gotoUrl, '_blank') + } else { + goto(gotoUrl) + } + } } } }} diff --git a/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte b/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte index b995f2748a..566cb7d099 100644 --- a/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte +++ b/frontend/src/lib/components/apps/components/helpers/RunnableWrapper.svelte @@ -19,6 +19,7 @@ export let runnableClass = '' export let runnableStyle = '' export let goto: string | undefined = undefined + export let gotoNewTab: boolean | undefined = undefined const { staticExporter, noBackend } = getContext('AppEditorContext') @@ -43,6 +44,7 @@ {:else if componentInput.type === 'runnable' && isRunnableDefined()} + import { getContext } from 'svelte' + import type { AppEditorContext, GridItem } from '../types' + import ComponentPanel from './settingsPanel/ComponentPanel.svelte' + + const { selectedComponent } = getContext('AppEditorContext') + export let gridItems: GridItem[] + export let parent: string | undefined + + +{#each gridItems as gridItem, i (gridItem?.data?.id ?? i)} + {#if gridItem?.data?.id === $selectedComponent} + + {:else if gridItem?.data?.type === 'tablecomponent'} + {#each gridItem.data.actionButtons as actionButton (actionButton.id)} + {#if actionButton.id === $selectedComponent} + { + gridItem.data.actionButtons = gridItem.data.actionButtons.filter( + (c) => c.id !== actionButton.id + ) + }} + /> + {/if} + {/each} + {/if} +{/each} diff --git a/frontend/src/lib/components/apps/editor/SettingsPanel.svelte b/frontend/src/lib/components/apps/editor/SettingsPanel.svelte index 7d86322ee7..ba283f18eb 100644 --- a/frontend/src/lib/components/apps/editor/SettingsPanel.svelte +++ b/frontend/src/lib/components/apps/editor/SettingsPanel.svelte @@ -1,31 +1,20 @@ -{#each $app.grid as gridItem (gridItem?.data?.id)} - {#if gridItem?.data?.id === $selectedComponent} - - {:else if gridItem?.data?.type === 'tablecomponent'} - - {/if} -{/each} +{#if $app.grid} + +{/if} {#if $app.subgrids} {#each Object.keys($app.subgrids ?? {}) as key (key)} - {#each $app.subgrids[key] as gridItem (gridItem?.data?.id)} - {#if gridItem?.data?.id === $selectedComponent} - - {:else if gridItem?.data?.type === 'tablecomponent'} - - {/if} - {/each} + {/each} {/if} diff --git a/frontend/src/lib/components/apps/editor/TablePanel.svelte b/frontend/src/lib/components/apps/editor/TablePanel.svelte deleted file mode 100644 index 6ef87d7760..0000000000 --- a/frontend/src/lib/components/apps/editor/TablePanel.svelte +++ /dev/null @@ -1,23 +0,0 @@ - - -{#each component.actionButtons as actionButton (actionButton.id)} - {#if actionButton.id === $selectedComponent} - { - component.actionButtons = component.actionButtons.filter((c) => c.id !== actionButton.id) - }} - /> - {/if} -{/each} diff --git a/frontend/src/lib/components/apps/editor/component/components.ts b/frontend/src/lib/components/apps/editor/component/components.ts index 1b98dc6a66..4b467750d9 100644 --- a/frontend/src/lib/components/apps/editor/component/components.ts +++ b/frontend/src/lib/components/apps/editor/component/components.ts @@ -104,7 +104,6 @@ export type AppComponent = BaseAppComponent & | HtmlComponent | TableComponent | TextComponent - | TableComponent | ButtonComponent | PieChartComponent | ScatterChartComponent @@ -285,6 +284,12 @@ export const components: Record = { type: 'static', value: '' }, + gotoNewTab: { + tooltip: 'Go to create a new tab', + fieldType: 'boolean', + type: 'static', + value: true + }, beforeIcon: { type: 'static', value: undefined, diff --git a/frontend/src/lib/components/apps/editor/contextPanel/ContextPanel.svelte b/frontend/src/lib/components/apps/editor/contextPanel/ContextPanel.svelte index 948b77a87a..ae18eb2049 100644 --- a/frontend/src/lib/components/apps/editor/contextPanel/ContextPanel.svelte +++ b/frontend/src/lib/components/apps/editor/contextPanel/ContextPanel.svelte @@ -29,7 +29,7 @@ function getComponentNameById(componentId: string) { const component = findGridItem($app, componentId) - if (component?.data.type) { + if (component?.data?.type) { return components[component?.data.type].name } else if (componentId == 'ctx') { return 'Context' diff --git a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte index 10540518f3..b0c5f5be3f 100644 --- a/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte +++ b/frontend/src/lib/components/apps/editor/inlineScriptsPanel/InlineScriptsPanel.svelte @@ -26,11 +26,11 @@ {/if} - {#each $app.grid as gridItem (gridItem?.data?.id)} - {#if gridItem?.data?.id === selectedScriptComponentId} + {#each $app.grid as gridItem, index (gridItem?.data?.id ?? index)} + {#if gridItem?.data?.id && gridItem.data.id === selectedScriptComponentId} @@ -51,10 +51,10 @@ {#if $app.subgrids} {#each Object.keys($app.subgrids ?? {}) as key (key)} {#each $app.subgrids[key] as gridItem (gridItem?.data?.id)} - {#if gridItem?.data?.id === selectedScriptComponentId} + {#if gridItem?.data?.id && gridItem.data.id === selectedScriptComponentId} diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte index c86d0a52cb..f2ee12728a 100644 --- a/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte +++ b/frontend/src/lib/components/apps/editor/settingsPanel/ComponentPanel.svelte @@ -32,6 +32,7 @@ export let onDelete: (() => void) | undefined = undefined export let parent: string | undefined export let noGrid = false + export let duplicateMoveAllowed = true const { app, @@ -204,24 +205,26 @@ {/if} - - - + {#if duplicateMoveAllowed} + + + - - - + + + + {/if}