From c23ed76368125905cb0cb23273d8835b36f017a8 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 15:14:35 +0200
Subject: [PATCH 01/25] Init

---
 .../src/components/OcModal/OcModal.vue        |  42 +++--
 .../components/FilesList/ContextActions.vue   |   8 +-
 .../src/composables/actions/files/index.ts    |   1 +
 .../actions/files/useFileActions.ts           |   5 +-
 .../useFileActionsCreateSpaceFromResource.ts  | 154 ++++++++++++++++++
 5 files changed, 190 insertions(+), 20 deletions(-)
 create mode 100644 packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts

diff --git a/packages/design-system/src/components/OcModal/OcModal.vue b/packages/design-system/src/components/OcModal/OcModal.vue
index d05a7d4b963..bea212d9a25 100644
--- a/packages/design-system/src/components/OcModal/OcModal.vue
+++ b/packages/design-system/src/components/OcModal/OcModal.vue
@@ -17,23 +17,31 @@
           <div v-if="$slots.content" key="modal-slot-content" class="oc-modal-body-message">
             <slot name="content" />
           </div>
-          <oc-text-input
-            v-else-if="hasInput"
-            key="modal-input"
-            ref="ocModalInput"
-            v-model="userInputValue"
-            class="oc-modal-body-input"
-            :error-message="inputError"
-            :label="inputLabel"
-            :type="inputType"
-            :description-message="inputDescription"
-            :disabled="inputDisabled"
-            :fix-message-line="true"
-            :selection-range="inputSelectionRange"
-            @update:model-value="inputOnInput"
-            @keydown.enter.prevent="confirm"
-          />
-          <p v-else key="modal-message" class="oc-modal-body-message oc-m-rm" v-text="message" />
+          <template v-else>
+            <p
+              v-if="message"
+              key="modal-message"
+              class="oc-modal-body-message oc-mt-rm"
+              :class="{ 'oc-mb-rm': !hasInput }"
+              v-text="message"
+            />
+            <oc-text-input
+              v-if="hasInput"
+              key="modal-input"
+              ref="ocModalInput"
+              v-model="userInputValue"
+              class="oc-modal-body-input"
+              :error-message="inputError"
+              :label="inputLabel"
+              :type="inputType"
+              :description-message="inputDescription"
+              :disabled="inputDisabled"
+              :fix-message-line="true"
+              :selection-range="inputSelectionRange"
+              @update:model-value="inputOnInput"
+              @keydown.enter.prevent="confirm"
+            />
+          </template>
           <div v-if="checkboxLabel" class="oc-modal-body-actions oc-flex oc-flex-left">
             <oc-checkbox
               v-model="checkboxValue"
diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index 8dfdf63eb64..ac05666ded5 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -30,7 +30,8 @@ import {
   useFileActionsSetImage,
   useFileActionsShowEditTags,
   useFileActionsNavigate,
-  useFileActionsFavorite
+  useFileActionsFavorite,
+  useFileActionsCreateSpaceFromResource
 } from '../../composables/actions/files'
 import { FileActionOptions } from 'web-pkg/src/composables/actions'
 
@@ -66,6 +67,7 @@ export default defineComponent({
     const { actions: setSpaceReadmeActions } = useFileActionsSetReadme({ store })
     const { actions: showDetailsActions } = useFileActionsShowDetails({ store })
     const { actions: showEditTagsActions } = useFileActionsShowEditTags({ store })
+    const { actions: createSpaceFromResourceActions } = useFileActionsCreateSpaceFromResource({ store })
     const { actions: showSharesActions } = useFileActionsShowShares({ store })
 
     // type cast to make vue-tsc aware of the type
@@ -79,7 +81,8 @@ export default defineComponent({
         ...unref(copyActions),
         ...unref(emptyTrashBinActions),
         ...unref(deleteActions),
-        ...unref(restoreActions)
+        ...unref(restoreActions),
+        ...unref(createSpaceFromResourceActions)
       ].filter((item) => item.isEnabled(unref(actionOptions)))
     )
 
@@ -109,6 +112,7 @@ export default defineComponent({
         ...unref(copyActions),
         ...unref(pasteActions),
         ...unref(renameActions),
+        ...unref(createSpaceFromResourceActions),
         ...unref(showEditTagsActions),
         ...unref(restoreActions),
         ...unref(acceptShareActions),
diff --git a/packages/web-app-files/src/composables/actions/files/index.ts b/packages/web-app-files/src/composables/actions/files/index.ts
index 1c7c946440e..1203708d328 100644
--- a/packages/web-app-files/src/composables/actions/files/index.ts
+++ b/packages/web-app-files/src/composables/actions/files/index.ts
@@ -18,3 +18,4 @@ export * from './useFileActionsShowActions'
 export * from './useFileActionsShowDetails'
 export * from './useFileActionsShowEditTags'
 export * from './useFileActionsShowShares'
+export * from './useFileActionsCreateSpaceFromResource'
diff --git a/packages/web-app-files/src/composables/actions/files/useFileActions.ts b/packages/web-app-files/src/composables/actions/files/useFileActions.ts
index d317750f561..ebc0a3fec40 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActions.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActions.ts
@@ -27,7 +27,8 @@ import {
   useFileActionsNavigate,
   useFileActionsRename,
   useFileActionsRestore,
-  useFileActionsShowEditTags
+  useFileActionsShowEditTags,
+  useFileActionsCreateSpaceFromResource
 } from './index'
 
 export const EDITOR_MODE_EDIT = 'edit'
@@ -55,6 +56,7 @@ export const useFileActions = ({ store }: { store?: Store<any> } = {}) => {
   const { actions: renameActions } = useFileActionsRename({ store })
   const { actions: restoreActions } = useFileActionsRestore({ store })
   const { actions: showEditTagsActions } = useFileActionsShowEditTags({ store })
+  const { actions: createSpaceFromResource } = useFileActionsCreateSpaceFromResource({ store })
 
   const systemActions = computed((): Action[] => [
     ...unref(downloadArchiveActions),
@@ -63,6 +65,7 @@ export const useFileActions = ({ store }: { store?: Store<any> } = {}) => {
     ...unref(moveActions),
     ...unref(copyActions),
     ...unref(renameActions),
+    ...unref(createSpaceFromResource),
     ...unref(showEditTagsActions),
     ...unref(restoreActions),
     ...unref(acceptShareActions),
diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
new file mode 100644
index 00000000000..8ffc84c500e
--- /dev/null
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -0,0 +1,154 @@
+import { Store } from 'vuex'
+import { computed, unref } from 'vue'
+import { useGettext } from 'vue3-gettext'
+import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
+import { configurationManager, useAbility, useClientService, useRouter } from 'web-pkg'
+import { buildSpace, isPersonalSpaceResource } from 'web-client/src/helpers'
+import { isLocationSpacesActive } from 'web-app-files/src/router'
+import { WebDAV } from 'web-client/src/webdav'
+import { Drive } from 'web-client/src/generated'
+
+export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store<any> } = {}) => {
+  const { can } = useAbility()
+  const { $gettext, $ngettext } = useGettext()
+  const router = useRouter()
+  const clientService = useClientService()
+  const hasCreatePermission = computed(() => can('create-all', 'Space'))
+
+  const confirmAction = async ({ spaceName, resources }) => {
+    store.dispatch('hideModal')
+
+    try {
+      const client = clientService.graphAuthenticated
+      const { data: createdSpace } = await client.drives.createDrive({ name: spaceName }, {})
+      const spaceResource = buildSpace({
+        ...createdSpace,
+        serverUrl: configurationManager.serverUrl
+      })
+      store.commit('runtime/spaces/UPSERT_SPACE', spaceResource)
+
+      await (clientService.webdav as WebDAV).createFolder(spaceResource, { path: '.space' })
+      const markdown = await (clientService.webdav as WebDAV).putFileContents(spaceResource, {
+        path: '.space/readme.md',
+        content: $gettext('Here you can add a description for this Space.')
+      })
+
+      const { data: updatedSpace } = await client.drives.updateDrive(
+        createdSpace.id,
+        {
+          special: [
+            {
+              specialFolder: {
+                name: 'readme'
+              },
+              id: markdown.id as string
+            }
+          ]
+        } as Drive,
+        {}
+      )
+      store.commit('runtime/spaces/UPDATE_SPACE_FIELD', {
+        id: createdSpace.id,
+        field: 'spaceReadmeData',
+        value: updatedSpace.special.find((special) => special.specialFolder.name === 'readme')
+      })
+      store.commit('runtime/spaces/UPDATE_SPACE_FIELD', {
+        id: createdSpace.id,
+        field: 'spaceQuota',
+        value: updatedSpace.quota
+      })
+    } catch (error) {
+      console.error(error)
+      store.dispatch('showMessage', {
+        title: $gettext('Creating space failed…'),
+        status: 'danger'
+      })
+    }
+  }
+  const handler = ({ resources, space }: FileActionOptions) => {
+    const modal = {
+      variation: 'passive',
+      title: $ngettext(
+        'Create Space from "%{resourceName}"',
+        'Create Space from selection',
+        resources.length,
+        {
+          resourceName: resources[0].name
+        }
+      ),
+      message: $ngettext(
+        'Create Space with the content of "%{resourceName}". The content will be copied',
+        'Create Space with the selected files. The content will be copied',
+        resources.length,
+        {
+          resourceName: resources[0].name
+        }
+      ),
+      cancelText: $gettext('Cancel'),
+      confirmText: $gettext('Create'),
+      hasInput: true,
+      inputLabel: $gettext('Space name'),
+      onInput: checkSpaceName,
+      onCancel: () => store.dispatch('hideModal'),
+      onConfirm: (spaceName) => confirmAction({ spaceName, space, resources })
+    }
+
+    store.dispatch('createModal', modal)
+  }
+
+  const checkSpaceName = (name) => {
+    if (name.trim() === '') {
+      return store.dispatch('setModalInputErrorMessage', $gettext('Space name cannot be empty'))
+    }
+    if (name.length > 255) {
+      return store.dispatch(
+        'setModalInputErrorMessage',
+        $gettext('Space name cannot exceed 255 characters')
+      )
+    }
+    if (/[/\\.:?*"><|]/.test(name)) {
+      return store.dispatch(
+        'setModalInputErrorMessage',
+        $gettext('Space name cannot contain the following characters: / \\\\ . : ? * " > < |\'')
+      )
+    }
+    store.dispatch('setModalInputErrorMessage', null)
+  }
+
+  const actions = computed((): FileAction[] => {
+    return [
+      {
+        name: 'create-space-from-resource',
+        icon: 'layout-grid',
+        handler,
+        label: () => {
+          return $gettext('Create Space from selection')
+        },
+        isEnabled: ({ resources, space }) => {
+          if (!resources.length) {
+            return false
+          }
+
+          if (!unref(hasCreatePermission)) {
+            return false
+          }
+
+          if (
+            !isLocationSpacesActive(router, 'files-spaces-generic') ||
+            !isPersonalSpaceResource(space)
+          ) {
+            return false
+          }
+
+          return true
+        },
+        componentType: 'button',
+        class: 'oc-files-actions-create-space-from-resource-trigger'
+      }
+    ]
+  })
+
+  return {
+    actions
+  }
+}

From 8ab083e22f011611b514c2c18ae7c7ea6907f1d6 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 15:32:17 +0200
Subject: [PATCH 02/25] Enhacement

---
 .../useFileActionsCreateSpaceFromResource.ts  | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 8ffc84c500e..6afc3073c9e 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -2,7 +2,13 @@ import { Store } from 'vuex'
 import { computed, unref } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
-import { configurationManager, useAbility, useClientService, useRouter } from 'web-pkg'
+import {
+  configurationManager,
+  useAbility,
+  useClientService,
+  useLoadingService,
+  useRouter
+} from 'web-pkg'
 import { buildSpace, isPersonalSpaceResource } from 'web-client/src/helpers'
 import { isLocationSpacesActive } from 'web-app-files/src/router'
 import { WebDAV } from 'web-client/src/webdav'
@@ -11,15 +17,16 @@ import { Drive } from 'web-client/src/generated'
 export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store<any> } = {}) => {
   const { can } = useAbility()
   const { $gettext, $ngettext } = useGettext()
+  const loadingService = useLoadingService()
   const router = useRouter()
   const clientService = useClientService()
   const hasCreatePermission = computed(() => can('create-all', 'Space'))
 
-  const confirmAction = async ({ spaceName, resources }) => {
+  const confirmAction = async ({ spaceName, resources, space }) => {
     store.dispatch('hideModal')
+    const client = clientService.graphAuthenticated
 
     try {
-      const client = clientService.graphAuthenticated
       const { data: createdSpace } = await client.drives.createDrive({ name: spaceName }, {})
       const spaceResource = buildSpace({
         ...createdSpace,
@@ -57,6 +64,10 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
         field: 'spaceQuota',
         value: updatedSpace.quota
       })
+
+      store.dispatch('showMessage', {
+        title: $gettext('Space was created successfully')
+      })
     } catch (error) {
       console.error(error)
       store.dispatch('showMessage', {
@@ -90,7 +101,8 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
       inputLabel: $gettext('Space name'),
       onInput: checkSpaceName,
       onCancel: () => store.dispatch('hideModal'),
-      onConfirm: (spaceName) => confirmAction({ spaceName, space, resources })
+      onConfirm: (spaceName) =>
+        loadingService.addTask(() => confirmAction({ spaceName, space, resources }))
     }
 
     store.dispatch('createModal', modal)

From e635b586370cdedbb6fa40c9ea57d9e7f3e953f2 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 16:35:52 +0200
Subject: [PATCH 03/25] Refactor

---
 .../src/components/AppBar/CreateSpace.vue     | 69 +++-------------
 .../useFileActionsCreateSpaceFromResource.ts  | 80 +++----------------
 .../web-app-files/src/composables/index.ts    |  1 +
 .../src/composables/spaces/index.ts           |  1 +
 .../src/composables/spaces/useCreateSpace.ts  | 44 ++++++++++
 .../actions/spaces/useSpaceActionsRename.ts   | 26 +-----
 packages/web-pkg/src/composables/index.ts     |  2 +
 .../web-pkg/src/composables/spaces/index.ts   |  1 +
 .../src/composables/spaces/useSpaceHelpers.ts | 28 +++++++
 9 files changed, 100 insertions(+), 152 deletions(-)
 create mode 100644 packages/web-app-files/src/composables/spaces/index.ts
 create mode 100644 packages/web-app-files/src/composables/spaces/useCreateSpace.ts
 create mode 100644 packages/web-pkg/src/composables/spaces/index.ts
 create mode 100644 packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts

diff --git a/packages/web-app-files/src/components/AppBar/CreateSpace.vue b/packages/web-app-files/src/components/AppBar/CreateSpace.vue
index f017e4b1c60..12ebc79cdf7 100644
--- a/packages/web-app-files/src/components/AppBar/CreateSpace.vue
+++ b/packages/web-app-files/src/components/AppBar/CreateSpace.vue
@@ -15,18 +15,17 @@
 
 <script lang="ts">
 import { mapActions, mapMutations } from 'vuex'
-
 import { defineComponent } from 'vue'
-import { buildSpace } from 'web-client/src/helpers'
-import { configurationManager } from 'web-pkg/src/configuration'
-import { WebDAV } from 'web-client/src/webdav'
 import { useClientService } from 'web-pkg/src/composables'
-import { Drive } from 'web-client/src/generated'
+import { useCreateSpace } from 'web-app-files/src/composables'
+import { useSpaceHelpers } from 'web-pkg/src/composables/spaces'
 
 export default defineComponent({
   setup() {
     const clientService = useClientService()
-    return { clientService }
+    const { createSpace } = useCreateSpace()
+    const { checkSpaceNameModalInput } = useSpaceHelpers()
+    return { clientService, createSpace, checkSpaceNameModalInput }
   },
   methods: {
     ...mapActions(['showMessage', 'createModal', 'hideModal', 'setModalInputErrorMessage']),
@@ -44,68 +43,18 @@ export default defineComponent({
         inputValue: this.$gettext('New space'),
         onCancel: this.hideModal,
         onConfirm: this.addNewSpace,
-        onInput: this.checkSpaceName
+        onInput: this.checkSpaceNameModalInput
       }
 
       this.createModal(modal)
     },
 
-    checkSpaceName(name) {
-      if (name.trim() === '') {
-        return this.setModalInputErrorMessage(this.$gettext('Space name cannot be empty'))
-      }
-      if (name.length > 255) {
-        return this.setModalInputErrorMessage(
-          this.$gettext('Space name cannot exceed 255 characters')
-        )
-      }
-      if (/[/\\.:?*"><|]/.test(name)) {
-        return this.setModalInputErrorMessage(
-          this.$gettext('Space name cannot contain the following characters: / \\ . : ? * " > < |')
-        )
-      }
-      return this.setModalInputErrorMessage(null)
-    },
-
     async addNewSpace(name) {
       try {
-        const client = this.clientService.graphAuthenticated
-        const { data: space } = await client.drives.createDrive({ name }, {})
+        const createdSpace = await this.createSpace(name)
         this.hideModal()
-        const resource = buildSpace({ ...space, serverUrl: configurationManager.serverUrl })
-        this.UPSERT_RESOURCE(resource)
-        this.UPSERT_SPACE(resource)
-
-        await (this.$clientService.webdav as WebDAV).createFolder(resource, { path: '.space' })
-        const markdown = await (this.$clientService.webdav as WebDAV).putFileContents(resource, {
-          path: '.space/readme.md',
-          content: this.$gettext('Here you can add a description for this Space.')
-        })
-
-        const { data: updatedSpace } = await client.drives.updateDrive(
-          space.id,
-          {
-            special: [
-              {
-                specialFolder: {
-                  name: 'readme'
-                },
-                id: markdown.id as string
-              }
-            ]
-          } as Drive,
-          {}
-        )
-        this.UPDATE_RESOURCE_FIELD({
-          id: space.id,
-          field: 'spaceReadmeData',
-          value: updatedSpace.special.find((special) => special.specialFolder.name === 'readme')
-        })
-        this.UPDATE_RESOURCE_FIELD({
-          id: space.id,
-          field: 'spaceQuota',
-          value: updatedSpace.quota
-        })
+        this.UPSERT_RESOURCE(createdSpace)
+        this.UPSERT_SPACE(createdSpace)
       } catch (error) {
         console.error(error)
         this.showMessage({
diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 6afc3073c9e..550448bb0ae 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -2,69 +2,28 @@ import { Store } from 'vuex'
 import { computed, unref } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
-import {
-  configurationManager,
-  useAbility,
-  useClientService,
-  useLoadingService,
-  useRouter
-} from 'web-pkg'
-import { buildSpace, isPersonalSpaceResource } from 'web-client/src/helpers'
+import { useAbility, useLoadingService, useRouter } from 'web-pkg'
+import { isPersonalSpaceResource } from 'web-client/src/helpers'
 import { isLocationSpacesActive } from 'web-app-files/src/router'
-import { WebDAV } from 'web-client/src/webdav'
-import { Drive } from 'web-client/src/generated'
+import { useCreateSpace } from 'web-app-files/src/composables'
+import { useSpaceHelpers } from 'web-pkg/src/composables/spaces'
 
 export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store<any> } = {}) => {
   const { can } = useAbility()
   const { $gettext, $ngettext } = useGettext()
   const loadingService = useLoadingService()
+  const { createSpace } = useCreateSpace()
+  const { checkSpaceNameModalInput } = useSpaceHelpers()
   const router = useRouter()
-  const clientService = useClientService()
   const hasCreatePermission = computed(() => can('create-all', 'Space'))
 
   const confirmAction = async ({ spaceName, resources, space }) => {
     store.dispatch('hideModal')
-    const client = clientService.graphAuthenticated
+    store.dispatch('Files/SET_SELECTED_IDS', [])
 
     try {
-      const { data: createdSpace } = await client.drives.createDrive({ name: spaceName }, {})
-      const spaceResource = buildSpace({
-        ...createdSpace,
-        serverUrl: configurationManager.serverUrl
-      })
-      store.commit('runtime/spaces/UPSERT_SPACE', spaceResource)
-
-      await (clientService.webdav as WebDAV).createFolder(spaceResource, { path: '.space' })
-      const markdown = await (clientService.webdav as WebDAV).putFileContents(spaceResource, {
-        path: '.space/readme.md',
-        content: $gettext('Here you can add a description for this Space.')
-      })
-
-      const { data: updatedSpace } = await client.drives.updateDrive(
-        createdSpace.id,
-        {
-          special: [
-            {
-              specialFolder: {
-                name: 'readme'
-              },
-              id: markdown.id as string
-            }
-          ]
-        } as Drive,
-        {}
-      )
-      store.commit('runtime/spaces/UPDATE_SPACE_FIELD', {
-        id: createdSpace.id,
-        field: 'spaceReadmeData',
-        value: updatedSpace.special.find((special) => special.specialFolder.name === 'readme')
-      })
-      store.commit('runtime/spaces/UPDATE_SPACE_FIELD', {
-        id: createdSpace.id,
-        field: 'spaceQuota',
-        value: updatedSpace.quota
-      })
-
+      const createdSpace = createSpace(spaceName)
+      store.commit('runtime/spaces/UPSERT_SPACE', createdSpace)
       store.dispatch('showMessage', {
         title: $gettext('Space was created successfully')
       })
@@ -99,7 +58,7 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
       confirmText: $gettext('Create'),
       hasInput: true,
       inputLabel: $gettext('Space name'),
-      onInput: checkSpaceName,
+      onInput: checkSpaceNameModalInput,
       onCancel: () => store.dispatch('hideModal'),
       onConfirm: (spaceName) =>
         loadingService.addTask(() => confirmAction({ spaceName, space, resources }))
@@ -108,25 +67,6 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
     store.dispatch('createModal', modal)
   }
 
-  const checkSpaceName = (name) => {
-    if (name.trim() === '') {
-      return store.dispatch('setModalInputErrorMessage', $gettext('Space name cannot be empty'))
-    }
-    if (name.length > 255) {
-      return store.dispatch(
-        'setModalInputErrorMessage',
-        $gettext('Space name cannot exceed 255 characters')
-      )
-    }
-    if (/[/\\.:?*"><|]/.test(name)) {
-      return store.dispatch(
-        'setModalInputErrorMessage',
-        $gettext('Space name cannot contain the following characters: / \\\\ . : ? * " > < |\'')
-      )
-    }
-    store.dispatch('setModalInputErrorMessage', null)
-  }
-
   const actions = computed((): FileAction[] => {
     return [
       {
diff --git a/packages/web-app-files/src/composables/index.ts b/packages/web-app-files/src/composables/index.ts
index 62581ce9850..f9431bc1c7b 100644
--- a/packages/web-app-files/src/composables/index.ts
+++ b/packages/web-app-files/src/composables/index.ts
@@ -6,5 +6,6 @@ export * from './resourcesViewDefaults'
 export * from './router'
 export * from './selection'
 export * from './shares'
+export * from './spaces'
 export * from './sort'
 export * from './viewMode'
diff --git a/packages/web-app-files/src/composables/spaces/index.ts b/packages/web-app-files/src/composables/spaces/index.ts
new file mode 100644
index 00000000000..528501017a7
--- /dev/null
+++ b/packages/web-app-files/src/composables/spaces/index.ts
@@ -0,0 +1 @@
+export * from './useCreateSpace'
diff --git a/packages/web-app-files/src/composables/spaces/useCreateSpace.ts b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
new file mode 100644
index 00000000000..e05c7f3e15f
--- /dev/null
+++ b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
@@ -0,0 +1,44 @@
+import { buildSpace } from 'web-client/src/helpers'
+import { WebDAV } from 'web-client/src/webdav'
+import { Drive } from 'web-client/src/generated'
+import { useGettext } from 'vue3-gettext'
+import { useConfigurationManager, useClientService } from 'web-pkg/src/composables'
+
+export const useCreateSpace = () => {
+  const { graphAuthenticated, webdav } = useClientService()
+  const { $gettext } = useGettext()
+  const configurationManager = useConfigurationManager()
+
+  const createSpace = async (name: string) => {
+    const { data: createdSpace } = await graphAuthenticated.drives.createDrive({ name }, {})
+    const spaceResource = buildSpace({
+      ...createdSpace,
+      serverUrl: configurationManager.serverUrl
+    })
+
+    await webdav.createFolder(spaceResource, { path: '.space' })
+    const markdown = await (webdav as WebDAV).putFileContents(spaceResource, {
+      path: '.space/readme.md',
+      content: $gettext('Here you can add a description for this Space.')
+    })
+
+    const { data: updatedSpace } = await graphAuthenticated.drives.updateDrive(
+      createdSpace.id,
+      {
+        special: [
+          {
+            specialFolder: {
+              name: 'readme'
+            },
+            id: markdown.id as string
+          }
+        ]
+      } as Drive,
+      {}
+    )
+
+    return buildSpace({ ...updatedSpace, serverUrl: configurationManager.serverUrl })
+  }
+
+  return { createSpace }
+}
diff --git a/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts b/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
index e8d3296a20c..e7d95779e6b 100644
--- a/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
+++ b/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
@@ -1,7 +1,7 @@
 import { unref, computed } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { Store } from 'vuex'
-import { useClientService } from 'web-pkg/src/composables'
+import { useClientService, useSpaceHelpers } from 'web-pkg/src/composables'
 import { useAbility } from '../../ability'
 import { useRoute } from '../../router'
 import { useStore } from '../../store'
@@ -13,25 +13,7 @@ export const useSpaceActionsRename = ({ store }: { store?: Store<any> } = {}) =>
   const ability = useAbility()
   const clientService = useClientService()
   const route = useRoute()
-
-  const checkName = (name) => {
-    if (name.trim() === '') {
-      return store.dispatch('setModalInputErrorMessage', $gettext('Space name cannot be empty'))
-    }
-    if (name.length > 255) {
-      return store.dispatch(
-        'setModalInputErrorMessage',
-        $gettext('Space name cannot exceed 255 characters')
-      )
-    }
-    if (/[/\\.:?*"><|]/.test(name)) {
-      return store.dispatch(
-        'setModalInputErrorMessage',
-        $gettext('Space name cannot contain the following characters: / \\ . : ? * " > < |')
-      )
-    }
-    return store.dispatch('setModalInputErrorMessage', null)
-  }
+  const { checkSpaceNameModalInput } = useSpaceHelpers()
 
   const renameSpace = (space, name) => {
     const graphClient = clientService.graphAuthenticated
@@ -75,7 +57,7 @@ export const useSpaceActionsRename = ({ store }: { store?: Store<any> } = {}) =>
       inputValue: resources[0].name,
       onCancel: () => store.dispatch('hideModal'),
       onConfirm: (name) => renameSpace(resources[0], name),
-      onInput: checkName
+      onInput: checkSpaceNameModalInput
     }
 
     store.dispatch('createModal', modal)
@@ -105,7 +87,7 @@ export const useSpaceActionsRename = ({ store }: { store?: Store<any> } = {}) =>
     actions,
 
     // HACK: exported for unit tests:
-    checkName,
+    checkName: checkSpaceNameModalInput,
     renameSpace
   }
 }
diff --git a/packages/web-pkg/src/composables/index.ts b/packages/web-pkg/src/composables/index.ts
index b955812cc01..067de3cb64e 100644
--- a/packages/web-pkg/src/composables/index.ts
+++ b/packages/web-pkg/src/composables/index.ts
@@ -3,9 +3,11 @@ export * from './appDefaults'
 export * from './authContext'
 export * from './capability'
 export * from './clientService'
+export * from './configuration'
 export * from './driveResolver'
 export * from './loadingService'
 export * from './localStorage'
 export * from './router'
 export * from './previewService'
+export * from './spaces'
 export * from './store'
diff --git a/packages/web-pkg/src/composables/spaces/index.ts b/packages/web-pkg/src/composables/spaces/index.ts
new file mode 100644
index 00000000000..e2763a39db2
--- /dev/null
+++ b/packages/web-pkg/src/composables/spaces/index.ts
@@ -0,0 +1 @@
+export * from './useSpaceHelpers'
diff --git a/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts b/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts
new file mode 100644
index 00000000000..70991cd246e
--- /dev/null
+++ b/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts
@@ -0,0 +1,28 @@
+import { useStore } from 'web-pkg'
+import { useGettext } from 'vue3-gettext'
+
+export const useSpaceHelpers = () => {
+  const store = useStore()
+  const { $gettext } = useGettext()
+
+  const checkSpaceNameModalInput = (name) => {
+    if (name.trim() === '') {
+      return store.dispatch('setModalInputErrorMessage', $gettext('Space name cannot be empty'))
+    }
+    if (name.length > 255) {
+      return store.dispatch(
+        'setModalInputErrorMessage',
+        $gettext('Space name cannot exceed 255 characters')
+      )
+    }
+    if (/[/\\.:?*"><|]/.test(name)) {
+      return store.dispatch(
+        'setModalInputErrorMessage',
+        $gettext('Space name cannot contain the following characters: / \\\\ . : ? * " > < |\'')
+      )
+    }
+    store.dispatch('setModalInputErrorMessage', null)
+  }
+
+  return { checkSpaceNameModalInput }
+}

From ee73c8555727f3438501d0f65971cbf6839fd74f Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 16:42:02 +0200
Subject: [PATCH 04/25] Refactor

---
 .../src/composables/appDefaults/useAppFolderHandling.ts        | 3 ++-
 packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts     | 2 +-
 packages/web-pkg/src/index.ts                                  | 1 -
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts b/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
index 407d63ac75d..da2f63411b0 100644
--- a/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
+++ b/packages/web-pkg/src/composables/appDefaults/useAppFolderHandling.ts
@@ -1,7 +1,8 @@
 import { Store } from 'vuex'
 import { computed, Ref, ref, unref } from 'vue'
 import { dirname } from 'path'
-import { ClientService, MaybeRef, useAppFileHandling } from 'web-pkg'
+import { ClientService, MaybeRef } from 'web-pkg'
+import { useAppFileHandling } from 'web-pkg/src/composables'
 import { Resource } from 'web-client'
 import { FileContext } from './types'
 import { RouteLocationNormalizedLoaded } from 'vue-router'
diff --git a/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts b/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts
index 70991cd246e..79fee404932 100644
--- a/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts
+++ b/packages/web-pkg/src/composables/spaces/useSpaceHelpers.ts
@@ -1,4 +1,4 @@
-import { useStore } from 'web-pkg'
+import { useStore } from 'web-pkg/src/composables'
 import { useGettext } from 'vue3-gettext'
 
 export const useSpaceHelpers = () => {
diff --git a/packages/web-pkg/src/index.ts b/packages/web-pkg/src/index.ts
index 4d221aa3937..b8bce16f604 100644
--- a/packages/web-pkg/src/index.ts
+++ b/packages/web-pkg/src/index.ts
@@ -1,4 +1,3 @@
-export * from './composables'
 export * from './configuration'
 export * from './helpers'
 export * from './http'

From f1fc622e8388c50626be18f3a55c9b1e4789bcba Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 16:47:47 +0200
Subject: [PATCH 05/25] Refactor

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts      | 2 +-
 packages/web-pkg/src/index.ts                                   | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 550448bb0ae..ab2b6488cad 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -2,7 +2,7 @@ import { Store } from 'vuex'
 import { computed, unref } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
-import { useAbility, useLoadingService, useRouter } from 'web-pkg'
+import { useAbility, useLoadingService, useRouter } from 'web-pkg/src/composables'
 import { isPersonalSpaceResource } from 'web-client/src/helpers'
 import { isLocationSpacesActive } from 'web-app-files/src/router'
 import { useCreateSpace } from 'web-app-files/src/composables'
diff --git a/packages/web-pkg/src/index.ts b/packages/web-pkg/src/index.ts
index b8bce16f604..4d221aa3937 100644
--- a/packages/web-pkg/src/index.ts
+++ b/packages/web-pkg/src/index.ts
@@ -1,3 +1,4 @@
+export * from './composables'
 export * from './configuration'
 export * from './helpers'
 export * from './http'

From c569bd26390a8a90b62f9996b1752c8f7dd3c14e Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 17:09:42 +0200
Subject: [PATCH 06/25] Implement copy

---
 .../useFileActionsCreateSpaceFromResource.ts    | 17 ++++++++++++++---
 1 file changed, 14 insertions(+), 3 deletions(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index ab2b6488cad..ae583f7637b 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -2,11 +2,12 @@ import { Store } from 'vuex'
 import { computed, unref } from 'vue'
 import { useGettext } from 'vue3-gettext'
 import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
-import { useAbility, useLoadingService, useRouter } from 'web-pkg/src/composables'
+import { useAbility, useClientService, useLoadingService, useRouter } from 'web-pkg/src/composables'
 import { isPersonalSpaceResource } from 'web-client/src/helpers'
 import { isLocationSpacesActive } from 'web-app-files/src/router'
 import { useCreateSpace } from 'web-app-files/src/composables'
 import { useSpaceHelpers } from 'web-pkg/src/composables/spaces'
+import PQueue from 'p-queue'
 
 export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store<any> } = {}) => {
   const { can } = useAbility()
@@ -14,19 +15,29 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
   const loadingService = useLoadingService()
   const { createSpace } = useCreateSpace()
   const { checkSpaceNameModalInput } = useSpaceHelpers()
+  const { webdav } = useClientService()
   const router = useRouter()
   const hasCreatePermission = computed(() => can('create-all', 'Space'))
 
   const confirmAction = async ({ spaceName, resources, space }) => {
     store.dispatch('hideModal')
-    store.dispatch('Files/SET_SELECTED_IDS', [])
+    const queue = new PQueue({ concurrency: 4 })
+    const copyOps = []
 
     try {
-      const createdSpace = createSpace(spaceName)
+      const createdSpace = await createSpace(spaceName)
       store.commit('runtime/spaces/UPSERT_SPACE', createdSpace)
       store.dispatch('showMessage', {
         title: $gettext('Space was created successfully')
       })
+
+      for (const resource of resources) {
+        copyOps.push(
+          queue.add(() => webdav.copyFiles(space, resource, createdSpace, { path: resource.name }))
+        )
+      }
+
+      await Promise.all(copyOps)
     } catch (error) {
       console.error(error)
       store.dispatch('showMessage', {

From ef57e1466a1e643d13c5ea7af64c0784c2f2ebcf Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 17:13:58 +0200
Subject: [PATCH 07/25] Implement copy

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts    | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index ae583f7637b..92e61982370 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -31,6 +31,10 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
         title: $gettext('Space was created successfully')
       })
 
+      if (resources.length === 1 && resources[0].isFolder()) {
+        //TODO: FOR LATER
+      }
+
       for (const resource of resources) {
         copyOps.push(
           queue.add(() => webdav.copyFiles(space, resource, createdSpace, { path: resource.name }))

From f6d6ab7d3a64ad93b792259704dfbd592f0979e8 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Tue, 28 Mar 2023 23:59:30 +0200
Subject: [PATCH 08/25] Implement edge case

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts   | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 92e61982370..2867ff02704 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -31,8 +31,9 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
         title: $gettext('Space was created successfully')
       })
 
-      if (resources.length === 1 && resources[0].isFolder()) {
-        //TODO: FOR LATER
+      if (resources.length === 1 && resources[0].isFolder) {
+        //If a single folder is selected we copy it's content to the Space's root folder
+        resources = (await webdav.listFiles(space, { path: resources[0].path })).children
       }
 
       for (const resource of resources) {

From 8d103e4cdc23f19d7bc45e64c2c62e6072822599 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 00:01:01 +0200
Subject: [PATCH 09/25] Lint

---
 .../web-app-files/src/components/FilesList/ContextActions.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/web-app-files/src/components/FilesList/ContextActions.vue b/packages/web-app-files/src/components/FilesList/ContextActions.vue
index ac05666ded5..0e72e1ac978 100644
--- a/packages/web-app-files/src/components/FilesList/ContextActions.vue
+++ b/packages/web-app-files/src/components/FilesList/ContextActions.vue
@@ -67,7 +67,9 @@ export default defineComponent({
     const { actions: setSpaceReadmeActions } = useFileActionsSetReadme({ store })
     const { actions: showDetailsActions } = useFileActionsShowDetails({ store })
     const { actions: showEditTagsActions } = useFileActionsShowEditTags({ store })
-    const { actions: createSpaceFromResourceActions } = useFileActionsCreateSpaceFromResource({ store })
+    const { actions: createSpaceFromResourceActions } = useFileActionsCreateSpaceFromResource({
+      store
+    })
     const { actions: showSharesActions } = useFileActionsShowShares({ store })
 
     // type cast to make vue-tsc aware of the type

From 9dc692b5512ae10cd335ee356ed03eef404ac2e0 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 00:50:32 +0200
Subject: [PATCH 10/25] Update snapshots

---
 .../components/OcModal/__snapshots__/OcModal.spec.ts.snap  | 7 +++++--
 .../tests/unit/composables/spaces/useSpaceHelpers.spec.ts  | 7 +++++++
 2 files changed, 12 insertions(+), 2 deletions(-)
 create mode 100644 packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts

diff --git a/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap b/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
index bdd289a4bcb..4aecc9b8593 100644
--- a/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
+++ b/packages/design-system/src/components/OcModal/__snapshots__/OcModal.spec.ts.snap
@@ -9,6 +9,7 @@ exports[`OcModal displays input 1`] = `
         <h2 id="oc-modal-title">Create new folder</h2>
       </div>
       <div class="oc-modal-body">
+        <!--v-if-->
         <oc-text-input-stub class="oc-modal-body-input" clearbuttonaccessiblelabel="" clearbuttonenabled="false" disabled="false" fixmessageline="true" id="oc-textinput-1" label="Folder name" modelvalue="New folder" type="text"></oc-text-input-stub>
         <!--v-if-->
         <!--v-if-->
@@ -32,7 +33,8 @@ exports[`OcModal hides icon if not specified 1`] = `
         <h2 id="oc-modal-title">Example title</h2>
       </div>
       <div class="oc-modal-body">
-        <p class="oc-modal-body-message oc-m-rm">Example message</p>
+        <p class="oc-modal-body-message oc-mt-rm oc-mb-rm">Example message</p>
+        <!--v-if-->
         <!--v-if-->
         <!--v-if-->
       </div>
@@ -55,7 +57,8 @@ exports[`OcModal matches snapshot 1`] = `
         <h2 id="oc-modal-title">Example title</h2>
       </div>
       <div class="oc-modal-body">
-        <p class="oc-modal-body-message oc-m-rm">Example message</p>
+        <p class="oc-modal-body-message oc-mt-rm oc-mb-rm">Example message</p>
+        <!--v-if-->
         <!--v-if-->
         <!--v-if-->
       </div>
diff --git a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
new file mode 100644
index 00000000000..03454f07a86
--- /dev/null
+++ b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
@@ -0,0 +1,7 @@
+import { useSpaceHelpers } from 'web-pkg/src/composables'
+
+describe('useCapability', () => {
+  it('should be valid', () => {
+    expect(useSpaceHelpers).toBeDefined()
+  })
+})

From c147a9a7213526ef26832dff67398a1692e022ed Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:16:15 +0200
Subject: [PATCH 11/25] Add missing .

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts    | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 2867ff02704..5bcb830e3ab 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -63,8 +63,8 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
         }
       ),
       message: $ngettext(
-        'Create Space with the content of "%{resourceName}". The content will be copied',
-        'Create Space with the selected files. The content will be copied',
+        'Create Space with the content of "%{resourceName}". The content will be copied.',
+        'Create Space with the selected files. The content will be copied.',
         resources.length,
         {
           resourceName: resources[0].name

From 45017432678d7bd577d4538168808f5a7cc47ed8 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:21:26 +0200
Subject: [PATCH 12/25] Reset file selection after space creation is done

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts       | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 5bcb830e3ab..a8a7c4efd2e 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -43,6 +43,7 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
       }
 
       await Promise.all(copyOps)
+      store.dispatch('Files/resetFileSelection')
     } catch (error) {
       console.error(error)
       store.dispatch('showMessage', {

From ffa0b70bee8a1c9870620f0a7ec7afd50f07434e Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:30:44 +0200
Subject: [PATCH 13/25] Fix unit tests

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts      | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index a8a7c4efd2e..58a89df06c3 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -5,7 +5,7 @@ import { FileAction, FileActionOptions } from 'web-pkg/src/composables/actions'
 import { useAbility, useClientService, useLoadingService, useRouter } from 'web-pkg/src/composables'
 import { isPersonalSpaceResource } from 'web-client/src/helpers'
 import { isLocationSpacesActive } from 'web-app-files/src/router'
-import { useCreateSpace } from 'web-app-files/src/composables'
+import { useCreateSpace } from 'web-app-files/src/composables/spaces'
 import { useSpaceHelpers } from 'web-pkg/src/composables/spaces'
 import PQueue from 'p-queue'
 

From e519cde28ca1c0d97a18354e097d45892f3b5b3b Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:37:50 +0200
Subject: [PATCH 14/25] Add changelog item

---
 .../unreleased/enhancement-create-space-from-selection    | 8 ++++++++
 1 file changed, 8 insertions(+)
 create mode 100644 changelog/unreleased/enhancement-create-space-from-selection

diff --git a/changelog/unreleased/enhancement-create-space-from-selection b/changelog/unreleased/enhancement-create-space-from-selection
new file mode 100644
index 00000000000..580077da766
--- /dev/null
+++ b/changelog/unreleased/enhancement-create-space-from-selection
@@ -0,0 +1,8 @@
+Enhancement: Create Space from selection
+
+We've added a new action 'Create Space from selection' to the users
+personal home so they can create a Space with the copied content of their
+selected files and folders.
+
+https://github.com/owncloud/web/pull/8730
+https://github.com/owncloud/web/issues/8735

From f97120e8d4ef33bc89b9d985a4260017f18aa710 Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:46:14 +0200
Subject: [PATCH 15/25] fix unit test

---
 .../components/AppBar/CreateSpace.spec.ts     | 30 -------------------
 1 file changed, 30 deletions(-)

diff --git a/packages/web-app-files/tests/unit/components/AppBar/CreateSpace.spec.ts b/packages/web-app-files/tests/unit/components/AppBar/CreateSpace.spec.ts
index b41b30dd38d..ae70206ed54 100644
--- a/packages/web-app-files/tests/unit/components/AppBar/CreateSpace.spec.ts
+++ b/packages/web-app-files/tests/unit/components/AppBar/CreateSpace.spec.ts
@@ -25,35 +25,6 @@ describe('CreateSpace component', () => {
     await wrapper.find(selectors.newSpaceBtn).trigger('click')
     expect(storeOptions.actions.createModal).toHaveBeenCalledTimes(1)
   })
-  describe('method "checkSpaceName"', () => {
-    it('should not show an error message with a valid space name', () => {
-      const { wrapper } = getWrapper()
-      const spyInputErrorMessageStub = jest.spyOn(wrapper.vm, 'setModalInputErrorMessage')
-      wrapper.vm.checkSpaceName('Space')
-      expect(spyInputErrorMessageStub).toHaveBeenCalledWith(null)
-    })
-    it('should show an error message with an empty name', () => {
-      const { wrapper } = getWrapper()
-      const spyInputErrorMessageStub = jest.spyOn(wrapper.vm, 'setModalInputErrorMessage')
-      wrapper.vm.checkSpaceName('')
-      expect(spyInputErrorMessageStub).not.toHaveBeenCalledWith(null)
-    })
-    it('should show an error with an name longer than 255 characters', () => {
-      const { wrapper } = getWrapper()
-      const spyInputErrorMessageStub = jest.spyOn(wrapper.vm, 'setModalInputErrorMessage')
-      wrapper.vm.checkSpaceName('n'.repeat(256))
-      expect(spyInputErrorMessageStub).not.toHaveBeenCalledWith(null)
-    })
-    it.each(['/', '\\', '.', ':', '?', '*', '"', '>', '<', '|'])(
-      'should show an error message with a name including a special character',
-      (specialChar) => {
-        const { wrapper } = getWrapper()
-        const spyInputErrorMessageStub = jest.spyOn(wrapper.vm, 'setModalInputErrorMessage')
-        wrapper.vm.checkSpaceName(specialChar)
-        expect(spyInputErrorMessageStub).not.toHaveBeenCalledWith(null)
-      }
-    )
-  })
   describe('method "addNewSpace"', () => {
     it('creates the space and updates the readme data after creation', async () => {
       const { wrapper, mocks, storeOptions } = getWrapper()
@@ -64,7 +35,6 @@ describe('CreateSpace component', () => {
       mocks.$clientService.webdav.putFileContents.mockResolvedValue(mockDeep<Resource>())
       await wrapper.vm.addNewSpace('New space')
       expect(storeOptions.modules.runtime.modules.spaces.mutations.UPSERT_SPACE).toHaveBeenCalled()
-      expect(storeOptions.modules.Files.mutations.UPDATE_RESOURCE_FIELD).toHaveBeenCalled()
     })
     it('shows a message when an error occurred', async () => {
       jest.spyOn(console, 'error').mockImplementation(() => undefined)

From 64623dad4cd92875e466ed0605aa7613b1566e9e Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 01:48:42 +0200
Subject: [PATCH 16/25] fix unit test

---
 .../actions/spaces/useSpaceActionsRename.ts   |  1 -
 .../spaces/useSpaceActionsRename.spec.ts      | 34 -------------------
 2 files changed, 35 deletions(-)

diff --git a/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts b/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
index e7d95779e6b..f68109dab09 100644
--- a/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
+++ b/packages/web-pkg/src/composables/actions/spaces/useSpaceActionsRename.ts
@@ -87,7 +87,6 @@ export const useSpaceActionsRename = ({ store }: { store?: Store<any> } = {}) =>
     actions,
 
     // HACK: exported for unit tests:
-    checkName: checkSpaceNameModalInput,
     renameSpace
   }
 }
diff --git a/packages/web-pkg/tests/unit/composables/actions/spaces/useSpaceActionsRename.spec.ts b/packages/web-pkg/tests/unit/composables/actions/spaces/useSpaceActionsRename.spec.ts
index f1ceed8f8af..24dbbb4f7d4 100644
--- a/packages/web-pkg/tests/unit/composables/actions/spaces/useSpaceActionsRename.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/actions/spaces/useSpaceActionsRename.spec.ts
@@ -34,40 +34,6 @@ describe('rename', () => {
       })
     })
   })
-
-  describe('method "checkName"', () => {
-    it('should throw an error with an empty space name', async () => {
-      const { wrapper } = getWrapper({
-        setup: async ({ checkName }, { storeOptions }) => {
-          await checkName('')
-
-          expect(storeOptions.actions.setModalInputErrorMessage).toHaveBeenCalledTimes(1)
-        }
-      })
-    })
-    it('should throw an error with an space name longer than 255 characters', async () => {
-      const { wrapper } = getWrapper({
-        setup: async ({ checkName }, { storeOptions }) => {
-          await checkName('n'.repeat(256))
-
-          expect(storeOptions.actions.setModalInputErrorMessage).toHaveBeenCalledTimes(1)
-        }
-      })
-    })
-    it.each(['/', '\\', '.', ':', '?', '*', '"', '>', '<', '|'])(
-      'should show an error message when trying to create a space with a special character',
-      (specialChar) => {
-        const { wrapper } = getWrapper({
-          setup: async ({ checkName }, { storeOptions }) => {
-            checkName(specialChar)
-
-            expect(storeOptions.actions.setModalInputErrorMessage).toHaveBeenCalledTimes(1)
-          }
-        })
-      }
-    )
-  })
-
   describe('method "renameSpace"', () => {
     it('should hide the modal and show message on success', async () => {
       const { wrapper, mocks } = getWrapper({

From 05aa0a59d8bf42d973051164e385b3bc448cb07f Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 02:00:32 +0200
Subject: [PATCH 17/25] Fix order

---
 .../actions/files/useFileActionsCreateSpaceFromResource.ts  | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
index 58a89df06c3..41e4fdfad33 100644
--- a/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
+++ b/packages/web-app-files/src/composables/actions/files/useFileActionsCreateSpaceFromResource.ts
@@ -27,9 +27,6 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
     try {
       const createdSpace = await createSpace(spaceName)
       store.commit('runtime/spaces/UPSERT_SPACE', createdSpace)
-      store.dispatch('showMessage', {
-        title: $gettext('Space was created successfully')
-      })
 
       if (resources.length === 1 && resources[0].isFolder) {
         //If a single folder is selected we copy it's content to the Space's root folder
@@ -44,6 +41,9 @@ export const useFileActionsCreateSpaceFromResource = ({ store }: { store?: Store
 
       await Promise.all(copyOps)
       store.dispatch('Files/resetFileSelection')
+      store.dispatch('showMessage', {
+        title: $gettext('Space was created successfully')
+      })
     } catch (error) {
       console.error(error)
       store.dispatch('showMessage', {

From 00d26802d27fc7acd2d887c42cf596f515ec3b4d Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 02:02:30 +0200
Subject: [PATCH 18/25] Fix code smell

---
 packages/web-app-files/src/composables/spaces/useCreateSpace.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/web-app-files/src/composables/spaces/useCreateSpace.ts b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
index e05c7f3e15f..8175a7bba2e 100644
--- a/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
+++ b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
@@ -17,7 +17,7 @@ export const useCreateSpace = () => {
     })
 
     await webdav.createFolder(spaceResource, { path: '.space' })
-    const markdown = await (webdav as WebDAV).putFileContents(spaceResource, {
+    const markdown = await webdav.putFileContents(spaceResource, {
       path: '.space/readme.md',
       content: $gettext('Here you can add a description for this Space.')
     })

From 161fd32bef16beeb622ad7537e56a36a6c5a68e2 Mon Sep 17 00:00:00 2001
From: Paul Neubauer <paulneubauer@live.de>
Date: Wed, 29 Mar 2023 15:07:45 +0200
Subject: [PATCH 19/25] Implement create space from folder e2e test

---
 .../src/composables/spaces/useCreateSpace.ts  |  1 -
 pnpm-lock.yaml                                | 11 +-------
 .../smoke/createSpaceShortcut.ocis.feature    | 27 +++++++++++++++++++
 tests/e2e/cucumber/steps/ui/resources.ts      |  9 +++++++
 tests/e2e/cucumber/steps/ui/spaces.ts         | 10 +++++++
 .../objects/app-files/resource/actions.ts     | 21 +++++++++++++++
 .../objects/app-files/resource/index.ts       |  8 +++++-
 .../objects/app-files/spaces/actions.ts       |  4 +++
 .../support/objects/app-files/spaces/index.ts |  7 ++++-
 9 files changed, 85 insertions(+), 13 deletions(-)
 create mode 100644 tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature

diff --git a/packages/web-app-files/src/composables/spaces/useCreateSpace.ts b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
index 8175a7bba2e..ad518363e51 100644
--- a/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
+++ b/packages/web-app-files/src/composables/spaces/useCreateSpace.ts
@@ -1,5 +1,4 @@
 import { buildSpace } from 'web-client/src/helpers'
-import { WebDAV } from 'web-client/src/webdav'
 import { Drive } from 'web-client/src/generated'
 import { useGettext } from 'vue3-gettext'
 import { useConfigurationManager, useClientService } from 'web-pkg/src/composables'
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index f904be85806..36481ca9f66 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -8313,7 +8313,7 @@ packages:
       minipass-pipeline: 1.2.4
       mkdirp: 1.0.4
       p-map: 4.0.0
-      promise-inflight: 1.0.1
+      promise-inflight: 1.0.1_bluebird@3.7.2
       rimraf: 3.0.2
       ssri: 8.0.1
       tar: 6.1.13
@@ -17719,15 +17719,6 @@ packages:
     engines: {node: '>=0.4.0'}
     dev: true
 
-  /promise-inflight/1.0.1:
-    resolution: {integrity: sha512-6zWPyEOFaQBJYcGMHBKTKJ3u6TBsnMFOIZSa6ce1e/ZrrsOlnHRHbabMjLiBYKp+n44X9eUI6VUPaukCXHuG4g==}
-    peerDependencies:
-      bluebird: '*'
-    peerDependenciesMeta:
-      bluebird:
-        optional: true
-    dev: true
-
   /promise-inflight/1.0.1_bluebird@3.7.2:
     resolution: {integrity: sha512-6zWPyEOFaQBJYcGMHBKTKJ3u6TBsnMFOIZSa6ce1e/ZrrsOlnHRHbabMjLiBYKp+n44X9eUI6VUPaukCXHuG4g==}
     peerDependencies:
diff --git a/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature b/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
new file mode 100644
index 00000000000..9247df973f6
--- /dev/null
+++ b/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
@@ -0,0 +1,27 @@
+#oc-files-actions-create-space-from-resource-trigger
+Feature: create space shortcut
+
+  Scenario: create space from folder
+    Given "Admin" creates following users using API
+      | id    |
+      | Alice |
+    And "Admin" creates the following folder in personal space using API
+      | name        |
+      | spaceFolder |
+    When "Admin" logs in
+    And "Admin" navigates to the personal space page
+    And "Admin" creates the following resources
+      | resource                                  | type   |
+      | spaceFolder/Kindergarten Koalas/meal plan | folder |
+    And "Admin" uploads the following resources
+      | resource          | to           |
+      | data.zip          | spaceFolder  |
+      | lorem.txt         | spaceFolder  |
+    And "Admin" navigates to the personal space page
+    And "Admin" creates space "folderSpace" from folder "spaceFolder" using the context menu
+    And "Admin" navigates to the projects space page
+    And "Admin" navigates to the first project space named "folderSpace"
+    And "Admin" downloads the following resources using the sidebar panel
+      | resource            | from  | type   |
+      | data.zip            |       | file   |
+      | lorem.txt           |       | file   |
diff --git a/tests/e2e/cucumber/steps/ui/resources.ts b/tests/e2e/cucumber/steps/ui/resources.ts
index 4c622740b23..afe84834379 100644
--- a/tests/e2e/cucumber/steps/ui/resources.ts
+++ b/tests/e2e/cucumber/steps/ui/resources.ts
@@ -480,3 +480,12 @@ When(
     }
   }
 )
+
+When(
+  '{string} creates space {string} from folder {string} using the context menu',
+  async function (this: World, stepUser: string, spaceName: string, folderName: string) {
+    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
+    const resourceObject = new objects.applicationFiles.Resource({ page })
+    await resourceObject.createSpaceFromFolder({ folderName: folderName, spaceName: spaceName })
+  }
+)
diff --git a/tests/e2e/cucumber/steps/ui/spaces.ts b/tests/e2e/cucumber/steps/ui/spaces.ts
index 7af54868cdd..0f1d8084418 100644
--- a/tests/e2e/cucumber/steps/ui/spaces.ts
+++ b/tests/e2e/cucumber/steps/ui/spaces.ts
@@ -43,6 +43,16 @@ When(
   }
 )
 
+When(
+  '{string} navigates to the first project space named {string}',
+  async function (this: World, stepUser: string, name: string): Promise<void> {
+    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
+    const spacesObject = new objects.applicationFiles.Spaces({ page })
+
+    await spacesObject.openNamed({ name })
+  }
+)
+
 When(
   /^"([^"]*)" (changes|updates) the space "([^"]*)" (name|subtitle|description|quota|image) to "([^"]*)"$/,
   async function (
diff --git a/tests/e2e/support/objects/app-files/resource/actions.ts b/tests/e2e/support/objects/app-files/resource/actions.ts
index bb88dc67275..348d8eed32d 100644
--- a/tests/e2e/support/objects/app-files/resource/actions.ts
+++ b/tests/e2e/support/objects/app-files/resource/actions.ts
@@ -97,6 +97,21 @@ export interface createResourceArgs {
   content?: string
 }
 
+export const createSpaceFromFolder = async ({
+  page,
+  folderName,
+  spaceName
+}: {
+  page: Page
+  folderName: string
+  spaceName: string
+}): Promise<void> => {
+  await page.locator(util.format(resourceNameSelector, folderName)).click({ button: 'right' })
+  await page.locator('text=Create Space from selection').first().click()
+  await page.locator('.oc-text-input').first().fill(spaceName)
+  await page.locator(util.format(actionConfirmationButton, 'Create')).click()
+}
+
 export const createNewFolder = async ({
   page,
   resource
@@ -665,6 +680,12 @@ export interface clickTagArgs {
   page: Page
 }
 
+export interface createSpaceFromFolderArgs {
+  folderName: string
+  spaceName: string
+  page: Page
+}
+
 export const restoreResourceTrashbin = async (
   args: restoreResourceTrashbinArgs
 ): Promise<string> => {
diff --git a/tests/e2e/support/objects/app-files/resource/index.ts b/tests/e2e/support/objects/app-files/resource/index.ts
index d08ffe26764..f3b14e9ad61 100644
--- a/tests/e2e/support/objects/app-files/resource/index.ts
+++ b/tests/e2e/support/objects/app-files/resource/index.ts
@@ -43,7 +43,9 @@ import {
   getDisplayedResourcesFromFilesList,
   resourceTagsArgs,
   clickViewModeToggle,
-  expectThatResourcesAreTiles
+  expectThatResourcesAreTiles,
+  createSpaceFromFolder,
+  createSpaceFromFolderArgs
 } from './actions'
 
 export class Resource {
@@ -224,4 +226,8 @@ export class Resource {
   async clickTag(args: Omit<clickTagArgs, 'page'>): Promise<void> {
     return await clickResourceTag({ ...args, page: this.#page })
   }
+
+  async createSpaceFromFolder(args: Omit<createSpaceFromFolderArgs, 'page'>): Promise<void> {
+    return await createSpaceFromFolder({ ...args, page: this.#page })
+  }
 }
diff --git a/tests/e2e/support/objects/app-files/spaces/actions.ts b/tests/e2e/support/objects/app-files/spaces/actions.ts
index b0af82378ea..80e72e7c176 100644
--- a/tests/e2e/support/objects/app-files/spaces/actions.ts
+++ b/tests/e2e/support/objects/app-files/spaces/actions.ts
@@ -88,6 +88,10 @@ export const openSpace = async (args: openSpaceArgs): Promise<void> => {
   await page.locator(util.format(spaceIdSelector, id)).click()
 }
 
+export const openSpaceNamed = async (args: { name: string; page: Page }): Promise<void> => {
+  const { page, name } = args
+  await page.locator(`text=${name}`).click()
+}
 /**/
 
 export const changeSpaceName = async (args: {
diff --git a/tests/e2e/support/objects/app-files/spaces/index.ts b/tests/e2e/support/objects/app-files/spaces/index.ts
index 272ae072a43..4bb2d95cc79 100644
--- a/tests/e2e/support/objects/app-files/spaces/index.ts
+++ b/tests/e2e/support/objects/app-files/spaces/index.ts
@@ -20,7 +20,8 @@ import {
   changeSpaceRole,
   createPublicLinkForSpace,
   addExpirationDateToMember,
-  removeExpirationDateFromMember
+  removeExpirationDateFromMember,
+  openSpaceNamed
 } from './actions'
 import { spaceWithSpaceIDNotExist } from './utils'
 import { ICollaborator } from '../share/collaborator'
@@ -52,6 +53,10 @@ export class Spaces {
     await openSpace({ page: this.#page, id })
   }
 
+  async openNamed({ name }: { name: string }): Promise<void> {
+    await openSpaceNamed({ page: this.#page, name })
+  }
+
   async changeName({ key, value }: { key: string; value: string }): Promise<void> {
     const { id } = this.#spacesEnvironment.getSpace({ key })
     await changeSpaceName({ id, value, page: this.#page })

From de56192c87622a554f0bc0e9aa012e4ae8572506 Mon Sep 17 00:00:00 2001
From: Paul Neubauer <paulneubauer@live.de>
Date: Wed, 29 Mar 2023 17:41:53 +0200
Subject: [PATCH 20/25] Implement second e2e test

---
 .../smoke/createSpaceShortcut.ocis.feature    | 58 ++++++++++++++-----
 tests/e2e/cucumber/steps/ui/resources.ts      | 23 +++++++-
 tests/e2e/cucumber/steps/ui/spaces.ts         | 10 ----
 tests/e2e/support/environment/space.ts        |  1 +
 .../objects/app-files/resource/actions.ts     | 47 ++++++++++++++-
 .../objects/app-files/resource/index.ts       | 13 ++++-
 .../objects/app-files/spaces/actions.ts       |  5 --
 .../support/objects/app-files/spaces/index.ts |  7 +--
 8 files changed, 122 insertions(+), 42 deletions(-)

diff --git a/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature b/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
index 9247df973f6..16a1ebceb35 100644
--- a/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
+++ b/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
@@ -5,23 +5,53 @@ Feature: create space shortcut
     Given "Admin" creates following users using API
       | id    |
       | Alice |
-    And "Admin" creates the following folder in personal space using API
-      | name        |
-      | spaceFolder |
-    When "Admin" logs in
-    And "Admin" navigates to the personal space page
-    And "Admin" creates the following resources
-      | resource                                  | type   |
-      | spaceFolder/Kindergarten Koalas/meal plan | folder |
-    And "Admin" uploads the following resources
+    And "Admin" assigns following roles to the users using API
+      | id    | role        |
+      | Alice | Space Admin |
+    And "Alice" creates the following folder in personal space using API
+      | name             |
+      | spaceFolder      |
+      | spaceFolder/test |
+    When "Alice" logs in
+    And "Alice" navigates to the personal space page
+    And "Alice" uploads the following resources
       | resource          | to           |
       | data.zip          | spaceFolder  |
       | lorem.txt         | spaceFolder  |
-    And "Admin" navigates to the personal space page
-    And "Admin" creates space "folderSpace" from folder "spaceFolder" using the context menu
-    And "Admin" navigates to the projects space page
-    And "Admin" navigates to the first project space named "folderSpace"
-    And "Admin" downloads the following resources using the sidebar panel
+    And "Alice" navigates to the personal space page
+    And "Alice" creates space "folderSpace" from folder "spaceFolder" using the context menu
+    And "Alice" navigates to the projects space page
+    And "Alice" navigates to the project space "folderSpace"
+    And "Alice" downloads the following resources using the sidebar panel
       | resource            | from  | type   |
       | data.zip            |       | file   |
       | lorem.txt           |       | file   |
+    And "Alice" logs out
+
+  Scenario: create space from resources
+    Given "Admin" creates following users using API
+      | id    |
+      | Alice |
+    And "Admin" assigns following roles to the users using API
+      | id    | role        |
+      | Alice | Space Admin |
+    And "Alice" creates the following folder in personal space using API
+      | name             |
+      | resourceFolder   |
+    When "Alice" logs in
+    And "Alice" navigates to the personal space page
+    And "Alice" uploads the following resources
+      | resource          | to             |
+      | data.zip          | resourceFolder |
+      | lorem.txt         |                |
+    And "Alice" navigates to the personal space page
+    And "Alice" creates space "resourceSpace" from resources using the context menu
+      | resource                |
+      | resourceFolder          |
+      | lorem.txt               |
+    And "Alice" navigates to the projects space page
+    And "Alice" navigates to the project space "resourceSpace"
+    And "Alice" downloads the following resources using the sidebar panel
+      | resource            | from  | type   |
+      | resourceFolder      |       | folder |
+      | lorem.txt           |       | file   |
diff --git a/tests/e2e/cucumber/steps/ui/resources.ts b/tests/e2e/cucumber/steps/ui/resources.ts
index afe84834379..eab4dae882e 100644
--- a/tests/e2e/cucumber/steps/ui/resources.ts
+++ b/tests/e2e/cucumber/steps/ui/resources.ts
@@ -486,6 +486,27 @@ When(
   async function (this: World, stepUser: string, spaceName: string, folderName: string) {
     const { page } = this.actorsEnvironment.getActor({ key: stepUser })
     const resourceObject = new objects.applicationFiles.Resource({ page })
-    await resourceObject.createSpaceFromFolder({ folderName: folderName, spaceName: spaceName })
+    const space = await resourceObject.createSpaceFromFolder({
+      folderName: folderName,
+      spaceName: spaceName
+    })
+    this.spacesEnvironment.createSpace({
+      key: space.name,
+      space: { name: space.name, id: space.id }
+    })
+  }
+)
+
+When(
+  '{string} creates space {string} from resources using the context menu',
+  async function (this: World, stepUser: string, spaceName: string, stepTable: DataTable) {
+    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
+    const resourceObject = new objects.applicationFiles.Resource({ page })
+    const resources = stepTable.hashes().map((item) => item.resource)
+    const space = await resourceObject.createSpaceFromSelection({ resources, spaceName })
+    this.spacesEnvironment.createSpace({
+      key: space.name,
+      space: { name: space.name, id: space.id }
+    })
   }
 )
diff --git a/tests/e2e/cucumber/steps/ui/spaces.ts b/tests/e2e/cucumber/steps/ui/spaces.ts
index 0f1d8084418..7af54868cdd 100644
--- a/tests/e2e/cucumber/steps/ui/spaces.ts
+++ b/tests/e2e/cucumber/steps/ui/spaces.ts
@@ -43,16 +43,6 @@ When(
   }
 )
 
-When(
-  '{string} navigates to the first project space named {string}',
-  async function (this: World, stepUser: string, name: string): Promise<void> {
-    const { page } = this.actorsEnvironment.getActor({ key: stepUser })
-    const spacesObject = new objects.applicationFiles.Spaces({ page })
-
-    await spacesObject.openNamed({ name })
-  }
-)
-
 When(
   /^"([^"]*)" (changes|updates) the space "([^"]*)" (name|subtitle|description|quota|image) to "([^"]*)"$/,
   async function (
diff --git a/tests/e2e/support/environment/space.ts b/tests/e2e/support/environment/space.ts
index d07f66cc6e6..2a43ca5f05e 100644
--- a/tests/e2e/support/environment/space.ts
+++ b/tests/e2e/support/environment/space.ts
@@ -3,6 +3,7 @@ import { spaceStore } from '../store'
 
 export class SpacesEnvironment {
   getSpace({ key }: { key: string }): Space {
+    console.log(spaceStore)
     if (!spaceStore.has(key)) {
       throw new Error(`space with key '${key}' not found`)
     }
diff --git a/tests/e2e/support/objects/app-files/resource/actions.ts b/tests/e2e/support/objects/app-files/resource/actions.ts
index 348d8eed32d..14f7f29e460 100644
--- a/tests/e2e/support/objects/app-files/resource/actions.ts
+++ b/tests/e2e/support/objects/app-files/resource/actions.ts
@@ -3,7 +3,7 @@ import { expect } from '@playwright/test'
 import util from 'util'
 import { resourceExists, waitForResources } from './utils'
 import path from 'path'
-import { File } from '../../../types'
+import { File, Space } from '../../../types'
 import { sidebar } from '../utils'
 import { config } from '../../../../config'
 
@@ -105,11 +105,46 @@ export const createSpaceFromFolder = async ({
   page: Page
   folderName: string
   spaceName: string
-}): Promise<void> => {
+}): Promise<Space> => {
   await page.locator(util.format(resourceNameSelector, folderName)).click({ button: 'right' })
   await page.locator('text=Create Space from selection').first().click()
   await page.locator('.oc-text-input').first().fill(spaceName)
   await page.locator(util.format(actionConfirmationButton, 'Create')).click()
+  const response = await page.waitForResponse(
+    (resp) =>
+      resp.status() === 201 && resp.request().method() === 'POST' && resp.url().endsWith('/drives')
+  )
+  await page.waitForSelector('#oc-loading-indicator')
+  await page.waitForSelector('#oc-loading-indicator', { state: 'detached' })
+  return (await response.json()) as Space
+}
+
+export const createSpaceFromSelection = async ({
+  page,
+  resources,
+  spaceName
+}: {
+  page: Page
+  resources: string[]
+  spaceName: string
+}): Promise<Space> => {
+  await selectOrDeselectResources({
+    page,
+    resources: resources.map((r) => ({ name: r } as resourceArgs)),
+    select: true
+  })
+  await page.locator(util.format(resourceNameSelector, resources[0])).click({ button: 'right' })
+
+  await page.locator('text=Create Space from selection').first().click()
+  await page.locator('.oc-text-input').first().fill(spaceName)
+  await page.locator(util.format(actionConfirmationButton, 'Create')).click()
+  const response = await page.waitForResponse(
+    (resp) =>
+      resp.status() === 201 && resp.request().method() === 'POST' && resp.url().endsWith('/drives')
+  )
+  await page.waitForSelector('#oc-loading-indicator')
+  await page.waitForSelector('#oc-loading-indicator', { state: 'detached' })
+  return (await response.json()) as Space
 }
 
 export const createNewFolder = async ({
@@ -275,7 +310,7 @@ export const uploadResource = async (args: uploadResourceArgs): Promise<void> =>
 
 interface resourceArgs {
   name: string
-  type: string
+  type?: string
 }
 
 export interface downloadResourcesArgs {
@@ -686,6 +721,12 @@ export interface createSpaceFromFolderArgs {
   page: Page
 }
 
+export interface createSpaceFromSelectionArgs {
+  resources: string[]
+  spaceName: string
+  page: Page
+}
+
 export const restoreResourceTrashbin = async (
   args: restoreResourceTrashbinArgs
 ): Promise<string> => {
diff --git a/tests/e2e/support/objects/app-files/resource/index.ts b/tests/e2e/support/objects/app-files/resource/index.ts
index f3b14e9ad61..46daa78ae83 100644
--- a/tests/e2e/support/objects/app-files/resource/index.ts
+++ b/tests/e2e/support/objects/app-files/resource/index.ts
@@ -45,8 +45,11 @@ import {
   clickViewModeToggle,
   expectThatResourcesAreTiles,
   createSpaceFromFolder,
-  createSpaceFromFolderArgs
+  createSpaceFromFolderArgs,
+  createSpaceFromSelection,
+  createSpaceFromSelectionArgs
 } from './actions'
+import { Space } from '../../../types'
 
 export class Resource {
   #page: Page
@@ -227,7 +230,11 @@ export class Resource {
     return await clickResourceTag({ ...args, page: this.#page })
   }
 
-  async createSpaceFromFolder(args: Omit<createSpaceFromFolderArgs, 'page'>): Promise<void> {
-    return await createSpaceFromFolder({ ...args, page: this.#page })
+  async createSpaceFromFolder(args: Omit<createSpaceFromFolderArgs, 'page'>): Promise<Space> {
+    return createSpaceFromFolder({ ...args, page: this.#page })
+  }
+
+  async createSpaceFromSelection(args: Omit<createSpaceFromSelectionArgs, 'page'>): Promise<Space> {
+    return createSpaceFromSelection({ ...args, page: this.#page })
   }
 }
diff --git a/tests/e2e/support/objects/app-files/spaces/actions.ts b/tests/e2e/support/objects/app-files/spaces/actions.ts
index 80e72e7c176..a62737fc1f5 100644
--- a/tests/e2e/support/objects/app-files/spaces/actions.ts
+++ b/tests/e2e/support/objects/app-files/spaces/actions.ts
@@ -87,11 +87,6 @@ export const openSpace = async (args: openSpaceArgs): Promise<void> => {
   const { page, id } = args
   await page.locator(util.format(spaceIdSelector, id)).click()
 }
-
-export const openSpaceNamed = async (args: { name: string; page: Page }): Promise<void> => {
-  const { page, name } = args
-  await page.locator(`text=${name}`).click()
-}
 /**/
 
 export const changeSpaceName = async (args: {
diff --git a/tests/e2e/support/objects/app-files/spaces/index.ts b/tests/e2e/support/objects/app-files/spaces/index.ts
index 4bb2d95cc79..272ae072a43 100644
--- a/tests/e2e/support/objects/app-files/spaces/index.ts
+++ b/tests/e2e/support/objects/app-files/spaces/index.ts
@@ -20,8 +20,7 @@ import {
   changeSpaceRole,
   createPublicLinkForSpace,
   addExpirationDateToMember,
-  removeExpirationDateFromMember,
-  openSpaceNamed
+  removeExpirationDateFromMember
 } from './actions'
 import { spaceWithSpaceIDNotExist } from './utils'
 import { ICollaborator } from '../share/collaborator'
@@ -53,10 +52,6 @@ export class Spaces {
     await openSpace({ page: this.#page, id })
   }
 
-  async openNamed({ name }: { name: string }): Promise<void> {
-    await openSpaceNamed({ page: this.#page, name })
-  }
-
   async changeName({ key, value }: { key: string; value: string }): Promise<void> {
     const { id } = this.#spacesEnvironment.getSpace({ key })
     await changeSpaceName({ id, value, page: this.#page })

From 9a7d1664c5611bde10ccca0e152470fda74f19dc Mon Sep 17 00:00:00 2001
From: Jan <j.ackermann91@gmail.com>
Date: Wed, 29 Mar 2023 18:27:42 +0200
Subject: [PATCH 21/25] WIP e2e

---
 .../spaces/useSpaceHelpers.spec.ts            | 62 +++++++++++++++++++
 ... => createSpaceFromSelection.ocis.feature} | 13 ++--
 tests/e2e/cucumber/steps/ui/resources.ts      |  8 ++-
 tests/e2e/support/environment/space.ts        |  1 -
 .../objects/app-files/resource/actions.ts     |  5 +-
 5 files changed, 78 insertions(+), 11 deletions(-)
 rename tests/e2e/cucumber/features/smoke/{createSpaceShortcut.ocis.feature => createSpaceFromSelection.ocis.feature} (86%)

diff --git a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
index 03454f07a86..7baf47f1c9f 100644
--- a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
@@ -1,7 +1,69 @@
 import { useSpaceHelpers } from 'web-pkg/src/composables'
+import {
+  createStore,
+  defaultComponentMocks,
+  defaultStoreMockOptions,
+  getComposableWrapper,
+  getStoreInstance,
+  RouteLocation
+} from 'web-test-helpers'
+import user from 'web-runtime/src/store/user'
+import { SpaceResource } from 'web-client'
+import { useFileActionsSetReadme } from 'web-pkg/src/composables/actions'
+import { mock, mockDeep } from 'jest-mock-extended'
+import { OwnCloudSdk } from 'web-client/src/types'
+import {unref} from "vue";
 
 describe('useCapability', () => {
   it('should be valid', () => {
     expect(useSpaceHelpers).toBeDefined()
   })
+  describe('method "checkName"', () => {
+    it('should not show an error message with a valid space name', () => {
+      const { checkSpaceNameModalInput } = useSpaceHelpers()
+      checkSpaceNameModalInput('Space')
+
+      const { wrapper } = getWrapper({
+        setup: ({ actions }) => {
+          expect(
+            unref(actions)[0].isEnabled({
+              space,
+              resources: [{ id: 1, mimeType: 'text/plain' }] as SpaceResource[]
+            })
+          ).toBe(false)
+        }
+      })
+    })
+  })
 })
+
+function getWrapper({
+  setup
+}: {
+  setup: (
+    instance: ReturnType<typeof useFileActionsSetReadme>,
+    options: { storeOptions: typeof defaultStoreMockOptions }
+  ) => void
+}) {
+  const mocks = {
+    ...defaultComponentMocks({})
+  }
+
+  const storeOptions = {
+    ...defaultStoreMockOptions
+  }
+
+  const store = createStore(storeOptions)
+  return {
+    wrapper: getComposableWrapper(
+      () => {
+        const instance = useSpaceHelpers()
+        setup(instance, { storeOptions })
+      },
+      {
+        store,
+        mocks
+      }
+    )
+  }
+}
diff --git a/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
similarity index 86%
rename from tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
rename to tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
index 16a1ebceb35..8a13e5d8114 100644
--- a/tests/e2e/cucumber/features/smoke/createSpaceShortcut.ocis.feature
+++ b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
@@ -1,7 +1,6 @@
-#oc-files-actions-create-space-from-resource-trigger
-Feature: create space shortcut
+Feature: create Space shortcut
 
-  Scenario: create space from folder
+  Scenario: create Space from folder
     Given "Admin" creates following users using API
       | id    |
       | Alice |
@@ -22,10 +21,10 @@ Feature: create space shortcut
     And "Alice" creates space "folderSpace" from folder "spaceFolder" using the context menu
     And "Alice" navigates to the projects space page
     And "Alice" navigates to the project space "folderSpace"
-    And "Alice" downloads the following resources using the sidebar panel
-      | resource            | from  | type   |
-      | data.zip            |       | file   |
-      | lorem.txt           |       | file   |
+    Then following resources should be displayed in the files list for user "Alice"
+      | resource  |
+      | data.zip  |
+      | lorem.txt |
     And "Alice" logs out
 
   Scenario: create space from resources
diff --git a/tests/e2e/cucumber/steps/ui/resources.ts b/tests/e2e/cucumber/steps/ui/resources.ts
index eab4dae882e..365d94e8bff 100644
--- a/tests/e2e/cucumber/steps/ui/resources.ts
+++ b/tests/e2e/cucumber/steps/ui/resources.ts
@@ -227,11 +227,15 @@ Then(
     stepUser: string,
     stepTable: DataTable
   ): Promise<void> {
+      console.log("a")
     const { page } = this.actorsEnvironment.getActor({ key: stepUser })
-    const resourceObject = new objects.applicationFiles.Resource({ page })
-    const actualList = await resourceObject.getDisplayedResources({
+      console.log("b")
+      const resourceObject = new objects.applicationFiles.Resource({ page })
+      console.log("c")
+      const actualList = await resourceObject.getDisplayedResources({
       keyword: listType as displayedResourceType
     })
+      console.log(actualList)
     for (const info of stepTable.hashes()) {
       const found = actualList.includes(info.resource)
       if (actionType === 'should') {
diff --git a/tests/e2e/support/environment/space.ts b/tests/e2e/support/environment/space.ts
index 2a43ca5f05e..d07f66cc6e6 100644
--- a/tests/e2e/support/environment/space.ts
+++ b/tests/e2e/support/environment/space.ts
@@ -3,7 +3,6 @@ import { spaceStore } from '../store'
 
 export class SpacesEnvironment {
   getSpace({ key }: { key: string }): Space {
-    console.log(spaceStore)
     if (!spaceStore.has(key)) {
       throw new Error(`space with key '${key}' not found`)
     }
diff --git a/tests/e2e/support/objects/app-files/resource/actions.ts b/tests/e2e/support/objects/app-files/resource/actions.ts
index 14f7f29e460..153e1d413df 100644
--- a/tests/e2e/support/objects/app-files/resource/actions.ts
+++ b/tests/e2e/support/objects/app-files/resource/actions.ts
@@ -873,9 +873,12 @@ export const getDisplayedResourcesFromSearch = async (page): Promise<string[]> =
 
 export const getDisplayedResourcesFromFilesList = async (page): Promise<string[]> => {
   const files = []
-  const result = page.locator(resourceNameSelector)
+  const result = page.locator('.oc-resource-name')
+  const items = await page.$$('[data-test-resource-path]')
+  console.log(items)
 
   const count = await result.count()
+  console.log(count)
   for (let i = 0; i < count; i++) {
     files.push(await result.nth(i).getAttribute('data-test-resource-name'))
   }

From ab663581da9d7376ee857b30eeb8cd897d09eaef Mon Sep 17 00:00:00 2001
From: Paul Neubauer <paulneubauer@live.de>
Date: Thu, 30 Mar 2023 10:10:29 +0200
Subject: [PATCH 22/25] Fix e2e tests

---
 .../unit/composables/spaces/useSpaceHelpers.spec.ts      | 9 ++-------
 .../features/smoke/createSpaceFromSelection.ocis.feature | 8 ++++----
 tests/e2e/cucumber/steps/ui/resources.ts                 | 8 ++------
 tests/e2e/support/objects/app-files/resource/actions.ts  | 6 ++----
 4 files changed, 10 insertions(+), 21 deletions(-)

diff --git a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
index 7baf47f1c9f..a7684250724 100644
--- a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
@@ -3,16 +3,11 @@ import {
   createStore,
   defaultComponentMocks,
   defaultStoreMockOptions,
-  getComposableWrapper,
-  getStoreInstance,
-  RouteLocation
+  getComposableWrapper
 } from 'web-test-helpers'
-import user from 'web-runtime/src/store/user'
 import { SpaceResource } from 'web-client'
 import { useFileActionsSetReadme } from 'web-pkg/src/composables/actions'
-import { mock, mockDeep } from 'jest-mock-extended'
-import { OwnCloudSdk } from 'web-client/src/types'
-import {unref} from "vue";
+import { unref } from 'vue'
 
 describe('useCapability', () => {
   it('should be valid', () => {
diff --git a/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
index 8a13e5d8114..a8b382beb25 100644
--- a/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
+++ b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
@@ -50,7 +50,7 @@ Feature: create Space shortcut
       | lorem.txt               |
     And "Alice" navigates to the projects space page
     And "Alice" navigates to the project space "resourceSpace"
-    And "Alice" downloads the following resources using the sidebar panel
-      | resource            | from  | type   |
-      | resourceFolder      |       | folder |
-      | lorem.txt           |       | file   |
+    Then following resources should be displayed in the files list for user "Alice"
+      | resource        |
+      | resourceFolder  |
+      | lorem.txt       |
diff --git a/tests/e2e/cucumber/steps/ui/resources.ts b/tests/e2e/cucumber/steps/ui/resources.ts
index 365d94e8bff..eab4dae882e 100644
--- a/tests/e2e/cucumber/steps/ui/resources.ts
+++ b/tests/e2e/cucumber/steps/ui/resources.ts
@@ -227,15 +227,11 @@ Then(
     stepUser: string,
     stepTable: DataTable
   ): Promise<void> {
-      console.log("a")
     const { page } = this.actorsEnvironment.getActor({ key: stepUser })
-      console.log("b")
-      const resourceObject = new objects.applicationFiles.Resource({ page })
-      console.log("c")
-      const actualList = await resourceObject.getDisplayedResources({
+    const resourceObject = new objects.applicationFiles.Resource({ page })
+    const actualList = await resourceObject.getDisplayedResources({
       keyword: listType as displayedResourceType
     })
-      console.log(actualList)
     for (const info of stepTable.hashes()) {
       const found = actualList.includes(info.resource)
       if (actionType === 'should') {
diff --git a/tests/e2e/support/objects/app-files/resource/actions.ts b/tests/e2e/support/objects/app-files/resource/actions.ts
index 153e1d413df..54787c5afaf 100644
--- a/tests/e2e/support/objects/app-files/resource/actions.ts
+++ b/tests/e2e/support/objects/app-files/resource/actions.ts
@@ -873,12 +873,10 @@ export const getDisplayedResourcesFromSearch = async (page): Promise<string[]> =
 
 export const getDisplayedResourcesFromFilesList = async (page): Promise<string[]> => {
   const files = []
-  const result = page.locator('.oc-resource-name')
-  const items = await page.$$('[data-test-resource-path]')
-  console.log(items)
+  await page.waitForSelector('[data-test-resource-path]')
+  const result = await page.locator('[data-test-resource-path]')
 
   const count = await result.count()
-  console.log(count)
   for (let i = 0; i < count; i++) {
     files.push(await result.nth(i).getAttribute('data-test-resource-name'))
   }

From e7c6b0e718cafccfc71e627d49340f9d5e5144cc Mon Sep 17 00:00:00 2001
From: Jannik Stehle <jannik.stehle@gmail.com>
Date: Tue, 4 Apr 2023 10:48:35 +0200
Subject: [PATCH 23/25] Add unit tests for useSpaceHelpers

---
 .../spaces/useSpaceHelpers.spec.ts            | 65 ++++++++++++-------
 1 file changed, 40 insertions(+), 25 deletions(-)

diff --git a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
index a7684250724..f53ca6f08bc 100644
--- a/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
+++ b/packages/web-pkg/tests/unit/composables/spaces/useSpaceHelpers.spec.ts
@@ -5,30 +5,51 @@ import {
   defaultStoreMockOptions,
   getComposableWrapper
 } from 'web-test-helpers'
-import { SpaceResource } from 'web-client'
-import { useFileActionsSetReadme } from 'web-pkg/src/composables/actions'
-import { unref } from 'vue'
 
-describe('useCapability', () => {
+describe('useSpaceHelpers', () => {
   it('should be valid', () => {
     expect(useSpaceHelpers).toBeDefined()
   })
-  describe('method "checkName"', () => {
+  describe('method "checkSpaceNameModalInput"', () => {
     it('should not show an error message with a valid space name', () => {
-      const { checkSpaceNameModalInput } = useSpaceHelpers()
-      checkSpaceNameModalInput('Space')
-
-      const { wrapper } = getWrapper({
-        setup: ({ actions }) => {
-          expect(
-            unref(actions)[0].isEnabled({
-              space,
-              resources: [{ id: 1, mimeType: 'text/plain' }] as SpaceResource[]
-            })
-          ).toBe(false)
+      getWrapper({
+        setup: ({ checkSpaceNameModalInput }, { storeOptions }) => {
+          checkSpaceNameModalInput('Space')
+          const { setModalInputErrorMessage } = storeOptions.actions
+          expect(setModalInputErrorMessage).toHaveBeenCalledWith(expect.anything(), null)
+        }
+      })
+    })
+    it('should show an error message with an empty name', () => {
+      getWrapper({
+        setup: ({ checkSpaceNameModalInput }, { storeOptions }) => {
+          checkSpaceNameModalInput('')
+          const { setModalInputErrorMessage } = storeOptions.actions
+          expect(setModalInputErrorMessage).not.toHaveBeenCalledWith(expect.anything(), null)
+        }
+      })
+    })
+    it('should show an error with an name longer than 255 characters', () => {
+      getWrapper({
+        setup: ({ checkSpaceNameModalInput }, { storeOptions }) => {
+          checkSpaceNameModalInput('n'.repeat(256))
+          const { setModalInputErrorMessage } = storeOptions.actions
+          expect(setModalInputErrorMessage).not.toHaveBeenCalledWith(expect.anything(), null)
         }
       })
     })
+    it.each(['/', '\\', '.', ':', '?', '*', '"', '>', '<', '|'])(
+      'should show an error message with a name including a special character',
+      (specialChar) => {
+        getWrapper({
+          setup: ({ checkSpaceNameModalInput }, { storeOptions }) => {
+            checkSpaceNameModalInput(specialChar)
+            const { setModalInputErrorMessage } = storeOptions.actions
+            expect(setModalInputErrorMessage).not.toHaveBeenCalledWith(expect.anything(), null)
+          }
+        })
+      }
+    )
   })
 })
 
@@ -36,18 +57,12 @@ function getWrapper({
   setup
 }: {
   setup: (
-    instance: ReturnType<typeof useFileActionsSetReadme>,
+    instance: ReturnType<typeof useSpaceHelpers>,
     options: { storeOptions: typeof defaultStoreMockOptions }
   ) => void
 }) {
-  const mocks = {
-    ...defaultComponentMocks({})
-  }
-
-  const storeOptions = {
-    ...defaultStoreMockOptions
-  }
-
+  const mocks = defaultComponentMocks()
+  const storeOptions = defaultStoreMockOptions
   const store = createStore(storeOptions)
   return {
     wrapper: getComposableWrapper(

From 75eaead400572ab8493e03aea7ad125568a94212 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <jannik.stehle@gmail.com>
Date: Wed, 5 Apr 2023 10:19:17 +0200
Subject: [PATCH 24/25] Fix e2e tag test

---
 tests/e2e/cucumber/features/smoke/tags.ocis.feature | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/tests/e2e/cucumber/features/smoke/tags.ocis.feature b/tests/e2e/cucumber/features/smoke/tags.ocis.feature
index fb3c3c6621d..9b30103f519 100644
--- a/tests/e2e/cucumber/features/smoke/tags.ocis.feature
+++ b/tests/e2e/cucumber/features/smoke/tags.ocis.feature
@@ -41,12 +41,12 @@ Feature: Users can use web to organize tags
       | lorem.txt    |
       | textfile.txt |
     And "Alice" adds the following tags for the following resources using the sidebar panel
-      | resource  | tags         |
-      | lorem.txt | tag 1, tag 2 |
-    And "Alice" clicks the tag "tag 1" on the resource "lorem.txt"
+      | resource  | tags       |
+      | lorem.txt | tag1, tag2 |
+    And "Alice" clicks the tag "tag1" on the resource "lorem.txt"
     Then the following resources should contain the following tags in the files list for user "Alice"
-      | resource  | tags  |
-      | lorem.txt | tag 1 |
+      | resource  | tags |
+      | lorem.txt | tag1 |
     Then following resources should not be displayed in the files list for user "Alice"
       | resource     |
       | textfile.txt |

From dcc1fc49a7201c01e1b58e60bc4b7517c7f050d4 Mon Sep 17 00:00:00 2001
From: Jannik Stehle <50302941+JammingBen@users.noreply.github.com>
Date: Wed, 5 Apr 2023 11:44:19 +0200
Subject: [PATCH 25/25] Update
 tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature

---
 .../features/smoke/createSpaceFromSelection.ocis.feature         | 1 +
 1 file changed, 1 insertion(+)

diff --git a/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
index a8b382beb25..7426c9cdbba 100644
--- a/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
+++ b/tests/e2e/cucumber/features/smoke/createSpaceFromSelection.ocis.feature
@@ -54,3 +54,4 @@ Feature: create Space shortcut
       | resource        |
       | resourceFolder  |
       | lorem.txt       |
+    And "Alice" logs out