From 5040593e21c10217918556b45022e78f7b110bb4 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <jannik.stehle@gmail.com>
Date: Tue, 28 Nov 2023 16:52:40 +0100
Subject: [PATCH 1/2] refactor: move link expiration rules to a helper method

This is necessary because we need the method in more than one place in the future. Also, previously this was named "expiration date", although it defines rules for setting an expiration date for a link. Hence the rename to "expiration rules".
---
 .../components/SideBar/Shares/FileLinks.vue   | 50 +++++--------------
 .../SideBar/Shares/Links/CreateQuickLink.vue  | 16 +++---
 .../SideBar/Shares/Links/DetailsAndEdit.vue   | 15 +++---
 .../Shares/Links/DetailsAndEdit.spec.ts       |  2 +-
 .../__snapshots__/DetailsAndEdit.spec.ts.snap |  2 +-
 packages/web-client/src/ocs/capabilities.ts   | 10 ++--
 packages/web-pkg/src/helpers/share/link.ts    | 41 +++++++++++++++
 .../tests/unit/helpers/share/link.spec.ts     | 23 ++++++++-
 packages/web-runtime/src/App.vue              |  2 +-
 9 files changed, 103 insertions(+), 58 deletions(-)

diff --git a/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue b/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
index d3a9dd05edc..7602fc4f36b 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
@@ -14,14 +14,14 @@
       <name-and-copy v-if="quicklink" :link="quicklink" />
       <create-quick-link
         v-else-if="canCreateLinks"
-        :expiration-date="expirationDate"
+        :expiration-rules="expirationRules"
         @create-public-link="checkLinkToCreate"
       />
       <details-and-edit
         v-if="quicklink"
         :available-role-options="getAvailableRoleOptions(quicklink)"
         :can-rename="false"
-        :expiration-date="expirationDate"
+        :expiration-rules="expirationRules"
         :is-folder-share="resource.isFolder"
         :is-modifiable="canEditLink(quicklink)"
         :is-password-enforced="isPasswordEnforcedFor(quicklink)"
@@ -54,7 +54,7 @@
         <details-and-edit
           :available-role-options="getAvailableRoleOptions(link)"
           :can-rename="true"
-          :expiration-date="expirationDate"
+          :expiration-rules="expirationRules"
           :is-folder-share="resource.isFolder"
           :is-modifiable="canEditLink(link)"
           :is-password-enforced="isPasswordEnforcedFor(link)"
@@ -89,7 +89,7 @@
           <name-and-copy :link="link" />
           <details-and-edit
             :available-role-options="getAvailableRoleOptions(link)"
-            :expiration-date="expirationDate"
+            :expiration-rules="expirationRules"
             :is-folder-share="true"
             :is-modifiable="false"
             :link="link"
@@ -113,6 +113,7 @@
 import { computed, defineComponent, inject, ref, Ref, unref } from 'vue'
 import { DateTime } from 'luxon'
 import { mapGetters, mapActions, mapMutations } from 'vuex'
+import { useGettext } from 'vue3-gettext'
 import {
   useStore,
   useCapabilitySpacesEnabled,
@@ -124,7 +125,8 @@ import {
   useCapabilityFilesSharingPublicPasswordEnforcedFor,
   useAbility,
   usePasswordPolicyService,
-  getDefaultLinkPermissions
+  getDefaultLinkPermissions,
+  getExpirationRules
 } from '@ownclouders/web-pkg'
 import { shareViaLinkHelp, shareViaIndirectLinkHelp } from '../../../helpers/contextualHelpers'
 import {
@@ -160,6 +162,7 @@ export default defineComponent({
   },
   setup() {
     const store = useStore()
+    const { current: currentLanguage } = useGettext()
     const ability = useAbility()
     const { can } = ability
     const passwordPolicyService = usePasswordPolicyService()
@@ -219,6 +222,8 @@ export default defineComponent({
       )
     }
 
+    const expirationRules = computed(() => getExpirationRules({ store, currentLanguage }))
+
     return {
       $store: store,
       ability,
@@ -241,7 +246,8 @@ export default defineComponent({
       configurationManager,
       passwordPolicyService,
       canCreateLinks,
-      canEditLink
+      canEditLink,
+      expirationRules
     }
   },
   computed: {
@@ -264,36 +270,6 @@ export default defineComponent({
       return this.outgoingLinks.find((link) => link.quicklink === true && !link.indirect)
     },
 
-    expirationDate() {
-      const expireDate = this.capabilities.files_sharing.public.expire_date
-
-      let defaultExpireDate = null
-      let maxExpireDateFromCaps = null
-
-      if (expireDate.days) {
-        const days = parseInt(expireDate.days)
-        defaultExpireDate = DateTime.now()
-          .setLocale(getLocaleFromLanguage(this.$language.current))
-          .plus({ days })
-          .toJSDate()
-      }
-
-      if (expireDate.enforced) {
-        const days = parseInt(expireDate.days)
-        maxExpireDateFromCaps = DateTime.now()
-          .setLocale(getLocaleFromLanguage(this.$language.current))
-          .plus({ days })
-          .toJSDate()
-      }
-
-      return {
-        enforced: expireDate.enforced,
-        default: defaultExpireDate,
-        min: DateTime.now().setLocale(getLocaleFromLanguage(this.$language.current)).toJSDate(),
-        max: maxExpireDateFromCaps
-      }
-    },
-
     helpersEnabled() {
       return this.configuration?.options?.contextHelpers
     },
@@ -415,7 +391,7 @@ export default defineComponent({
             ability: this.ability,
             store: this.$store
           }).toString(),
-          expiration: this.expirationDate.default,
+          expiration: this.expirationRules.default,
           password: false
         }
       })
diff --git a/packages/web-app-files/src/components/SideBar/Shares/Links/CreateQuickLink.vue b/packages/web-app-files/src/components/SideBar/Shares/Links/CreateQuickLink.vue
index 133fc766b2e..b045510bbed 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/Links/CreateQuickLink.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/Links/CreateQuickLink.vue
@@ -26,16 +26,20 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue'
-import { useAbility, getDefaultLinkPermissions, useStore } from '@ownclouders/web-pkg'
+import { defineComponent, PropType } from 'vue'
+import {
+  useAbility,
+  getDefaultLinkPermissions,
+  useStore,
+  ExpirationRules
+} from '@ownclouders/web-pkg'
 import { useGettext } from 'vue3-gettext'
 
 export default defineComponent({
   name: 'CreateQuickLink',
   props: {
-    expirationDate: {
-      type: Object,
-      default: () => {},
+    expirationRules: {
+      type: Object as PropType<ExpirationRules>,
       required: true
     }
   },
@@ -50,7 +54,7 @@ export default defineComponent({
         link: {
           name: $gettext('Link'),
           permissions: getDefaultLinkPermissions({ ability, store }).toString(),
-          expiration: props.expirationDate.enforced ? props.expirationDate.default : null,
+          expiration: props.expirationRules.enforced ? props.expirationRules.default : null,
           quicklink: true,
           password: false
         }
diff --git a/packages/web-app-files/src/components/SideBar/Shares/Links/DetailsAndEdit.vue b/packages/web-app-files/src/components/SideBar/Shares/Links/DetailsAndEdit.vue
index 74fc87fd8de..10ef4a6b810 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/Links/DetailsAndEdit.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/Links/DetailsAndEdit.vue
@@ -136,10 +136,10 @@
                 v-if="option.showDatepicker"
                 v-model="newExpiration"
                 class="link-expiry-picker oc-flex oc-width-1-1"
-                :min-date="expirationDate.min"
-                :max-date="expirationDate.max"
+                :min-date="expirationRules.min"
+                :max-date="expirationRules.max"
                 :locale="$language.current"
-                :is-required="expirationDate.enforce"
+                :is-required="expirationRules.enforced"
               >
                 <template #default="{ togglePopover }">
                   <oc-button
@@ -212,7 +212,7 @@ import { formatDateFromDateTime, formatRelativeDateFromDateTime } from '@ownclou
 import { Resource, SpaceResource } from '@ownclouders/web-client/src/helpers'
 import { createFileRouteOptions } from '@ownclouders/web-pkg'
 import { OcDrop } from 'design-system/src/components'
-import { usePasswordPolicyService } from '@ownclouders/web-pkg'
+import { usePasswordPolicyService, ExpirationRules } from '@ownclouders/web-pkg'
 import { useGettext } from 'vue3-gettext'
 
 export default defineComponent({
@@ -226,9 +226,8 @@ export default defineComponent({
       type: Boolean,
       default: false
     },
-    expirationDate: {
-      type: Object,
-      default: () => ({}),
+    expirationRules: {
+      type: Object as PropType<ExpirationRules>,
       required: true
     },
     isFolderShare: {
@@ -316,7 +315,7 @@ export default defineComponent({
             id: 'remove-expiration',
             title: this.$gettext('Remove expiration date'),
             icon: 'close',
-            isRemovable: !this.expirationDate.enforced,
+            isRemovable: !this.expirationRules.enforced,
             method: () =>
               this.updateLink({
                 link: {
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/DetailsAndEdit.spec.ts b/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/DetailsAndEdit.spec.ts
index ba0bc196701..fb0de12dd1c 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/DetailsAndEdit.spec.ts
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/DetailsAndEdit.spec.ts
@@ -77,7 +77,7 @@ function getShallowMountedWrapper(link, expireDateEnforced = false, isModifiable
       props: {
         availableRoleOptions,
         canRename: true,
-        expirationDate: {
+        expirationRules: {
           enforced: expireDateEnforced,
           default: null,
           min: 'Wed Apr 01 2020 00:00:00 GMT+0000 (Coordinated Universal Time)',
diff --git a/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/__snapshots__/DetailsAndEdit.spec.ts.snap b/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/__snapshots__/DetailsAndEdit.spec.ts.snap
index 2b33ad2de67..30618bd6920 100644
--- a/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/__snapshots__/DetailsAndEdit.spec.ts.snap
+++ b/packages/web-app-files/tests/unit/components/SideBar/Shares/Links/__snapshots__/DetailsAndEdit.spec.ts.snap
@@ -73,7 +73,7 @@ exports[`DetailsAndEdit component if user can edit renders dropdown and edit but
             </oc-button-stub>
           </li>
           <li class="oc-rounded oc-menu-item-hover">
-            <date-picker-stub class="oc-datepicker link-expiry-picker oc-flex oc-width-1-1 link-expiry-picker oc-flex oc-width-1-1" inputdebounce="1000" is24hr="false" isrange="false" locale="en" min-date="Wed Apr 01 2020 00:00:00 GMT+0000 (Coordinated Universal Time)" mode="date" modelconfig="[object Object]" popover="[object Object]" updateoninput="true">
+            <date-picker-stub class="oc-datepicker link-expiry-picker oc-flex oc-width-1-1 link-expiry-picker oc-flex oc-width-1-1" inputdebounce="1000" is24hr="false" isrange="false" isrequired="false" locale="en" min-date="Wed Apr 01 2020 00:00:00 GMT+0000 (Coordinated Universal Time)" mode="date" modelconfig="[object Object]" popover="[object Object]" updateoninput="true">
               <!-- @slot Default slot to use as the popover anchor for datepicker -->
               <!-- args is undefined during initial render, hence we check it here -->
               <!--v-if-->
diff --git a/packages/web-client/src/ocs/capabilities.ts b/packages/web-client/src/ocs/capabilities.ts
index 0d9fb639400..000c5da62fb 100644
--- a/packages/web-client/src/ocs/capabilities.ts
+++ b/packages/web-client/src/ocs/capabilities.ts
@@ -26,6 +26,12 @@ export interface PasswordEnforcedForCapability {
   read_write_delete?: boolean
 }
 
+export interface PublicExpirationCapability {
+  days?: string
+  enabled?: boolean
+  enforced?: boolean
+}
+
 export interface LastModifiedFilterCapability {
   keywords?: string[]
   enabled?: boolean
@@ -101,9 +107,7 @@ export interface Capabilities {
         alias?: boolean
         can_edit: boolean
         enabled: boolean
-        expire_date: {
-          enabled: boolean
-        }
+        expire_date: PublicExpirationCapability
         multiple: boolean
         password: {
           enforced: boolean
diff --git a/packages/web-pkg/src/helpers/share/link.ts b/packages/web-pkg/src/helpers/share/link.ts
index 7d8b01ccae1..78a20840cb8 100644
--- a/packages/web-pkg/src/helpers/share/link.ts
+++ b/packages/web-pkg/src/helpers/share/link.ts
@@ -13,6 +13,8 @@ import { Resource } from '@ownclouders/web-client'
 import { Language } from 'vue3-gettext'
 import { unref } from 'vue'
 import { showQuickLinkPasswordModal } from '../../quickActions'
+import { getLocaleFromLanguage } from '../locale'
+import { PublicExpirationCapability } from '@ownclouders/web-client/src/ocs/capabilities'
 
 export interface CreateQuicklink {
   clientService: ClientService
@@ -181,3 +183,42 @@ export const getDefaultLinkPermissions = ({
 
   return defaultPermissions
 }
+
+export type ExpirationRules = { enforced: boolean; default: DateTime; min: DateTime; max: DateTime }
+
+export const getExpirationRules = ({
+  store,
+  currentLanguage
+}: {
+  store: Store<any>
+  currentLanguage: string
+}): ExpirationRules => {
+  const expireDate: PublicExpirationCapability =
+    store.getters.capabilities.files_sharing.public.expire_date
+
+  let defaultExpireDate: DateTime = null
+  let maxExpireDateFromCaps: DateTime = null
+
+  if (expireDate.days) {
+    const days = parseInt(expireDate.days)
+    defaultExpireDate = DateTime.now()
+      .setLocale(getLocaleFromLanguage(currentLanguage))
+      .plus({ days })
+      .toJSDate()
+  }
+
+  if (expireDate.enforced) {
+    const days = parseInt(expireDate.days)
+    maxExpireDateFromCaps = DateTime.now()
+      .setLocale(getLocaleFromLanguage(currentLanguage))
+      .plus({ days })
+      .toJSDate()
+  }
+
+  return {
+    enforced: expireDate.enforced,
+    default: defaultExpireDate,
+    min: DateTime.now().setLocale(getLocaleFromLanguage(currentLanguage)).toJSDate(),
+    max: maxExpireDateFromCaps
+  }
+}
diff --git a/packages/web-pkg/tests/unit/helpers/share/link.spec.ts b/packages/web-pkg/tests/unit/helpers/share/link.spec.ts
index 68b790c6c27..092f6483471 100644
--- a/packages/web-pkg/tests/unit/helpers/share/link.spec.ts
+++ b/packages/web-pkg/tests/unit/helpers/share/link.spec.ts
@@ -2,7 +2,8 @@ import {
   copyQuicklink,
   createQuicklink,
   CreateQuicklink,
-  getDefaultLinkPermissions
+  getDefaultLinkPermissions,
+  getExpirationRules
 } from '../../../../src/helpers/share'
 import { DateTime } from 'luxon'
 import { Store } from 'vuex'
@@ -13,6 +14,7 @@ import { mock, mockDeep } from 'jest-mock-extended'
 import { Language } from 'vue3-gettext'
 import { Resource } from '@ownclouders/web-client'
 import { SharePermissionBit } from '@ownclouders/web-client/src/helpers'
+import { PublicExpirationCapability } from '@ownclouders/web-client/src/ocs/capabilities'
 
 jest.mock('@vueuse/core', () => ({
   useClipboard: jest.fn().mockReturnValue({ copy: jest.fn() })
@@ -186,3 +188,22 @@ describe('getDefaultLinkPermissions', () => {
     }
   )
 })
+
+describe('getExpirationRules', () => {
+  it('correctly computes rules based on the "expire_date"-capability', () => {
+    jest.useFakeTimers().setSystemTime(new Date('2000-01-01'))
+
+    const capabilities = mock<PublicExpirationCapability>({ enforced: true, days: '10' })
+    const rules = getExpirationRules({
+      currentLanguage: 'de',
+      store: {
+        getters: { capabilities: { files_sharing: { public: { expire_date: capabilities } } } }
+      } as Store<any>
+    })
+
+    expect(rules.enforced).toEqual(capabilities.enforced)
+    expect(rules.default).toEqual(new Date('2000-01-11'))
+    expect(rules.min).toEqual(new Date('2000-01-01'))
+    expect(rules.max).toEqual(new Date('2000-01-11'))
+  })
+})
diff --git a/packages/web-runtime/src/App.vue b/packages/web-runtime/src/App.vue
index e5abbfd6a60..bb535dfdf2b 100644
--- a/packages/web-runtime/src/App.vue
+++ b/packages/web-runtime/src/App.vue
@@ -45,9 +45,9 @@
       <template v-if="modal.customContent || modal.customComponent" #content>
         <div v-if="modal.customContent" v-html="modal.customContent" />
         <component
-          ref="modalComponent"
           :is="modal.customComponent"
           v-else
+          ref="modalComponent"
           :modal="modal"
           v-bind="modal.customComponentAttrs"
         />

From fd86ff188241dcc903d12ede3c2b92cdd7454c6b Mon Sep 17 00:00:00 2001
From: Jannik Stehle <jannik.stehle@gmail.com>
Date: Thu, 30 Nov 2023 13:13:17 +0100
Subject: [PATCH 2/2] feat: create composable for expiration rules

---
 .../src/components/SideBar/Shares/FileLinks.vue     |  7 ++-----
 packages/web-pkg/src/composables/index.ts           |  1 +
 packages/web-pkg/src/composables/links/index.ts     |  1 +
 .../src/composables/links/useExpirationRules.ts     | 13 +++++++++++++
 4 files changed, 17 insertions(+), 5 deletions(-)
 create mode 100644 packages/web-pkg/src/composables/links/index.ts
 create mode 100644 packages/web-pkg/src/composables/links/useExpirationRules.ts

diff --git a/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue b/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
index 7602fc4f36b..2644cdc391c 100644
--- a/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
+++ b/packages/web-app-files/src/components/SideBar/Shares/FileLinks.vue
@@ -113,7 +113,6 @@
 import { computed, defineComponent, inject, ref, Ref, unref } from 'vue'
 import { DateTime } from 'luxon'
 import { mapGetters, mapActions, mapMutations } from 'vuex'
-import { useGettext } from 'vue3-gettext'
 import {
   useStore,
   useCapabilitySpacesEnabled,
@@ -126,7 +125,7 @@ import {
   useAbility,
   usePasswordPolicyService,
   getDefaultLinkPermissions,
-  getExpirationRules
+  useExpirationRules
 } from '@ownclouders/web-pkg'
 import { shareViaLinkHelp, shareViaIndirectLinkHelp } from '../../../helpers/contextualHelpers'
 import {
@@ -162,9 +161,9 @@ export default defineComponent({
   },
   setup() {
     const store = useStore()
-    const { current: currentLanguage } = useGettext()
     const ability = useAbility()
     const { can } = ability
+    const { expirationRules } = useExpirationRules()
     const passwordPolicyService = usePasswordPolicyService()
     const hasResharing = useCapabilityFilesSharingResharing()
 
@@ -222,8 +221,6 @@ export default defineComponent({
       )
     }
 
-    const expirationRules = computed(() => getExpirationRules({ store, currentLanguage }))
-
     return {
       $store: store,
       ability,
diff --git a/packages/web-pkg/src/composables/index.ts b/packages/web-pkg/src/composables/index.ts
index 20484477db3..8569aa6f05c 100644
--- a/packages/web-pkg/src/composables/index.ts
+++ b/packages/web-pkg/src/composables/index.ts
@@ -14,6 +14,7 @@ export * from './fileListHeaderPosition'
 export * from './filesList'
 export * from './folderLink'
 export * from './keyboardActions'
+export * from './links'
 export * from './loadingService'
 export * from './localStorage'
 export * from './pagination'
diff --git a/packages/web-pkg/src/composables/links/index.ts b/packages/web-pkg/src/composables/links/index.ts
new file mode 100644
index 00000000000..9e447c2a677
--- /dev/null
+++ b/packages/web-pkg/src/composables/links/index.ts
@@ -0,0 +1 @@
+export * from './useExpirationRules'
diff --git a/packages/web-pkg/src/composables/links/useExpirationRules.ts b/packages/web-pkg/src/composables/links/useExpirationRules.ts
new file mode 100644
index 00000000000..5a82ad37dc3
--- /dev/null
+++ b/packages/web-pkg/src/composables/links/useExpirationRules.ts
@@ -0,0 +1,13 @@
+import { computed } from 'vue'
+import { getExpirationRules } from '../../helpers'
+import { useStore } from '../store'
+import { useGettext } from 'vue3-gettext'
+
+export const useExpirationRules = () => {
+  const store = useStore()
+  const { current: currentLanguage } = useGettext()
+
+  const expirationRules = computed(() => getExpirationRules({ store, currentLanguage }))
+
+  return { expirationRules }
+}