UBER-731

models/calendar/src/index.ts

@@ -50,8 +50,8 @@ import view, { createAction } from '@hcengineering/model-view'
 import workbench from '@hcengineering/model-workbench'
 import notification from '@hcengineering/notification'
 import setting from '@hcengineering/setting'
-import calendar from './plugin'
 import { AnyComponent } from '@hcengineering/ui'
+import calendar from './plugin'
 
 export * from '@hcengineering/calendar'
 export { calendarId } from '@hcengineering/calendar'
@@ -62,13 +62,16 @@ export const DOMAIN_CALENDAR = 'calendar' as Domain
 @Model(calendar.class.Calendar, core.class.Space)
 @UX(calendar.string.Calendar, calendar.icon.Calendar)
 export class TCalendar extends TSpaceWithStates implements Calendar {
-  @Prop(TypeString(), calendar.string.HideDetails)
-    hideDetails?: boolean
+  visibility!: 'public' | 'freeBusy' | 'private'
+
+  sync?: boolean
 }
 
 @Model(calendar.class.Event, core.class.AttachedDoc, DOMAIN_CALENDAR)
 @UX(calendar.string.Event, calendar.icon.Calendar)
 export class TEvent extends TAttachedDoc implements Event {
+  declare space: Ref<Calendar>
+
   eventId!: string
 
   @Prop(TypeString(), calendar.string.Title)
@@ -106,6 +109,8 @@ export class TEvent extends TAttachedDoc implements Event {
     externalParticipants?: string[]
 
   access!: 'freeBusyReader' | 'reader' | 'writer' | 'owner'
+
+  visibility?: 'public' | 'freeBusy' | 'private'
 }
 
 @Model(calendar.class.ReccuringEvent, calendar.class.Event)
@@ -174,7 +179,8 @@ export function createModel (builder: Builder): void {
       icon: calendar.component.CalendarIntegrationIcon,
       createComponent: calendar.component.IntegrationConnect,
       onDisconnect: calendar.handler.DisconnectHandler,
-      reconnectComponent: calendar.component.IntegrationConnect
+      reconnectComponent: calendar.component.IntegrationConnect,
+      configureComponent: calendar.component.IntegrationConfigure
     },
     calendar.integrationType.Calendar
   )

models/calendar/src/migration.ts

@@ -33,7 +33,8 @@ async function migrateCalendars (tx: TxOperations): Promise<void> {
           description: '',
           archived: false,
           private: false,
-          members: [user._id]
+          members: [user._id],
+          visibility: 'public'
         },
         `${user._id}_calendar` as Ref<Calendar>,
         undefined,
@@ -49,6 +50,11 @@ async function migrateCalendars (tx: TxOperations): Promise<void> {
   if (space !== undefined) {
     await tx.remove(space)
   }
+
+  const calendars = await tx.findAll(calendar.class.Calendar, { visibility: { $exists: false } })
+  for (const calendar of calendars) {
+    await tx.update(calendar, { visibility: 'public' })
+  }
 }
 
 async function fixEventDueDate (client: MigrationClient): Promise<void> {

models/calendar/src/plugin.ts

@@ -29,7 +29,8 @@ export default mergeIds(calendarId, calendar, {
     CreateCalendar: '' as AnyComponent,
     EventPresenter: '' as AnyComponent,
     CalendarIntegrationIcon: '' as AnyComponent,
-    CalendarEventPresenter: '' as AnyComponent
+    CalendarEventPresenter: '' as AnyComponent,
+    IntegrationConfigure: '' as AnyComponent
   },
   action: {
     SaveEventReminder: '' as Ref<Action>,

plugins/calendar-assets/lang/en.json

@@ -73,6 +73,8 @@
     "SundayShort": "Su",
     "OnUntil": "On",
     "Times": "{count, plural, one {time} other {times}}",
-    "AddParticipants": "Add participants"
+    "AddParticipants": "Add participants",
+    "Sync": "Synchronization",
+    "Busy": "Busy"
   }
 }

plugins/calendar-assets/lang/ru.json

@@ -73,7 +73,8 @@
     "SundayShort": "Вс",
     "OnUntil": "До",
     "Times": "{count, plural, one {раз} few {раза} other {раз}}",
-    "AddParticipants": "Добавить участников"
-
+    "AddParticipants": "Добавить участников",
+    "Sync": "Синхронизация",
+    "Busy": "Занято"
   }
 }

plugins/calendar-resources/src/components/CalendarEventPresenter.svelte

@@ -14,9 +14,11 @@
 -->
 <script lang="ts">
   import { Event } from '@hcengineering/calendar'
-  import { addZero } from '@hcengineering/ui'
+  import { Label, addZero } from '@hcengineering/ui'
+  import calendar from '../plugin'
 
   export let event: Event
+  export let hideDetails: boolean = false
   export let oneRow: boolean = false
   export let narrow: boolean = false
   export let size: { width: number; height: number }
@@ -30,7 +32,13 @@
 </script>
 
 {#if !narrow}
-  <b class="overflow-label">{event.title}</b>
+  {#if !hideDetails}
+    <b class="overflow-label">
+      {event.title}
+    </b>
+  {:else}
+    <span class="content-dark-color"><Label label={calendar.string.Busy} /></span>
+  {/if}
 {/if}
 {#if !oneRow}
   <span class="overflow-label text-sm">{getTime(startDate)}-{getTime(endDate)}</span>

plugins/calendar-resources/src/components/CalendarView.svelte

@@ -39,7 +39,7 @@
     getMonday,
     showPopup
   } from '@hcengineering/ui'
-  import { CalendarMode, DayCalendar } from '../index'
+  import { CalendarMode, DayCalendar, calendarStore, hidePrivateEvents } from '../index'
   import calendar from '../plugin'
   import Day from './Day.svelte'
 
@@ -66,6 +66,7 @@
   let selectedDate: Date = new Date()
 
   let raw: Event[] = []
+  let visible: Event[] = []
   let objects: Event[] = []
 
   function getFrom (date: Date, mode: CalendarMode): Timestamp {
@@ -116,7 +117,7 @@
 
   let calendars: Calendar[] = []
 
-  calendarsQuery.query(calendar.class.Calendar, { createdBy: me._id }, (res) => {
+  calendarsQuery.query(calendar.class.Calendar, { members: me._id }, (res) => {
     calendars = res
   })
 
@@ -138,7 +139,8 @@
     )
   }
   $: update(_class, query, calendars, options)
-  $: objects = getAllEvents(raw, from, to)
+  $: visible = hidePrivateEvents(raw, $calendarStore)
+  $: objects = getAllEvents(visible, from, to)
 
   function inRange (start: Date, end: Date, startPeriod: Date, period: 'day' | 'hour'): boolean {
     const endPeriod =
@@ -242,7 +244,7 @@
         current.dueDate = new Date(e.detail.date).setMinutes(new Date(e.detail.date).getMinutes() + 30)
       } else {
         const me = getCurrentAccount() as PersonAccount
-        raw.push({
+        const temp: Event = {
           _id: dragItemId,
           allDay: false,
           eventId: generateEventId(),
@@ -253,13 +255,14 @@
           attachedToClass: dragItem._class,
           _class: dragEventClass,
           collection: 'events',
-          space: dragItem.space,
+          space: `${me._id}_calendar` as Ref<Calendar>,
           modifiedBy: me._id,
           participants: [me.person],
           modifiedOn: Date.now(),
           date: e.detail.date.getTime(),
           dueDate: new Date(e.detail.date).setMinutes(new Date(e.detail.date).getMinutes() + 30)
-        })
+        }
+        raw.push(temp)
       }
       raw = raw
     }
@@ -270,7 +273,8 @@
   function clear (dragItem: Doc | undefined) {
     if (dragItem === undefined) {
       raw = raw.filter((p) => p._id !== dragItemId)
-      objects = getAllEvents(raw, from, to)
+      visible = hidePrivateEvents(raw, $calendarStore)
+      objects = getAllEvents(visible, from, to)
     }
   }
 

plugins/calendar-resources/src/components/EditEvent.svelte

@@ -20,7 +20,7 @@
   import { Button, CheckBox, DAY, EditBox, Icon, IconClose, Label, closePopup, showPopup } from '@hcengineering/ui'
   import { createEventDispatcher } from 'svelte'
   import calendar from '../plugin'
-  import { saveUTC } from '../utils'
+  import { isReadOnly, saveUTC } from '../utils'
   import EventParticipants from './EventParticipants.svelte'
   import EventTimeEditor from './EventTimeEditor.svelte'
   import RRulePresenter from './RRulePresenter.svelte'
@@ -29,6 +29,8 @@
 
   export let object: Event
 
+  $: readOnly = isReadOnly(object)
+
   let title = object.title
 
   const defaultDuration = 60 * 60 * 1000
@@ -54,6 +56,9 @@
   }
 
   async function saveEvent () {
+    if (readOnly) {
+      return
+    }
     const update: DocumentUpdate<Event> = {}
     if (object.title !== title) {
       update.title = title.trim()
@@ -97,6 +102,9 @@
   }
 
   function setRecurrance () {
+    if (readOnly) {
+      return
+    }
     showPopup(ReccurancePopup, { rules }, undefined, (res) => {
       if (res) {
         rules = res
@@ -196,7 +204,7 @@
 <div class="container">
   <div class="header flex-between">
     {#if object.attachedTo === calendar.ids.NoAttached}
-      <EditBox bind:value={title} placeholder={calendar.string.NewEvent} />
+      <EditBox bind:value={title} placeholder={calendar.string.NewEvent} disabled={readOnly} />
     {:else}
       <div />
     {/if}
@@ -213,7 +221,7 @@
     />
   </div>
   <div class="time">
-    <EventTimeEditor {allDay} bind:startDate bind:dueDate />
+    <EventTimeEditor {allDay} bind:startDate bind:dueDate disabled={readOnly} />
     <div>
       {#if !allDay && rules.length === 0}
         <div class="flex-row-center flex-gap-3 ext">
@@ -232,7 +240,7 @@
       {:else}
         <div>
           <div class="flex-row-center flex-gap-2 mt-1">
-            <CheckBox bind:checked={allDay} accented on:value={allDayChangeHandler} />
+            <CheckBox bind:checked={allDay} accented on:value={allDayChangeHandler} readonly={readOnly} />
             <Label label={calendar.string.AllDay} />
           </div>
           <div class="flex-row-center flex-gap-2 mt-1">
@@ -255,24 +263,19 @@
   </div>
   <div class="divider" />
   <div>
-    <EventParticipants bind:participants bind:externalParticipants />
+    <EventParticipants bind:participants bind:externalParticipants disabled={readOnly} />
   </div>
   <div class="divider" />
   <div class="block">
     <div class="flex-row-center flex-gap-2">
       <Icon icon={calendar.icon.Description} size="small" />
-      <EditBox bind:value={description} placeholder={calendar.string.Description} />
+      <EditBox bind:value={description} placeholder={calendar.string.Description} disabled={readOnly} />
     </div>
   </div>
   <div class="divider" />
   <div class="flex-between pool">
     <div />
-    <Button
-      kind="accented"
-      label={presentation.string.Save}
-      on:click={saveEvent}
-      disabled={title === '' && object.attachedTo === calendar.ids.NoAttached}
-    />
+    <Button kind="accented" label={presentation.string.Save} disabled={readOnly} on:click={saveEvent} />
   </div>
 </div>
 

plugins/calendar-resources/src/components/EventElement.svelte

@@ -25,9 +25,10 @@
     tooltip
   } from '@hcengineering/ui'
   import view, { ObjectEditor } from '@hcengineering/view'
+  import { Menu } from '@hcengineering/view-resources'
   import { createEventDispatcher } from 'svelte'
+  import { calendarStore, isReadOnly, isVisible } from '../utils'
   import EventPresenter from './EventPresenter.svelte'
-  import { Menu } from '@hcengineering/view-resources'
 
   export let event: Event
   export let hourHeight: number
@@ -38,9 +39,11 @@
   $: empty = size.width < 44
 
   function click () {
-    const editor = hierarchy.classHierarchyMixin<Doc, ObjectEditor>(event._class, view.mixin.ObjectEditor)
-    if (editor?.editor !== undefined) {
-      showPopup(editor.editor, { object: event })
+    if (visible) {
+      const editor = hierarchy.classHierarchyMixin<Doc, ObjectEditor>(event._class, view.mixin.ObjectEditor)
+      if (editor?.editor !== undefined) {
+        showPopup(editor.editor, { object: event })
+      }
     }
   }
 
@@ -58,6 +61,7 @@
   $: fontSize = $deviceOptionsStore.fontSize
 
   function dragStart (e: DragEvent) {
+    if (readOnly) return
     if (event.allDay) return
     originDate = event.date
     originDueDate = event.dueDate
@@ -87,6 +91,7 @@
   let dragDirection: 'bottom' | 'mid' | 'top' | undefined
 
   function drag (e: DragEvent) {
+    if (readOnly) return
     if (event.allDay) return
     if (dragInitY !== undefined) {
       const diff = Math.floor((e.y - dragInitY) / pixelPer15Min)
@@ -135,6 +140,9 @@
     ev.preventDefault()
     showPopup(Menu, { object: event }, getEventPositionElement(ev))
   }
+
+  $: visible = isVisible(event, $calendarStore)
+  $: readOnly = isReadOnly(event)
 </script>
 
 {#if event}
@@ -145,7 +153,7 @@
     class:oneRow
     class:empty
     draggable={!event.allDay}
-    use:tooltip={{ component: EventPresenter, props: { value: event } }}
+    use:tooltip={{ component: EventPresenter, props: { value: event, hideDetails: !visible } }}
     on:click|stopPropagation={click}
     on:contextmenu={showMenu}
     on:dragstart={dragStart}
@@ -154,7 +162,7 @@
     on:drop
   >
     {#if !empty && presenter?.presenter}
-      <Component is={presenter.presenter} props={{ event, narrow, oneRow }} />
+      <Component is={presenter.presenter} props={{ event, narrow, oneRow, hideDetails: !visible }} />
     {/if}
   </div>
 {/if}

plugins/calendar-resources/src/components/EventParticipants.svelte

@@ -22,6 +22,7 @@
 
   export let participants: Ref<Person>[]
   export let externalParticipants: string[]
+  export let disabled: boolean = false
 
   $: placeholder =
     participants.length > 0 || externalParticipants.length > 0