Fix types

This commit is contained in:
Adria Navarro 2025-02-17 18:48:40 +01:00
parent 47b7408022
commit dbb783c13f
4 changed files with 65 additions and 66 deletions

View File

@ -30,9 +30,9 @@ export const findComponentType = (rootComponent: Component, type: string) => {
* Recursively searches for the parent component of a specific component ID
*/
export const findComponentParent = (
rootComponent: Component,
id: string,
parentComponent: Component
rootComponent: Component | undefined,
id: string | undefined,
parentComponent: Component | null = null
): Component | null => {
if (!rootComponent || !id) {
return null
@ -58,7 +58,7 @@ export const findComponentParent = (
*/
export const findComponentPath = (
rootComponent: Component,
id: string,
id: string | undefined,
path: Component[] = []
): Component[] => {
if (!rootComponent || !id) {
@ -118,7 +118,7 @@ export const findAllComponents = (rootComponent: Component) => {
*/
export const findClosestMatchingComponent = (
rootComponent: Component,
componentId: string,
componentId: string | undefined,
selector: (component: Component) => boolean
) => {
if (!selector) {

View File

@ -58,7 +58,7 @@ export class ComponentTreeNodesStore extends BudiStore<OpenNodesState> {
const path = findComponentPath(selectedScreen.props, componentId)
const componentIds = path.map((component: Component) => component._id)
const componentIds = path.map((component: Component) => component._id!)
this.update((openNodes: OpenNodesState) => {
const newNodes = Object.fromEntries(

View File

@ -1,3 +1,5 @@
// TODO: analise and fix all the undefined ! and ?
import { get, derived } from "svelte/store"
import { cloneDeep } from "lodash/fp"
import { API } from "@/api"
@ -36,7 +38,7 @@ import { Utils } from "@budibase/frontend-core"
import {
ComponentDefinition,
ComponentSetting,
Component as ComponentType,
Component,
ComponentCondition,
FieldType,
Screen,
@ -45,10 +47,6 @@ import {
import { utils } from "@budibase/shared-core"
import { getSequentialName } from "@/helpers/duplicate"
interface Component extends ComponentType {
_id: string
}
export interface ComponentState {
components: Record<string, ComponentDefinition>
customComponents: string[]
@ -182,7 +180,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
* Takes an enriched component instance and applies any required migration
* logic
*/
migrateSettings(enrichedComponent: Component) {
migrateSettings(enrichedComponent: Component | null) {
const componentPrefix = "@budibase/standard-components"
let migrated = false
@ -487,7 +485,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
(component: Component) => component._component.endsWith("/form")
)
const formSteps = findAllMatchingComponents(
parentForm,
parentForm!,
(component: Component) => component._component.endsWith("/formstep")
)
extras.step = formSteps.length + 1
@ -519,7 +517,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
// Insert in position if specified
if (parent && index != null) {
await screenStore.patch((screen: Screen) => {
let parentComponent = findComponent(screen.props, parent)
let parentComponent = findComponent(screen.props, parent._id!)!
if (!parentComponent._children?.length) {
parentComponent._children = [componentInstance]
} else {
@ -538,7 +536,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
}
const currentComponent = findComponent(
screen.props,
selectedComponentId
selectedComponentId!
)
if (!currentComponent) {
return false
@ -581,7 +579,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
return state
})
componentTreeNodesStore.makeNodeVisible(componentInstance._id)
componentTreeNodesStore.makeNodeVisible(componentInstance._id!)
// Log event
analytics.captureEvent(Events.COMPONENT_CREATED, {
@ -633,7 +631,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
// Determine the next component to select, and select it before deletion
// to avoid an intermediate state of no component selection
const state = get(this.store)
let nextId = ""
let nextId: string | null = ""
if (state.selectedComponentId === component._id) {
nextId = this.getNext()
if (!nextId) {
@ -646,7 +644,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
nextId = nextId.replace("-navigation", "-screen")
}
this.update(state => {
state.selectedComponentId = nextId
state.selectedComponentId = nextId!
return state
})
}
@ -654,18 +652,18 @@ export class ComponentStore extends BudiStore<ComponentState> {
// Patch screen
await screenStore.patch((screen: Screen) => {
// Check component exists
component = findComponent(screen.props, component._id)
if (!component) {
const updatedComponent = findComponent(screen.props, component._id!)
if (!updatedComponent) {
return false
}
// Check component has a valid parent
const parent = findComponentParent(screen.props, component._id)
const parent = findComponentParent(screen.props, updatedComponent._id)
if (!parent) {
return false
}
parent._children = parent._children.filter(
(child: Component) => child._id !== component._id
parent._children = parent._children!.filter(
(child: Component) => child._id !== updatedComponent._id
)
}, null)
}
@ -706,7 +704,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
}
async paste(
targetComponent: Component,
targetComponent: Component | null,
mode: string,
targetScreen: Screen,
selectComponent = true
@ -729,7 +727,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
// Patch screen
const patch = (screen: Screen) => {
// Get up to date ref to target
targetComponent = findComponent(screen.props, targetComponent._id)
targetComponent = findComponent(screen.props, targetComponent!._id!)
if (!targetComponent) {
return false
}
@ -743,7 +741,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
if (!cut) {
componentToPaste = makeComponentUnique(componentToPaste)
}
newComponentId = componentToPaste._id
newComponentId = componentToPaste._id!
// Strip grid position metadata if pasting into a new screen, but keep
// alignment metadata
@ -791,7 +789,7 @@ export class ComponentStore extends BudiStore<ComponentState> {
}
const targetIndex = parent._children.findIndex(
(component: Component) => {
return component._id === targetComponent._id
return component._id === targetComponent!._id
}
)
const index = mode === "above" ? targetIndex : targetIndex + 1
@ -820,8 +818,8 @@ export class ComponentStore extends BudiStore<ComponentState> {
if (!screen) {
throw "A valid screen must be selected"
}
const parent = findComponentParent(screen.props, componentId)
const index = parent?._children.findIndex(
const parent = findComponentParent(screen.props, componentId)!
const index = parent?._children?.findIndex(
(x: Component) => x._id === componentId
)
@ -839,29 +837,29 @@ export class ComponentStore extends BudiStore<ComponentState> {
}
// If we have siblings above us, choose the sibling or a descendant
if (index > 0) {
if (index !== undefined && index > 0) {
// If sibling before us accepts children, and is not collapsed, select a descendant
const previousSibling = parent._children[index - 1]
const previousSibling = parent._children![index - 1]
if (
previousSibling._children?.length &&
componentTreeNodesStore.isNodeExpanded(previousSibling._id)
componentTreeNodesStore.isNodeExpanded(previousSibling._id!)
) {
let target = previousSibling
while (
target._children?.length &&
componentTreeNodesStore.isNodeExpanded(target._id)
componentTreeNodesStore.isNodeExpanded(target._id!)
) {
target = target._children[target._children.length - 1]
}
return target._id
return target._id!
}
// Otherwise just select sibling
return previousSibling._id
return previousSibling._id!
}
// If no siblings above us, select the parent
return parent._id
return parent._id!
}
getNext() {
@ -873,9 +871,9 @@ export class ComponentStore extends BudiStore<ComponentState> {
throw "A valid screen must be selected"
}
const parent = findComponentParent(screen.props, componentId)
const index = parent?._children.findIndex(
const index = parent?._children?.findIndex(
(x: Component) => x._id === componentId
)
)!
// Check for screen and navigation component edge cases
const screenComponentId = `${screen._id}-screen`
@ -888,37 +886,38 @@ export class ComponentStore extends BudiStore<ComponentState> {
if (
component?._children?.length &&
(state.selectedComponentId === navComponentId ||
componentTreeNodesStore.isNodeExpanded(component._id))
componentTreeNodesStore.isNodeExpanded(component._id!))
) {
return component._children[0]._id
return component._children[0]._id!
} else if (!parent) {
return null
}
// Otherwise select the next sibling if we have one
if (index < parent._children.length - 1) {
const nextSibling = parent._children[index + 1]
return nextSibling._id
if (index < parent._children!.length - 1) {
const nextSibling = parent._children![index + 1]
return nextSibling._id!
}
// Last child, select our parents next sibling
let target = parent
let targetParent = findComponentParent(screen.props, target._id)
let targetIndex = targetParent?._children.findIndex(
let targetIndex = targetParent?._children?.findIndex(
(child: Component) => child._id === target._id
)
)!
while (
targetParent != null &&
targetIndex === targetParent._children?.length - 1
targetParent._children &&
targetIndex === targetParent._children.length - 1
) {
target = targetParent
targetParent = findComponentParent(screen.props, target._id)
targetIndex = targetParent?._children.findIndex(
targetIndex = targetParent?._children!.findIndex(
(child: Component) => child._id === target._id
)
)!
}
if (targetParent) {
return targetParent._children[targetIndex + 1]._id
return targetParent._children![targetIndex + 1]._id!
} else {
return null
}
@ -950,16 +949,16 @@ export class ComponentStore extends BudiStore<ComponentState> {
const parent = findComponentParent(screen.props, componentId)
// Check we aren't right at the top of the tree
const index = parent?._children.findIndex(
const index = parent?._children?.findIndex(
(x: Component) => x._id === componentId
)
)!
if (!parent || (index === 0 && parent._id === screen.props._id)) {
return
}
// Copy original component and remove it from the parent
const originalComponent = cloneDeep(parent._children[index])
parent._children = parent._children.filter(
const originalComponent = cloneDeep(parent._children![index])
parent._children = parent._children!.filter(
(component: Component) => component._id !== componentId
)
@ -971,9 +970,9 @@ export class ComponentStore extends BudiStore<ComponentState> {
const definition = this.getDefinition(previousSibling._component)
if (
definition?.hasChildren &&
componentTreeNodesStore.isNodeExpanded(previousSibling._id)
componentTreeNodesStore.isNodeExpanded(previousSibling._id!)
) {
previousSibling._children.push(originalComponent)
previousSibling._children!.push(originalComponent)
}
// Otherwise just move component above sibling
@ -985,11 +984,11 @@ export class ComponentStore extends BudiStore<ComponentState> {
// If no siblings above us, go above the parent as long as it isn't
// the screen
else if (parent._id !== screen.props._id) {
const grandParent = findComponentParent(screen.props, parent._id)
const parentIndex = grandParent._children.findIndex(
const grandParent = findComponentParent(screen.props, parent._id)!
const parentIndex = grandParent._children!.findIndex(
(child: Component) => child._id === parent._id
)
grandParent._children.splice(parentIndex, 0, originalComponent)
grandParent._children!.splice(parentIndex, 0, originalComponent)
}
}, null)
}
@ -1028,9 +1027,9 @@ export class ComponentStore extends BudiStore<ComponentState> {
const definition = this.getDefinition(nextSibling._component)
if (
definition?.hasChildren &&
componentTreeNodesStore.isNodeExpanded(nextSibling._id)
componentTreeNodesStore.isNodeExpanded(nextSibling._id!)
) {
nextSibling._children.splice(0, 0, originalComponent)
nextSibling._children!.splice(0, 0, originalComponent)
}
// Otherwise move below next sibling
@ -1041,11 +1040,11 @@ export class ComponentStore extends BudiStore<ComponentState> {
// Last child, so move below our parent
else {
const grandParent = findComponentParent(screen.props, parent._id)
const parentIndex = grandParent._children.findIndex(
const grandParent = findComponentParent(screen.props, parent._id)!
const parentIndex = grandParent._children!.findIndex(
(child: Component) => child._id === parent._id
)
grandParent._children.splice(parentIndex + 1, 0, originalComponent)
grandParent._children!.splice(parentIndex + 1, 0, originalComponent)
}
}, null)
}
@ -1208,13 +1207,13 @@ export class ComponentStore extends BudiStore<ComponentState> {
}
// Replace component with parent
const index = oldParentDefinition._children.findIndex(
const index = oldParentDefinition._children!.findIndex(
(component: Component) => component._id === componentId
)
if (index === -1) {
return false
}
oldParentDefinition._children[index] = {
oldParentDefinition._children![index] = {
...newParentDefinition,
_children: [definition],
}

View File

@ -490,7 +490,7 @@ export class ScreenStore extends BudiStore<ScreenState> {
// Flatten the recursive component tree
const components = findAllMatchingComponents(
screen.props,
(x: Component) => x
(x: Component) => !!x
)
// Iterate over all components and run checks