refactor!: useSpaceActionsCreate to files app

packages/web-app-admin-settings/src/extensionPoints.ts

@@ -10,6 +10,11 @@ export const floatingActionButtonExtension: ExtensionPoint<FloatingActionButtonE
   extensionType: 'floatingActionButton'
 }
 
+export const spacesCreateExtensionPoint: ExtensionPoint<ActionExtension> = {
+  id: 'app.admin-settings.spaces.create',
+  extensionType: 'action'
+}
+
 export const spacesContextActionsExtensionPoint: ExtensionPoint<ActionExtension> = {
   id: 'app.admin-settings.spaces.context-actions',
   extensionType: 'action',
@@ -32,6 +37,7 @@ export const extensionPoints = () => {
   return computed<ExtensionPoint<any>[]>(() => {
     return [
       floatingActionButtonExtension,
+      spacesCreateExtensionPoint,
       spacesContextActionsExtensionPoint,
       spacesSidebarActionsExtensionPoint,
       spacesBatchActionsExtensionPoint

packages/web-app-admin-settings/src/index.ts

@@ -6,26 +6,23 @@ import Spaces from './views/Spaces.vue'
 import Extensions from './views/Extensions.vue'
 import { urlJoin } from '@opencloud-eu/web-client'
 import {
+  ActionExtension,
   ApplicationInformation,
   AppMenuItemExtension,
   ClassicApplicationScript,
   defineWebApplication,
   Extension,
   FloatingActionButtonExtension,
   useAbility,
+  useExtensionRegistry,
   useRoute,
-  useSpaceActionsCreate,
   useUserStore
 } from '@opencloud-eu/web-pkg'
 import { computed, unref } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import {
-  useGroupActionsCreateGroup,
-  useSpaceSettingsStore,
-  useUserActionsCreateUser
-} from './composables'
+import { useGroupActionsCreateGroup, useUserActionsCreateUser } from './composables'
 import { APPID } from './appid'
-import { extensionPoints } from './extensionPoints'
+import { extensionPoints, spacesCreateExtensionPoint } from './extensionPoints'
 
 export const routes: ClassicApplicationScript['routes'] = ({ $ability, $gettext }) => [
   {
@@ -189,17 +186,15 @@ export default defineWebApplication({
     const userStore = useUserStore()
     const { $gettext } = useGettext()
     const currentRoute = useRoute()
-    const { upsertSpace } = useSpaceSettingsStore()
+    const { requestExtensions } = useExtensionRegistry()
 
     const { actions: createUserActions } = useUserActionsCreateUser()
     const createUserAction = computed(() => unref(createUserActions)[0])
     const { actions: createGroupActions } = useGroupActionsCreateGroup()
     const createGroupAction = computed(() => unref(createGroupActions)[0])
-    const { actions: createSpaceActions } = useSpaceActionsCreate({
-      onSpaceCreated: (space) => {
-        upsertSpace(space)
-      }
-    })
+    const createSpaceActions = computed(() =>
+      (requestExtensions<ActionExtension>(spacesCreateExtensionPoint) || []).map((e) => e.action)
+    )
     const createSpaceAction = computed(() => unref(createSpaceActions)[0])
 
     const appInfo: ApplicationInformation = {
@@ -242,7 +237,7 @@ export default defineWebApplication({
         mode: () => 'handler',
         handler: () => {
           if (unref(currentRoute).name === 'admin-settings-spaces') {
-            return unref(createSpaceAction).handler()
+            return unref(createSpaceAction)!.handler()
           }
 
           if (unref(currentRoute).name === 'admin-settings-users') {
@@ -258,7 +253,7 @@ export default defineWebApplication({
         isDisabled: () => {
           if (
             unref(currentRoute).name === 'admin-settings-spaces' &&
-            unref(createSpaceAction).isVisible()
+            unref(createSpaceAction)?.isVisible()
           ) {
             return false
           }

packages/web-app-admin-settings/src/views/Spaces.vue

@@ -83,10 +83,11 @@ import {
   useExtensionRegistry,
   useRouteQuery,
   useSideBar,
+  useSpacesStore,
   AppLoadingSpinner,
   ActionExtension
 } from '@opencloud-eu/web-pkg'
-import { call, SpaceResource } from '@opencloud-eu/web-client'
+import { call, isProjectSpaceResource, SpaceResource } from '@opencloud-eu/web-client'
 import {
   ComponentPublicInstance,
   computed,
@@ -109,6 +110,7 @@ const { $gettext } = useGettext()
 const sidebarStore = useSideBar()
 const { isSideBarOpen } = storeToRefs(sidebarStore)
 const { requestExtensions } = useExtensionRegistry()
+const spacesStore = useSpacesStore()
 
 let loadResourcesEventToken: string
 let updateQuotaForSpaceEventToken: string
@@ -222,6 +224,20 @@ const sideBarAvailablePanels = [
   }
 ] satisfies SideBarPanel<unknown, unknown, SpaceResource>[]
 
+// keep the list in sync with spaces created via the FAB
+spacesStore.$onAction(({ name, args, after }) => {
+  if (name !== 'upsertSpace') {
+    return
+  }
+  after(() => {
+    const [space] = args
+    const loadedSpaceIds = spaceSettingsStore.spaces.map(({ id }) => id)
+    if (isProjectSpaceResource(space) && !loadedSpaceIds.includes(space.id)) {
+      spaceSettingsStore.upsertSpace(space)
+    }
+  })
+})
+
 onMounted(async () => {
   await loadResourcesTask.perform()
 

packages/web-pkg/src/components/Spaces/CreateSpaceModal.vue → packages/web-app-files/src/components/Modals/CreateSpaceModal.vue

@@ -32,7 +32,7 @@
       </div>
     </template>
     <component
-      :is="vaultCreation.setupComponent"
+      :is="vaultCreation!.setupComponent"
       v-else
       ref="setupComponent"
       :vault-name="spaceName"
@@ -65,24 +65,17 @@
 <script setup lang="ts">
 import { computed, ref, unref, watch } from 'vue'
 import { useGettext } from 'vue3-gettext'
-import { useIsResourceNameValid } from '../../composables/resources'
-import type { VaultCreation, VaultFinalize, Modal } from '../../composables/piniaStores'
+import {
+  getVaultCreator,
+  useCreateSpace,
+  useExtensionRegistry,
+  useIsResourceNameValid,
+  type Modal,
+  type VaultFinalize
+} from '@opencloud-eu/web-pkg'
 
-const {
-  modal,
-  vaultCreation = undefined,
-  callbackFn
-} = defineProps<{
+const { modal } = defineProps<{
   modal: Modal
-  /**
-   * Creation bits of the vault extension that would claim the new space.Absent
-   * when no extension can create vaults, hence hide the encryption switch.
-   */
-  vaultCreation?: VaultCreation
-  callbackFn: (
-    spaceName: string,
-    options: { encrypt: boolean; finalizeVault?: VaultFinalize }
-  ) => Promise<void>
 }>()
 
 const emit = defineEmits<{
@@ -91,14 +84,18 @@ const emit = defineEmits<{
 
 const { $gettext } = useGettext()
 const { isSpaceNameValid } = useIsResourceNameValid()
+const { addNewSpace } = useCreateSpace()
+const extensionRegistry = useExtensionRegistry()
+
+const vaultCreation = computed(() => getVaultCreator(extensionRegistry)?.creation)
 
 const setupComponent = ref<{ finalize: VaultFinalize }>()
 const step = ref<'name' | 'setup'>('name')
 const encrypt = ref(false)
 const setupValid = ref(false)
 const spaceName = ref($gettext('New space'))
 
-const canEncrypt = computed(() => !!vaultCreation)
+const canEncrypt = computed(() => !!unref(vaultCreation))
 const errorMessage = computed(() => isSpaceNameValid(unref(spaceName)).error)
 const inputValid = computed(() =>
   unref(step) === 'setup' ? unref(setupValid) : !unref(errorMessage)
@@ -133,7 +130,7 @@ async function onConfirm() {
   if (!unref(inputValid) || (unref(encrypt) && unref(step) === 'name')) {
     return Promise.reject()
   }
-  await callbackFn(unref(spaceName), {
+  await addNewSpace(unref(spaceName), {
     encrypt: unref(encrypt),
     finalizeVault: unref(setupComponent)?.finalize
   })

packages/web-app-files/src/composables/actions/spaces/index.ts

@@ -1,3 +1,4 @@
+export * from './useSpaceActionsCreate'
 export * from './useSpaceActionsDeleteImage'
 export * from './useSpaceActionsDelete'
 export * from './useSpaceActionsDisable'

packages/web-app-files/src/composables/actions/spaces/useSpaceActionsCreate.ts

@@ -0,0 +1,32 @@
+import { computed, markRaw } from 'vue'
+import { useGettext } from 'vue3-gettext'
+import { SpaceAction, useAbility, useModals } from '@opencloud-eu/web-pkg'
+import CreateSpaceModal from '../../../components/Modals/CreateSpaceModal.vue'
+
+export const useSpaceActionsCreate = () => {
+  const { dispatchModal } = useModals()
+  const { $gettext } = useGettext()
+  const { can } = useAbility()
+
+  const actions = computed((): SpaceAction[] => [
+    {
+      name: 'create',
+      icon: 'add',
+      class: 'oc-files-actions-create-space-trigger',
+      label: () => $gettext('New Space'),
+      isVisible: () => can('create-all', 'Drive'),
+      handler: () => {
+        dispatchModal({
+          title: $gettext('Create a new space'),
+          focusTrapInitial: '#create-space-input',
+          customComponent: markRaw(CreateSpaceModal),
+          hideActions: true
+        })
+      }
+    }
+  ])
+
+  return {
+    actions
+  }
+}

packages/web-app-files/src/composables/extensions/useSpaceActions.ts

@@ -22,9 +22,11 @@ import {
   useSpaceActionsUploadImage,
   useSpaceActionsEditImageMenu,
   useSpaceActionsLockVault,
-  useSpaceActionsUnlockVault
+  useSpaceActionsUnlockVault,
+  useSpaceActionsCreate
 } from '../actions'
 
+const adminSettingsSpacesCreateExtensionPointId = 'app.admin-settings.spaces.create'
 const adminSettingsSpacesContextActionsExtensionPointId =
   'app.admin-settings.spaces.context-actions'
 const adminSettingsSpacesSideBarActionsExtensionPointId =
@@ -48,8 +50,15 @@ export const useSpaceActions = (): ActionExtension[] => {
   const { actions: showMembersActions } = useSpaceActionsShowMembers()
   const { actions: lockVaultActions } = useSpaceActionsLockVault()
   const { actions: unlockVaultActions } = useSpaceActionsUnlockVault()
+  const { actions: createSpaceActions } = useSpaceActionsCreate()
 
   return [
+    {
+      id: 'com.github.opencloud-eu.web.files.spaces.action.create',
+      extensionPointIds: [adminSettingsSpacesCreateExtensionPointId],
+      type: 'action',
+      action: unref(createSpaceActions)[0]
+    },
     {
       id: 'com.github.opencloud-eu.web.files.spaces.context-action.show-members',
       extensionPointIds: [contextActionsExtensionPoint.id],

packages/web-app-files/src/extensions.ts

@@ -10,7 +10,6 @@ import {
   useResourcesStore,
   useRouter,
   useSearch,
-  useSpaceActionsCreate,
   useSpacesStore,
   useUserStore
 } from '@opencloud-eu/web-pkg'
@@ -23,6 +22,7 @@ import { useFileActions } from './composables/extensions/useFileActions'
 import { useSpaceActions } from './composables/extensions/useSpaceActions'
 import { useUploadActions } from './composables/extensions/useUploadActions'
 import { isPublicSpaceResource, SharePermissionBit, urlJoin } from '@opencloud-eu/web-client'
+import { useSpaceActionsCreate } from './composables/actions/spaces/useSpaceActionsCreate'
 import { useGettext } from 'vue3-gettext'
 import { storeToRefs } from 'pinia'
 import CreateOrUploadMenu from './components/CreateOrUploadMenu.vue'