@fugood/bricks-project 2.21.0-beta.14.test0

package/api/application.ts

@@ -0,0 +1,65 @@
+const stage = process.env.BRICKS_STAGE || 'production'
+
+const apiUrlMap = {
+  production: 'https://display.bricks.tools/api/graphql-workspace',
+  beta: 'https://display-beta.bricks.tools/api/graphql-workspace',
+  dev: 'http://localhost:3001/api/graphql-workspace',
+}
+
+const apiURL = apiUrlMap[stage]
+if (!apiURL) throw new Error(`Invalid BRICKS_STAGE: ${stage}`)
+
+const workspaceToken = process.env.BRICKS_WORKSPACE_TOKEN
+
+const doGQL = async (query: string, variables: Record<string, any>) => {
+  if (!workspaceToken) throw new Error('env BRICKS_WORKSPACE_TOKEN is not set')
+
+  const data = await fetch(apiURL, {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      Authorization: `Bearer ${workspaceToken}`,
+    },
+    body: JSON.stringify({ query, variables }),
+  }).then((res) => res.json())
+  return data
+}
+
+export const deployApp = async (appId: string, config: {}, lastCommitId: string) => {
+  const { errors } = await doGQL(
+    `mutation BRICKS_PROJECT_updateApplication($id: ID!, $config: JSON) {
+      updateApplication(
+        id: $id,
+        config: $config
+      ) {
+        _id
+        name
+      }
+    }`,
+    {
+      id: appId,
+      config: {
+        ...config,
+        bricks_project_last_commit_id: lastCommitId,
+      },
+    },
+  )
+  if (errors) throw new Error(errors[0].message)
+  return true
+}
+
+export const pullApp = async (appId: string) => {
+  const { data, errors } = await doGQL(
+    `query BRICKS_PROJECT_application($id: ID!) {
+      application(id: $id) {
+        _id
+        name
+        description
+        config
+      }
+    }`,
+    { id: appId },
+  )
+  if (errors) throw new Error(errors[0].message)
+  return data.application
+}

package/api/index.ts

@@ -0,0 +1 @@
+export * from './application'

package/compile/index.ts

@@ -0,0 +1,485 @@
+import _ from 'lodash'
+import { parse as parseAST, ExportNamedDeclaration, FunctionDeclaration } from 'acorn'
+import escodegen from 'escodegen'
+import {
+  Application,
+  Data,
+  AnimationDef,
+  AnimationComposeDef,
+  EventAction,
+  ActionWithDataParams,
+  ActionWithParams,
+  BrickItems,
+  SwitchCondData,
+  SwitchCondInnerStateCurrentCanvas,
+  SwitchCondPropertyBankByItemKey,
+  DataCalculationMap,
+  DataCalculationScript,
+  DataCalculationData,
+  DataCommand,
+  Brick,
+  Generator,
+} from '../types'
+import { generateCalulationMap } from './util'
+
+const compileProperty = (property, result = {}) => {
+  if (Array.isArray(property)) {
+    return property.map((p) => compileProperty(p, result))
+  }
+  if (property?.__typename === 'DataLink' && property.data?.()) return `PROPERTY_BANK#${property.data().id}`
+  if (typeof property === 'function') return property()?.id // defined type instance getter
+  if (typeof property === 'object') {
+    return Object.entries(property).reduce((acc, [key, value]) => {
+      acc[key] = compileProperty(value, {})
+      return acc
+    }, result)
+  }
+  return property
+}
+
+const convertOutletKey = (templateKey: string, key: string) => {
+  return `${templateKey}_${_.snakeCase(key).toUpperCase()}`
+}
+
+const compileOutlets = (templateKey: string, outlets: { [key: string]: () => Data }) => {
+  return Object.entries(outlets).reduce((acc, [key, data]) => {
+    acc[convertOutletKey(templateKey, key)] = data().id
+    return acc
+  }, {})
+}
+
+const convertEventKey = (templateKey: string, key: string) => {
+  return `${templateKey ? `${templateKey}_` : ''}${_.snakeCase(key).toUpperCase()}`
+}
+
+const basicAnimationEvents = ['show', 'standby', 'breatheStart']
+
+const compileAnimations = (templateKey: string, animations: { [key: string]: () => Animation }) => {
+  return Object.entries(animations).reduce((acc, [key, animation]) => {
+    acc[convertEventKey(basicAnimationEvents.includes(key) ? 'BRICK' : templateKey, key)] =
+      `ANIMATION#${animation().id}`
+    return acc
+  }, {})
+}
+
+const compileEvents = (
+  templateKey: string,
+  eventMap: { [key: string]: Array<EventAction> },
+  options = { camelCase: false },
+) => {
+  const { camelCase } = options
+  return Object.entries(eventMap).reduce((acc, [key, events]) => {
+    acc[convertEventKey(templateKey, key)] = events.map((event) => {
+      const { handler, action } = event
+
+      const parameterList: Array<object> = []
+      if (Object.hasOwn(action, 'params')) {
+        const actionDef = action as ActionWithParams
+        ;(actionDef.params || []).forEach(({ input, value, mapping }) => {
+          parameterList.push({
+            [camelCase ? 'inputToReceiver' : 'input_to_receiver']: input,
+            [camelCase ? 'resultFromSender' : 'result_from_sender']: compileProperty(value),
+            [camelCase ? 'resultDataMapping' : 'result_data_mapping']: mapping,
+          })
+        })
+      } else if (Object.hasOwn(action, 'dataParams')) {
+        const actionDef = action as ActionWithDataParams
+        ;(actionDef.dataParams || []).forEach(({ input, value, mapping }) => {
+          if (!input) return
+          parameterList.push({
+            [camelCase ? 'inputToReceiver' : 'input_to_receiver']: input().id,
+            [camelCase ? 'resultFromSender' : 'result_from_sender']: compileProperty(value),
+            [camelCase ? 'resultDataMapping' : 'result_data_mapping']: mapping,
+          })
+        })
+      }
+      let handlerKey
+      if (handler === 'system' || typeof handler === 'string') {
+        if (handler.startsWith('SUBSPACE_')) handlerKey = handler
+        else handlerKey = handler.toUpperCase()
+      } else if (typeof handler === 'function') {
+        handlerKey = (handler() as Brick | Generator)?.id
+      }
+      if (!handlerKey) throw new Error(`Invalid handler: ${handler}`)
+      return {
+        handler: handlerKey,
+        action: action.__actionName,
+        [camelCase ? 'parameterList' : 'parameter_list']: parameterList,
+        [camelCase ? 'waitAsync' : 'wait_async']: event.waitAsync,
+      }
+    })
+    return acc
+  }, {})
+}
+
+const compileSwitchConds = (templateKey, conds) =>
+  (conds || []).map((item: any) => {
+    const result: any = { method: item.method }
+    if (item.__typename === 'SwitchCondData') {
+      const cond = item as SwitchCondData
+      result.type = 'property_bank'
+      result.key = cond.data().id
+      result.value = cond.value
+    } else if (item.__typename === 'SwitchCondPropertyBankByItemKey') {
+      const cond = item as SwitchCondPropertyBankByItemKey
+      result.type = 'property_bank_by_item_key'
+      result.key = cond.data().id
+      result.value = cond.value
+    } else if (item.__typename === 'SwitchCondInnerStateOutlet') {
+      result.type = 'inner_state'
+      result.key = convertOutletKey(templateKey, item.outlet)
+      result.value = item.value
+    } else if (item.__typename === 'SwitchCondInnerStateCurrentCanvas') {
+      const cond = item as SwitchCondInnerStateCurrentCanvas
+      result.type = 'inner_state'
+      result.key = 'current_canvas'
+      result.value = cond.value().id
+    }
+    return result
+  })
+
+const compileApplicationSettings = (settings: Application['settings']) => {
+  return {
+    internet_reachability_url: settings?.internetReachabilityUrl,
+    enable_data_lock: settings?.enableDataLock,
+    show_deprecated_features: settings?.showDeprecatedFeatures,
+    enable_unstable_bricks: settings?.enableUnstableFeatures,
+    runtime_cache_options: settings?.runtimeCacheOptions
+      ? {
+          disabled: settings.runtimeCacheOptions.disabled,
+          behavior: settings.runtimeCacheOptions.behavior,
+          retry_attempt_for_failure: settings.runtimeCacheOptions.retryAttemptForFailure,
+        }
+      : undefined,
+    tv_options: settings?.tvOptions
+      ? {
+          disabled_selectable: settings.tvOptions.disabledSelectable,
+          selectable_color: settings.tvOptions.selectableColor,
+          selectable_border: settings.tvOptions.selectableBorder,
+        }
+      : undefined,
+  }
+}
+
+const animationTypeMap = {
+  AnimationTimingConfig: 'timing',
+  AnimationSpringConfig: 'spring',
+  AnimationDecayConfig: 'decay',
+}
+
+export const compile = (app: Application) => {
+  const config = {
+    title: app.name,
+    subspace_map: app.subspaces.reduce((subspaceMap, subspace) => {
+      subspaceMap[subspace.id] = {
+        title: subspace.title,
+        description: subspace.description,
+        layout: {
+          width: subspace.layout?.width,
+          height: subspace.layout?.height,
+          resize_mode: subspace.layout?.resizeMode,
+        },
+        animation_map: subspace.animations.reduce((map, animation) => {
+          if (animation.__typename === 'Animation') {
+            const animationDef = animation as AnimationDef
+            map[animationDef.id] = {
+              title: animationDef.title,
+              description: animationDef.description,
+              animationRunType: animationDef.runType,
+              property: animationDef.property,
+              type: animationTypeMap[animationDef.config.__type],
+              config: compileProperty(_.omit(animationDef.config, '__type')),
+            }
+          } else if (animation.__typename === 'AnimationCompose') {
+            const animationDef = animation as AnimationComposeDef
+            map[animationDef.id] = {
+              title: animationDef.title,
+              description: animationDef.description,
+              animationRunType: animationDef.runType,
+              compose_type: animationDef.composeType,
+              item_list: animationDef.items.map((item) => ({ animation_id: item().id })),
+            }
+          }
+          return map
+        }, {}),
+        brick_map: subspace.bricks.reduce((map, brick) => {
+          const property = compileProperty(brick.property || {})
+          if (brick.templateKey === 'BRICK_ITEMS') {
+            const brickItems = brick as BrickItems
+            const buildList = (itemBrick) => ({
+              title: itemBrick.title,
+              brickId: itemBrick.brickId,
+              brickIdPrefix: itemBrick.brickIdPrefix,
+              templateKey: itemBrick.templateKey,
+              property: compileProperty(itemBrick.property),
+              animation: compileAnimations(itemBrick.templateKey, itemBrick.animation || {}),
+              outlet: compileOutlets(itemBrick.templateKey, itemBrick.outlets || {}),
+              eventMap: compileEvents(itemBrick.templateKey, itemBrick.eventMap || {}, {
+                camelCase: true,
+              }),
+              stateGroup: itemBrick.stateGroup.map((stateGroup) => ({
+                ...stateGroup,
+                animation: compileAnimations(itemBrick.templateKey, stateGroup.animation || {}),
+                commented: stateGroup.disabled,
+                conds: compileSwitchConds(itemBrick.templateKey, stateGroup.conds || []),
+                property: compileProperty(stateGroup.property),
+                outlet: compileOutlets(itemBrick.templateKey, stateGroup.outlets || {}),
+                eventMap: compileEvents(itemBrick.templateKey, stateGroup.eventMap || {}, {
+                  camelCase: true,
+                }),
+              })),
+            })
+            if (Array.isArray(brickItems.brickList)) {
+              const brickList = (brickItems.brickList || []).map(buildList)
+              property.brickList = brickList
+            } else {
+              // Not supported Data for brickList
+              throw new Error('Not supported Data for brickList directly')
+            }
+            if (Array.isArray(brickItems.brickDetails)) {
+              const brickDetails = (brickItems.brickDetails || []).map(buildList)
+              property.brickDetails = brickDetails
+            } else {
+              // Not supported Data for brickList
+              throw new Error('Not supported Data for brickList directly')
+            }
+          }
+          map[brick.id] = {
+            template_key: brick.templateKey,
+            title: brick.title,
+            description: brick.description,
+            property,
+            animation: compileAnimations(brick.templateKey, brick.animation || {}),
+            event_map: compileEvents(brick.templateKey, brick.events || {}),
+            outlet: compileOutlets(brick.templateKey, brick.outlets || {}),
+            state_group: brick.switches.reduce((acc, switchCase) => {
+              acc[switchCase.id] = {
+                title: switchCase.title,
+                description: switchCase.description,
+                break: switchCase.break,
+                override: switchCase.override,
+                commented: switchCase.disabled,
+                conds: compileSwitchConds(brick.templateKey, switchCase.conds || []),
+                property: compileProperty(switchCase.property),
+                outlet: compileOutlets(brick.templateKey, switchCase.outlets || {}),
+                event_map: compileEvents(brick.templateKey, switchCase.events || {}),
+                animation: compileAnimations(brick.templateKey, switchCase.animation || {}),
+              }
+              return acc
+            }, {}),
+          }
+          return map
+        }, {}),
+        root_canvas_id: subspace.rootCanvas.id,
+        canvas_map: subspace.canvases.reduce((map, canvas) => {
+          map[canvas.id] = {
+            title: canvas.title,
+            description: canvas.description,
+            property: compileProperty(canvas.property),
+            event_map: compileEvents('CANVAS', canvas.events || {}),
+            state_group: canvas.switches.reduce((acc, switchCase) => {
+              acc[switchCase.id] = {
+                title: switchCase.title,
+                description: switchCase.description,
+                break: switchCase.break,
+                override: switchCase.override,
+                commented: switchCase.disabled,
+                conds: compileSwitchConds('CANVAS', switchCase.conds || []),
+                property: compileProperty(switchCase.property),
+                event_map: compileEvents('CANVAS', switchCase.events || {}),
+                animation: compileAnimations('CANVAS', switchCase.animation || {}),
+              }
+              return acc
+            }, {}),
+            item_list: [], // TODO
+          }
+          return map
+        }, {}),
+        generator_map: subspace.generators.reduce((map, generator) => {
+          map[generator.id] = {
+            template_key: generator.templateKey,
+            title: generator.title,
+            description: generator.description,
+            property: compileProperty(generator.property || {}),
+            event_map: compileEvents(generator.templateKey, generator.events || {}),
+            outlet: compileOutlets(generator.templateKey, generator.outlets || {}),
+            state_group: generator.switches.reduce((acc, switchCase) => {
+              acc[switchCase.id] = {
+                title: switchCase.title,
+                description: switchCase.description,
+                break: switchCase.break,
+                override: switchCase.override,
+                commented: switchCase.disabled,
+                conds: compileSwitchConds(generator.templateKey, switchCase.conds || []),
+                property: compileProperty(switchCase.property),
+                outlet: compileOutlets(generator.templateKey, switchCase.outlets || {}),
+                event_map: compileEvents(generator.templateKey, switchCase.events || {}),
+                animation: compileAnimations(generator.templateKey, switchCase.animation || {}),
+              }
+              return acc
+            }, {}),
+          }
+          return map
+        }, {}),
+        property_bank_map: subspace.data.reduce((map, data) => {
+          map[data.id] = {
+            title: data.title,
+            description: data.description,
+            persist_data: data.persistData,
+            routing: data.routing,
+            schema: data.schema,
+            type: data.type,
+            value: data.value,
+            event_map: compileEvents('PROPERTY_BANK', data.events || {}),
+          }
+          return map
+        }, {}),
+        property_bank_calc_map: subspace.dataCalculation.reduce((map, dataCalc) => {
+          const calc: any = {
+            title: dataCalc.title,
+            description: dataCalc.description,
+          }
+          if (dataCalc.__typename === 'DataCalculationMap') {
+            calc.type = 'general'
+            const mapCalc = dataCalc as DataCalculationMap
+
+            const generateInputPorts = (inputs, outputs) =>
+              inputs.reduce((acc, port) => {
+                if (!port.source().id) return acc
+
+                const firstOutput = outputs[0]
+                let disableTriggerCommandIn = firstOutput?.target().id
+
+                if (!acc[port.key]) acc[port.key] = []
+                acc[port.key].push({
+                  id: port.source().id,
+                  port: port.sourceKey,
+                  disable_trigger_command_in: disableTriggerCommandIn,
+                })
+                return acc
+              }, {})
+
+            const generateOutputPorts = (outputs) =>
+              outputs.reduce((acc, port) => {
+                if (!port.target().id) return acc
+
+                if (!acc[port.key]) acc[port.key] = []
+                acc[port.key].push({
+                  id: port.target().id,
+                  port: port.targetKey,
+                })
+                return acc
+              }, {})
+
+            const getNodeId = (node) => {
+              if (node.__typename === 'DataCalculationData') return node.data.id
+              if (node.__typename === 'DataCommand') return node.id
+              throw new Error(`Invalid node: ${JSON.stringify(node)}`)
+            }
+
+            calc.map = mapCalc.nodes.reduce((acc, node) => {
+              if (node.__typename === 'DataCalculationData') {
+                const dataNode = node as DataCalculationData
+                acc[getNodeId(dataNode)] = {
+                  title: dataNode.title,
+                  description: dataNode.description,
+                  type: 'data-node',
+                  properties: {},
+                  in: generateInputPorts(dataNode.inputs, dataNode.outputs),
+                  out: generateOutputPorts(dataNode.outputs),
+                }
+              } else if (node.__typename === 'DataCommand') {
+                const commandNode = node as DataCommand
+                const commandName = commandNode.__commandName
+                const type = commandName.split('_')[0].toLowerCase()
+
+                const args = commandNode.inputs.filter(
+                  (input) =>
+                    typeof input.source !== 'function' ||
+                    input.source()?.__typename !== 'DataCalculationData' &&
+                    input.source()?.__typename !== 'DataCommand',
+                )
+                const inputs = commandNode.inputs.filter(
+                  (input) =>
+                    typeof input.source === 'function' &&
+                    (input.source()?.__typename === 'DataCalculationData' ||
+                      input.source()?.__typename === 'DataCommand'),
+                )
+                acc[getNodeId(commandNode)] = {
+                  title: commandNode.title,
+                  description: commandNode.description,
+                  type: `command-node-${type}`,
+                  properties: {
+                    command: commandNode.__commandName,
+                    args: args.reduce((acc, input) => {
+                      acc[input.key] = input.source
+                      return acc
+                    }, {}),
+                  },
+                  in: generateInputPorts(inputs, commandNode.outputs),
+                  out: generateOutputPorts(commandNode.outputs),
+                }
+              }
+              return acc
+            }, {})
+            calc.editor_info = mapCalc.editorInfo.reduce((acc, editorInfo) => {
+              acc[getNodeId(editorInfo.node)] = {
+                position: editorInfo.position,
+                points: editorInfo.points.reduce((acc, point) => {
+                  const sourceId = getNodeId(point.source)
+                  const targetId = getNodeId(point.target)
+                  const key = `${sourceId}-${point.sourceOutputKey}-${targetId}-${point.targetInputKey}`
+                  acc[key] = point.positions
+                  return acc
+                }, {}),
+              }
+              return acc
+            }, {})
+          } else if (dataCalc.__typename === 'DataCalculationScript') {
+            const scriptCalc = dataCalc as DataCalculationScript
+            calc.type = 'script'
+
+            const program = parseAST(scriptCalc.code, { sourceType: 'module', ecmaVersion: 2020 })
+            // export function main() { ... }
+            const declarationBody = (
+              (program.body[0] as ExportNamedDeclaration).declaration as FunctionDeclaration
+            )?.body
+
+            calc.script_config = {
+              code: escodegen.generate(declarationBody),
+              enable_async: scriptCalc.enableAsync,
+              inputs: scriptCalc.inputs.reduce((acc, input) => {
+                acc[input.data().id] = input.key
+                return acc
+              }, {}),
+              disabled_triggers: scriptCalc.inputs.reduce((acc, input) => {
+                acc[input.data().id] = !input.trigger
+                return acc
+              }, {}),
+              output: scriptCalc.output?.().id,
+              outputs: scriptCalc.outputs.reduce((acc, output) => {
+                if (!acc[output.key]) acc[output.key] = []
+                acc[output.key].push(output.data().id)
+                return acc
+              }, {}),
+              error: scriptCalc.error?.().id,
+            }
+
+            Object.assign(calc, generateCalulationMap(calc.script_config, {
+              snapshotMode: process.env.BRICKS_SNAPSHOT_MODE === '1',
+            }))
+          }
+          map[dataCalc.id] = calc
+          return map
+        }, {}),
+        action_map: subspace.actions || {},
+        event_map: compileEvents('', subspace.events || {}),
+      }
+      return subspaceMap
+    }, {}),
+    root_subspace_id: app.rootSubspace.id,
+    fonts: app.fonts,
+    ...compileApplicationSettings(app.settings),
+  }
+  return config
+}