Property for timeshift bar (#1909)

Signed-off-by: Alexander Platov <sas_lord@mail.ru>

packages/ui/src/components/calendar/DatePickerPopup.svelte

@@ -32,6 +32,7 @@
     if (modalHTML) $dpstore.popup = modalHTML
   }
   $: component = $dpstore.component
+  $: shift = $dpstore.shift
 
   function _update (result: any): void {
     fitPopup()
@@ -106,6 +107,7 @@
   {#if $dpstore.component}
     <svelte:component
       this={component}
+      bind:shift
       bind:this={componentInstance}
       on:update={(ev) => _update(ev.detail)}
       on:change={(ev) => _change(ev.detail)}

packages/ui/src/components/calendar/DateRangePopup.svelte

@@ -23,6 +23,7 @@
   export let minutes: number[] = [5, 15, 30]
   export let hours: number[] = [1, 2, 4, 8, 12]
   export let days: number[] = [1, 3, 7, 30]
+  export let shift: boolean = false
 
   const dispatch = createEventDispatcher()
 
@@ -53,25 +54,27 @@
       }
     }}
   />
-  <div class="shift-container">
-    <Scroller>
-      {#each values as value}
-        {#if typeof value === 'number'}
-          <div
-            class="btn"
-            on:click={() => {
-              const shiftedDate = new Date(today.getTime() + value * base)
-              dispatch('change', shiftedDate)
-            }}
-          >
-            <TimeShiftPresenter value={value * base} />
-          </div>
-        {:else if value === 'divider'}
-          <div class="divider" />
-        {/if}
-      {/each}
-    </Scroller>
-  </div>
+  {#if shift}
+    <div class="shift-container">
+      <Scroller>
+        {#each values as value}
+          {#if typeof value === 'number'}
+            <div
+              class="btn"
+              on:click={() => {
+                const shiftedDate = new Date(today.getTime() + value * base)
+                dispatch('change', shiftedDate)
+              }}
+            >
+              <TimeShiftPresenter value={value * base} />
+            </div>
+          {:else if value === 'divider'}
+            <div class="divider" />
+          {/if}
+        {/each}
+      </Scroller>
+    </div>
+  {/if}
 </div>
 
 <style lang="scss">

packages/ui/src/components/calendar/DateRangePresenter.svelte

@@ -29,6 +29,7 @@
   export let labelOver: IntlString | undefined = undefined // label instead of date
   export let labelNull: IntlString = ui.string.NoDate
   export let kind: 'no-border' | 'link' = 'no-border'
+  export let noShift: boolean = false
 
   const dispatch = createEventDispatcher()
 
@@ -252,6 +253,7 @@
     $dpstore.onChange = _change
     $dpstore.onClose = _close
     $dpstore.component = DateRangePopup
+    $dpstore.shift = !noShift
   }
   let popupComp: HTMLElement
   $: if (opened && $dpstore.popup) popupComp = $dpstore.popup

packages/ui/src/components/calendar/DateTimeRangePresenter.svelte

@@ -22,6 +22,7 @@
   export let icon: 'normal' | 'warning' | 'overdue' = 'normal'
   export let labelOver: IntlString | undefined = undefined
   export let labelNull: IntlString = ui.string.NoDate
+  export let noShift: boolean = false
 </script>
 
-<DateRangePresenter bind:value withTime {editable} {icon} {labelOver} {labelNull} />
+<DateRangePresenter bind:value withTime {editable} {icon} {labelOver} {labelNull} {noShift} />

packages/ui/src/popups.ts

@@ -70,6 +70,7 @@ interface IDatePopup {
   frendlyFocus: HTMLElement[] | undefined
   onClose?: (result: any) => void
   onChange?: (result: any) => void
+  shift?: boolean
 }
 
 export const dpstore = writable<IDatePopup>({
@@ -79,7 +80,8 @@ export const dpstore = writable<IDatePopup>({
   popup: undefined,
   frendlyFocus: undefined,
   onClose: undefined,
-  onChange: undefined
+  onChange: undefined,
+  shift: undefined
 })
 
 export function showDatePopup (
@@ -89,7 +91,8 @@ export function showDatePopup (
   popup?: HTMLElement,
   frendlyFocus?: HTMLElement[] | undefined,
   onClose?: (result: any) => void,
-  onChange?: (result: any) => void
+  onChange?: (result: any) => void,
+  shift?: boolean
 ): void {
   dpstore.set({
     component: component,
@@ -98,7 +101,8 @@ export function showDatePopup (
     popup: popup,
     frendlyFocus: frendlyFocus,
     onClose: onClose,
-    onChange: onChange
+    onChange: onChange,
+    shift: shift
   })
 }
 
@@ -110,7 +114,8 @@ export function closeDatePopup (): void {
     popup: undefined,
     frendlyFocus: undefined,
     onClose: undefined,
-    onChange: undefined
+    onChange: undefined,
+    shift: undefined
   })
 }
 

plugins/board-resources/src/components/editor/CardChecklist.svelte

@@ -271,6 +271,7 @@
               bind:value={item.dueTo}
               icon={getDateIcon(item)}
               on:change={(e) => updateDueDate(item, e.detail)}
+              noShift
             />
             <UserBox
               _class={contact.class.Employee}

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

@@ -19,6 +19,7 @@
   import calendar from '../plugin'
 
   export let value: Event
+  export let noShift: boolean = false
 
   $: date = value ? new Date(value.date) : undefined
   $: dueDate = value ? new Date(value.dueDate ?? value.date) : undefined
@@ -48,6 +49,7 @@
     <DateRangePresenter
       value={date.getTime()}
       withTime={date.getMinutes() !== 0 && date.getHours() !== 0 && interval < DAY}
+      {noShift}
     />
     {#if interval > 0}
       {#await formatDueDate(interval) then t}

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

@@ -22,6 +22,7 @@
   // export let label: IntlString
   export let onChange: (value: any) => void
   export let kind: 'no-border' | 'link' = 'no-border'
+  export let noShift: boolean = false
 
   $: withTime = type?.withTime ?? true
 </script>
@@ -31,6 +32,7 @@
   {withTime}
   editable
   {kind}
+  {noShift}
   on:change={(res) => {
     if (res.detail !== undefined) onChange(res.detail)
   }}

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

@@ -18,6 +18,7 @@
   import { DateRangePresenter } from '@anticrm/ui'
 
   export let value: number | null | undefined
+  export let noShift: boolean = false
 </script>
 
-<DateRangePresenter {value} />
+<DateRangePresenter {value} {noShift} />