Add array manipulation functions and editors for process (#9594)

Signed-off-by: Denis Bykhov <bykhov.denis@gmail.com>

plugins/process-resources/src/components/attributeEditors/ConfigurePopup.svelte

@@ -14,7 +14,7 @@
 -->
 <script lang="ts">
   import { MasterTag, Tag } from '@hcengineering/card'
-  import { AnyAttribute, Class, Doc, Ref } from '@hcengineering/core'
+  import { AnyAttribute, Class, Doc, DocumentQuery, Ref } from '@hcengineering/core'
   import { getClient } from '@hcengineering/presentation'
   import { Context, Func, Process, ProcessFunction, SelectedContext } from '@hcengineering/process'
   import {
@@ -36,7 +36,6 @@
   import FallbackEditor from '../contextEditors/FallbackEditor.svelte'
 
   export let process: Process
-  export let masterTag: Ref<MasterTag | Tag>
   export let contextValue: SelectedContext
   export let context: Context
   export let attribute: AnyAttribute
@@ -72,20 +71,24 @@
     .filter((p) => p.category === undefined || (allowArray && p.category === 'array'))
     .map((it) => it._id)
 
-  $: availableFunctions = getAvailableFunctions(context, contextValue.functions, attrClass, category)
+  $: availableFunctions = getAvailableFunctions(contextValue.functions, attrClass, category)
 
   $: functionsLength = contextValue.functions?.length ?? 0
 
   function getAvailableFunctions (
-    context: Context,
     functions: Func[] | undefined,
     attrClass: Ref<Class<Doc>>,
     category: AttributeCategory
   ): Ref<ProcessFunction>[] {
     const result: Ref<ProcessFunction>[] = []
-    const allFunctions = client
-      .getModel()
-      .findAllSync(plugin.class.ProcessFunction, { of: attrClass, category, type: 'transform' })
+    const query: DocumentQuery<ProcessFunction> = {
+      type: 'transform',
+      category
+    }
+    if (category !== 'array') {
+      query.of = attrClass
+    }
+    const allFunctions = client.getModel().findAllSync(plugin.class.ProcessFunction, query)
     for (const f of allFunctions) {
       if (functions === undefined || f.allowMany === true || functions.findIndex((p) => p.func === f._id) === -1) {
         result.push(f._id)
@@ -134,7 +137,7 @@
         {
           func,
           process,
-          masterTag,
+          masterTag: process.masterTag,
           context,
           attribute
         },
@@ -192,7 +195,7 @@
       func.editor,
       {
         func,
-        masterTag,
+        masterTag: process.masterTag,
         process,
         context,
         attribute,

plugins/process-resources/src/components/attributeEditors/ContextValue.svelte

@@ -51,7 +51,7 @@
     }
     showPopup(
       ConfigurePopup,
-      { contextValue, attrClass, masterTag, category, attribute, context, onChange, allowArray, forbidValue },
+      { contextValue, attrClass, process, category, attribute, context, onChange, allowArray, forbidValue },
       eventToHTMLElement(e)
     )
   }

plugins/process-resources/src/components/transformEditors/ArrayElementEditor.svelte

@@ -0,0 +1,99 @@
+<!--
+// Copyright © 2025 Hardcore Engineering Inc.
+//
+// Licensed under the Eclipse Public License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License. You may
+// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+//
+// See the License for the specific language governing permissions and
+// limitations under the License.
+-->
+<script lang="ts">
+  import { MasterTag, Tag } from '@hcengineering/card'
+  import core, { AnyAttribute, Ref } from '@hcengineering/core'
+  import { getResource } from '@hcengineering/platform'
+  import presentation, { Card, getAttributePresenterClass, getClient } from '@hcengineering/presentation'
+  import { Process, ProcessFunction } from '@hcengineering/process'
+  import { AnySvelteComponent } from '@hcengineering/ui'
+  import view from '@hcengineering/view'
+  import { createEventDispatcher } from 'svelte'
+  import { getContext } from '../../utils'
+  import ProcessAttribute from '../ProcessAttribute.svelte'
+
+  export let func: ProcessFunction
+  export let process: Process
+  export let masterTag: Ref<MasterTag | Tag>
+  export let attribute: AnyAttribute
+  export let props: Record<string, any> = {}
+
+  let value: any = props?.value ?? ''
+
+  const dispatch = createEventDispatcher()
+  const client = getClient()
+  const h = client.getHierarchy()
+
+  function save (): void {
+    dispatch('close', { value })
+  }
+
+  let editor: AnySvelteComponent | undefined
+
+  function getEditor (): void {
+    try {
+      const inlineEditor = h.as(h.getClass(core.class.ArrOf), view.mixin.AttributeEditor).inlineEditor
+      void getResource(inlineEditor)
+        .then((p) => {
+          editor = p
+        })
+        .catch((e) => {
+          console.error(e)
+        })
+    } catch (e) {
+      console.error(e)
+    }
+  }
+
+  getEditor()
+
+  $: presenterClass = getAttributePresenterClass(h, attribute.type)
+
+  $: elementContext = getContext(client, process, presenterClass.attrClass, 'object')
+</script>
+
+<Card on:close width={'x-small'} label={func.label} canSave okAction={save} okLabel={presentation.string.Save}>
+  <div class="grid">
+    <ProcessAttribute
+      {process}
+      {masterTag}
+      context={elementContext}
+      {attribute}
+      presenterClass={{
+        attrClass: presenterClass.attrClass,
+        category: 'attribute'
+      }}
+      {value}
+      {editor}
+      on:change={(e) => {
+        value = e.detail
+      }}
+    />
+  </div>
+</Card>
+
+<style lang="scss">
+  .grid {
+    display: grid;
+    width: 100%;
+    grid-template-columns: 1fr 1.5fr;
+    grid-auto-rows: minmax(1rem, max-content);
+    justify-content: start;
+    align-items: center;
+    row-gap: 0.25rem;
+    column-gap: 1rem;
+    height: min-content;
+  }
+</style>