Add room settings on panel & reduce finds (#7399)

Signed-off-by: Kristina Fefelova <kristin.fefelova@gmail.com>

models/love/src/index.ts

@@ -58,7 +58,8 @@ import {
   TypeDate,
   TypeRef,
   TypeString,
-  UX
+  UX,
+  TypeBoolean
 } from '@hcengineering/model'
 import calendar, { TEvent } from '@hcengineering/model-calendar'
 import core, { TAttachedDoc, TDoc } from '@hcengineering/model-core'
@@ -106,8 +107,13 @@ export class TRoom extends TDoc implements Room {
   x!: number
   y!: number
 
+  @Prop(TypeString(), love.string.Language, { editor: love.component.RoomLanguageEditor })
     language!: RoomLanguage
+
+  @Prop(TypeBoolean(), love.string.StartWithTranscription)
     startWithTranscription!: boolean
+
+  @Prop(TypeBoolean(), love.string.StartWithRecording)
     startWithRecording!: boolean
 
   @Prop(Collection(attachment.class.Attachment), attachment.string.Attachments, { shortLabel: attachment.string.Files })

models/love/src/plugin.ts

@@ -28,7 +28,8 @@ export default mergeIds(loveId, love, {
     Settings: '' as AnyComponent,
     LoveWidget: '' as AnyComponent,
     MeetingWidget: '' as AnyComponent,
-    WidgetSwitcher: '' as AnyComponent
+    WidgetSwitcher: '' as AnyComponent,
+    RoomLanguageEditor: '' as AnyComponent
   },
   app: {
     Love: '' as Ref<Doc>

plugins/activity-resources/src/components/doc-update-message/DocUpdateMessageContent.svelte

@@ -63,6 +63,7 @@
 
       {#each createMessages as valueMessage, index}
         <DocUpdateMessageObjectValue
+          attachedTo={valueMessage.attachedTo}
           objectClass={valueMessage.objectClass}
           objectId={valueMessage.objectId}
           action={valueMessage.action}
@@ -74,6 +75,7 @@
       {/each}
       {#each removeMessages as valueMessage, index}
         <DocUpdateMessageObjectValue
+          attachedTo={valueMessage.attachedTo}
           objectClass={valueMessage.objectClass}
           objectId={valueMessage.objectId}
           action={valueMessage.action}
@@ -87,6 +89,7 @@
       {@const len = valueMessages.length}
       {#each valueMessages as valueMessage, index}
         <DocUpdateMessageObjectValue
+          attachedTo={valueMessage.attachedTo}
           objectClass={valueMessage.objectClass}
           objectId={valueMessage.objectId}
           action={valueMessage.action}

plugins/activity-resources/src/components/doc-update-message/DocUpdateMessageObjectValue.svelte

@@ -26,6 +26,7 @@
     isAttachedDoc
   } from '@hcengineering/view-resources'
 
+  export let attachedTo: DisplayDocUpdateMessage['attachedTo']
   export let objectClass: DisplayDocUpdateMessage['objectClass']
   export let objectId: DisplayDocUpdateMessage['objectId']
   export let action: DisplayDocUpdateMessage['action']
@@ -51,8 +52,8 @@
     return await getDocLinkTitle(client, object._id, object._class, object)
   }
 
-  async function loadObject (_id: Ref<Doc>, _class: Ref<Class<Doc>>): Promise<void> {
-    const isRemoved = await checkIsObjectRemoved(client, _id, _class)
+  async function loadObject (_id: Ref<Doc>, _class: Ref<Class<Doc>>, attachedTo: Ref<Doc>): Promise<void> {
+    const isRemoved = attachedTo === _id ? false : await checkIsObjectRemoved(client, _id, _class)
 
     if (isRemoved) {
       object = await buildRemovedDoc(client, _id, _class)
@@ -64,7 +65,7 @@
     }
   }
 
-  $: void loadObject(objectId, objectClass)
+  $: void loadObject(objectId, objectClass, attachedTo)
 
   function getPanelComponent (object: Doc, objectPanel?: ObjectPanel): AnyComponent {
     if (objectPanel !== undefined) {

plugins/love-assets/lang/cs.json

@@ -78,6 +78,7 @@
     "Status": "Stav",
     "Active": "Aktivní",
     "Finished": "Dokončeno",
-    "StartWithRecording": "Začít s nahráváním"
+    "StartWithRecording": "Začít s nahráváním",
+    "Language": "Jazyk"
   }
 }

plugins/love-assets/lang/en.json

@@ -78,6 +78,7 @@
     "Status": "Status",
     "Active": "Active",
     "Finished": "Finished",
-    "StartWithRecording": "Start with recording"
+    "StartWithRecording": "Start with recording",
+    "Language": "Language"
   }
 }

plugins/love-assets/lang/es.json

@@ -78,6 +78,7 @@
     "Status": "Estado",
     "Active": "Activo",
     "Finished": "Terminado",
-    "StartWithRecording": "Iniciar con grabación"
+    "StartWithRecording": "Iniciar con grabación",
+    "Language": "Idioma"
   }
 }

plugins/love-assets/lang/fr.json

@@ -78,6 +78,7 @@
     "Status": "Statut",
     "Active": "Actif",
     "Finished": "Terminé",
-    "StartWithRecording": "Démarrer avec l'enregistrement"
+    "StartWithRecording": "Démarrer avec l'enregistrement",
+    "Language": "Langue"
   }
 }

plugins/love-assets/lang/it.json

@@ -78,6 +78,7 @@
     "Status": "Stato",
     "Active": "Attivo",
     "Finished": "Finito",
-    "StartWithRecording": "Inizia con la registrazione"
+    "StartWithRecording": "Inizia con la registrazione",
+    "Language": "Lingua"
   }
 }

plugins/love-assets/lang/pt.json

@@ -78,6 +78,7 @@
     "Status": "Estado",
     "Active": "Ativo",
     "Finished": "Finalizado",
-    "StartWithRecording": "Começar com gravação"
+    "StartWithRecording": "Começar com gravação",
+    "Language": "Idioma"
   }
 }

plugins/love-assets/lang/ru.json

@@ -78,6 +78,7 @@
     "Status": "Статус",
     "Active": "Активно",
     "Finished": "Завершено",
-    "StartWithRecording": "Начинать с записью"
+    "StartWithRecording": "Начинать с записью",
+    "Language": "Язык"
   }
 }

plugins/love-assets/lang/zh.json

@@ -78,6 +78,7 @@
     "Status": "状态",
     "Active": "活动",
     "Finished": "已完成",
-    "StartWithRecording": "开始录制"
+    "StartWithRecording": "开始录制",
+    "Language": "语言"
   }
 }

plugins/love-resources/src/components/FloorAttributePresenter.svelte

@@ -29,7 +29,7 @@
   {#if inline}
     <ObjectMention object={floor} />
   {:else}
-    <div class="flex-presenter overflow-label sm-tool-icon">
+    <div class="flex-presenter overflow-label sm-tool-icon ml-3">
       {floor.name}
     </div>
   {/if}

plugins/love-resources/src/components/RoomLanguage.svelte

@@ -18,10 +18,14 @@
   import { languagesDisplayData } from '../types'
 
   export let room: Room
+  export let withLabel = false
 
   $: lang = room.language
 </script>
 
 <span title={languagesDisplayData[lang].label ?? languagesDisplayData.en.label}>
   {languagesDisplayData[lang].emoji ?? languagesDisplayData.en.emoji}
+  {#if withLabel}
+    <span class="ml-1">{languagesDisplayData[lang].label ?? languagesDisplayData.en.label}</span>
+  {/if}
 </span>

plugins/love-resources/src/components/RoomLanguageEditor.svelte

@@ -0,0 +1,67 @@
+<script lang="ts">
+  import { Room, RoomLanguage } from '@hcengineering/love'
+  import { getEmbeddedLabel } from '@hcengineering/platform'
+
+  import RoomLanguageComponent from './RoomLanguage.svelte'
+  import {
+    Button,
+    type ButtonKind,
+    type ButtonSize,
+    DropdownIntlItem,
+    DropdownLabelsPopupIntl,
+    eventToHTMLElement,
+    showPopup
+  } from '@hcengineering/ui'
+  import { languagesDisplayData } from '../types'
+  import LanguageIcon from './LanguageIcon.svelte'
+
+  export let value: RoomLanguage = 'en'
+  export let object: Room | undefined = undefined
+  export let onChange: (value: any) => void
+  export let disabled: boolean = false
+  export let kind: ButtonKind = 'no-border'
+  export let size: ButtonSize = 'small'
+  export let justify: 'left' | 'center' = 'center'
+  export let width: string | undefined = 'fit-content'
+
+  let shown: boolean = false
+
+  let items: DropdownIntlItem[] = []
+  $: items = Object.entries(languagesDisplayData).map(([lang, data]) => ({
+    id: lang,
+    label: getEmbeddedLabel(data.label),
+    icon: LanguageIcon,
+    iconProps: { lang }
+  }))
+
+  function showLanguagesPopup (ev: MouseEvent): void {
+    shown = true
+    showPopup(DropdownLabelsPopupIntl, { items, selected: value }, eventToHTMLElement(ev), async (result) => {
+      if (result != null && result !== '') {
+        value = result
+        onChange(value)
+
+        shown = false
+      }
+    })
+  }
+</script>
+
+{#if object}
+  <Button
+    {kind}
+    {size}
+    {justify}
+    {width}
+    {disabled}
+    on:click={(ev) => {
+      if (!shown && !disabled) {
+        showLanguagesPopup(ev)
+      }
+    }}
+  >
+    <svelte:fragment slot="content">
+      <div class="pointer-events-none"><RoomLanguageComponent room={object} withLabel /></div>
+    </svelte:fragment>
+  </Button>
+{/if}

plugins/love-resources/src/index.ts

@@ -23,6 +23,7 @@ import PanelControlBar from './components/PanelControlBar.svelte'
 import RoomPresenter from './components/RoomPresenter.svelte'
 import MeetingMinutesDocEditor from './components/MeetingMinutesDocEditor.svelte'
 import MeetingMinutesStatusPresenter from './components/MeetingMinutesStatusPresenter.svelte'
+import RoomLanguageEditor from './components/RoomLanguageEditor.svelte'
 
 import {
   copyGuestLink,
@@ -59,7 +60,8 @@ export default async (): Promise<Resources> => ({
     PanelControlBar,
     RoomPresenter,
     MeetingMinutesDocEditor,
-    MeetingMinutesStatusPresenter
+    MeetingMinutesStatusPresenter,
+    RoomLanguageEditor
   },
   function: {
     CreateMeeting: createMeeting,

plugins/love-resources/src/plugin.ts

@@ -94,6 +94,7 @@ export default mergeIds(loveId, love, {
     KnockAction: '' as IntlString,
     Select: '' as IntlString,
     ChooseShare: '' as IntlString,
-    MoreOptions: '' as IntlString
+    MoreOptions: '' as IntlString,
+    Language: '' as IntlString
   }
 })

plugins/view-resources/src/components/ParentsNavigator.svelte

@@ -13,7 +13,7 @@
 // limitations under the License.
 -->
 <script lang="ts">
-  import { AttachedDoc, Doc } from '@hcengineering/core'
+  import { AttachedDoc, Doc, Ref, Class } from '@hcengineering/core'
   import { getClient } from '@hcengineering/presentation'
   import { isAttachedDoc } from '../utils'
   import DocsNavigator from './DocsNavigator.svelte'
@@ -26,19 +26,31 @@
     return 'parent' in doc && doc.parent != null
   }
 
-  async function getParents (doc: Doc | AttachedDoc): Promise<readonly Doc[]> {
-    if (!isAttachedDoc(doc) && !hasParent(doc)) {
+  function getParentId (doc: Doc | AttachedDoc): Ref<Doc> {
+    return isAttachedDoc(doc) ? doc.attachedTo : (doc as any).parent
+  }
+
+  function getParentClass (doc: Doc | AttachedDoc): Ref<Class<Doc>> {
+    return isAttachedDoc(doc) ? doc.attachedToClass : doc._class
+  }
+
+  function withParent (doc: Doc | AttachedDoc): boolean {
+    return isAttachedDoc(doc) || hasParent(doc)
+  }
+
+  async function getParents (_id: Ref<Doc>, _class: Ref<Class<Doc>>, showParents: boolean): Promise<readonly Doc[]> {
+    if (!showParents) {
       return []
     }
 
     const parents: Doc[] = []
 
-    let currentDoc: Doc | undefined = doc
+    let currentDoc: Doc | undefined = element
 
-    while (currentDoc && (isAttachedDoc(currentDoc) || hasParent(currentDoc))) {
-      const parent: Doc | undefined = isAttachedDoc(currentDoc)
-        ? await client.findOne(currentDoc.attachedToClass, { _id: currentDoc.attachedTo })
-        : await client.findOne(currentDoc._class, { _id: (currentDoc as any).parent })
+    while (currentDoc && withParent(currentDoc)) {
+      const _id = getParentId(currentDoc)
+      const _class = getParentClass(currentDoc)
+      const parent: Doc | undefined = await client.findOne(_class, { _id })
 
       if (parent) {
         currentDoc = parent
@@ -50,8 +62,15 @@
 
     return parents.reverse()
   }
+
+  let parents: readonly Doc[] = []
+
+  $: parentId = getParentId(element)
+  $: parentClass = getParentClass(element)
+  $: showParents = withParent(element)
+  $: getParents(parentId, parentClass, showParents).then((res) => {
+    parents = res
+  })
 </script>
 
-{#await getParents(element) then parents}
-  <DocsNavigator elements={parents} />
-{/await}
+<DocsNavigator elements={parents} />