Fix set or remove expiration date on groups not possible (#9513)

* Fix set or remove expiration date on groups not possible

* Add changelog item

* Rm unused snapshot

changelog/unreleased/bugfix-set-or-remove-expiration-date-on-group-share-not-possible

@@ -0,0 +1,6 @@
+Bugfix: Set or remove expiration date on group share not possible
+
+We've fixed a bug where setting or removing an expiration on a group share wasn't possible.
+
+https://github.com/owncloud/web/pull/9513
+https://github.com/owncloud/web/issues/8419

packages/web-app-files/src/components/SideBar/Shares/Collaborators/EditDropdown.vue

@@ -28,7 +28,11 @@
                 @click="togglePopover"
               >
                 <oc-icon name="calendar-event" fill-type="line" size="medium" variation="passive" />
-                <span v-if="isExpirationDateSet" v-text="$gettext('Edit expiration date')" />
+                <span
+                  class="oc-ml-s"
+                  v-if="isExpirationDateSet"
+                  v-text="$gettext('Edit expiration date')"
+                />
                 <span v-else v-text="$gettext('Set expiration date')" />
               </oc-button>
             </template>
@@ -186,10 +190,7 @@ export default defineComponent({
     },
 
     isExpirationSupported() {
-      return (
-        (this.editingUser && this.userExpirationDate) ||
-        (this.editingGroup && this.groupExpirationDate)
-      )
+      return this.editingUser || this.editingGroup
     },
 
     isExpirationDateSet() {
@@ -248,14 +249,14 @@ export default defineComponent({
 
     isExpirationDateEnforced() {
       if (this.editingUser) {
-        return this.userExpirationDate.enforced
+        return this.userExpirationDate?.enforced
       }
 
       if (this.editingGroup) {
-        return this.groupExpirationDate.enforced
+        return this.groupExpirationDate?.enforced
       }
 
-      return this.userExpirationDate.enforced || this.groupExpirationDate.enforced
+      return this.userExpirationDate?.enforced || this.groupExpirationDate?.enforced
     },
 
     maxExpirationDate() {

packages/web-app-files/src/components/SideBar/Shares/Collaborators/InviteCollaborator/ExpirationDatepicker.vue

@@ -1,5 +1,5 @@
 <template>
-  <div v-if="available" class="oc-flex oc-flex-middle oc-flex-nowrap">
+  <div class="oc-flex oc-flex-middle oc-flex-nowrap">
     <oc-datepicker
       v-model="dateCurrent"
       :min-date="dateMin"
@@ -72,7 +72,6 @@ export default defineComponent({
     const capabilities = computed(() => store.getters.capabilities)
     const optionsUser = computed(() => capabilities.value.files_sharing.user?.expire_date)
     const optionsGroup = computed(() => capabilities.value.files_sharing.group?.expire_date)
-    const available = computed(() => optionsUser.value || optionsGroup.value)
     const enforced = computed(() => optionsUser.value?.enforced || optionsGroup.value?.enforced)
     const dateMin = DateTime.now().setLocale(language.current).toJSDate()
     const dateDefault = computed(() => {
@@ -151,7 +150,6 @@ export default defineComponent({
     return {
       language,
       enforced,
-      available,
       dateCurrent,
       dateMin,
       dateMax,

packages/web-app-files/tests/unit/components/SideBar/Shares/Collaborators/InviteCollaborator/ExpirationDatepicker.spec.ts

@@ -43,11 +43,6 @@ const enforcedCapabilities = merge({}, enabledCapabilities, {
 })
 
 describe('InviteCollaborator ExpirationDatepicker', () => {
-  it('only gets displayed if share expiration is supported', () => {
-    const { wrapper } = createWrapper()
-    expect(wrapper.html()).toMatchSnapshot()
-  })
-
   it('renders a button to open the datepicker and set an expiration date', () => {
     const { wrapper } = createWrapper({ capabilities: bareCapabilities })
     expect(wrapper.find('[data-testid="recipient-datepicker-btn"]').exists()).toBe(true)