Processes ui improvements (#9589)

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

plugins/process-resources/src/components/settings/AddTransitionPopup.svelte

@@ -41,10 +41,13 @@
 
   let fromState: ListItem | undefined
 
-  $: from = fromState?._id as Ref<State>
+  $: from = (fromState?._id as Ref<State>) ?? null
 
   const client = getClient()
-  const triggers = client.getModel().findAllSync(plugin.class.Trigger, { init: false })
+  const withoutFrom =
+    client.getModel().findAllSync(plugin.class.Transition, { from: null, process: process._id })[0] === undefined
+
+  const triggers = client.getModel().findAllSync(plugin.class.Trigger, { init: withoutFrom })
   let trigger: Ref<Trigger> = triggers[0]._id
 
   $: triggerValue = triggers.find((t) => t._id === trigger)
@@ -82,14 +85,18 @@
 >
   <div class="grid">
     <Label label={plugin.string.From} />
-    <Dropdown
-      items={statesItems}
-      bind:selected={fromState}
-      placeholder={plugin.string.From}
-      justify={'left'}
-      width={'100%'}
-      kind={'no-border'}
-    />
+    {#if !withoutFrom}
+      <Dropdown
+        items={statesItems}
+        bind:selected={fromState}
+        placeholder={plugin.string.From}
+        justify={'left'}
+        width={'100%'}
+        kind={'no-border'}
+      />
+    {:else}
+      <div>⦳</div>
+    {/if}
     <Label label={plugin.string.To} />
     <Dropdown
       items={statesItems}

plugins/process-resources/src/components/settings/ContextEditor.svelte

@@ -65,7 +65,7 @@
     <Grid rowGap={1}>
       {#each Object.entries(process.context) as val}
         <div class="context flex-center cursor-pointer" on:click={() => open(val[1])}>
-          {val[1].index} ->
+          {val[1].index}:
           <ProcessContextRawPresenter context={val[1]} />
         </div>
         <EditBox

plugins/process-resources/src/components/settings/ContextFooter.svelte

@@ -17,6 +17,8 @@
   import { Doc } from '@hcengineering/core'
   import { Process, Step } from '@hcengineering/process'
   import ProcessContextPresenter from '../contextEditors/ProcessContextPresenter.svelte'
+  import { Label } from '@hcengineering/ui'
+  import processPlugin from '../../plugin'
 
   export let process: Process
   export let step: Step<Doc>
@@ -26,6 +28,9 @@
   $: currentResultContext = step.result ? process.context[step.result._id] : undefined
 </script>
 
+{#if currentContext || currentResultContext}
+  <Label label={processPlugin.string.Result} />
+{/if}
 {#if currentContext}
   <div class="container">
     <ProcessContextPresenter context={currentContext} />
@@ -40,11 +45,10 @@
 
 <style lang="scss">
   .container {
-    padding: 0.5rem 1rem;
+    padding: 0.25rem 0.5rem;
     background: #3575de33;
-    padding-left: 0.75rem;
     border: 1px solid var(--primary-button-default);
-    border-radius: 0.375rem;
+    border-radius: 0.25rem;
     display: flex;
     align-items: center;
     color: var(--theme-caption-color);