feat: implement team upgrade banner and remove legacy folder share

Signed-off-by: Stefan Dietrich <stefan.dietrich@dataport.de>

Author: stediefan

lib/Controller/PageController.php

@@ -10,14 +10,18 @@
 namespace OCA\Circles\Controller;
 
 use OCA\Circles\AppInfo\Application;
+use OCA\Circles\ConfigLexicon;
 use OCA\Circles\Service\ConfigService;
 use OCP\AppFramework\Controller;
 use OCP\AppFramework\Http\Attribute\FrontpageRoute;
 use OCP\AppFramework\Http\Attribute\NoAdminRequired;
 use OCP\AppFramework\Http\Attribute\NoCSRFRequired;
 use OCP\AppFramework\Http\NotFoundResponse;
 use OCP\AppFramework\Http\TemplateResponse;
+use OCP\AppFramework\Services\IAppConfig;
+use OCP\AppFramework\Services\IInitialState;
 use OCP\IRequest;
+use OCP\Teams\ITeamManager;
 use OCP\Util;
 
 /**
@@ -27,6 +31,9 @@ class PageController extends Controller {
 	public function __construct(
 		IRequest $request,
 		private ConfigService $configService,
+		private IAppConfig $appConfig,
+		private IInitialState $initialState,
+		private ITeamManager $teamManager,
 	) {
 		parent::__construct(Application::APP_ID, $request);
 	}
@@ -41,6 +48,14 @@ public function index(): TemplateResponse|NotFoundResponse {
 			return new NotFoundResponse();
 		}
 
+		$this->initialState->provideInitialState(
+			'teamFolderAutoCreate',
+			$this->appConfig->getAppValueBool(ConfigLexicon::TEAM_FOLDER_AUTO_CREATE, true),
+		);
+		/** @psalm-suppress UndefinedInterfaceMethod -- ITeamManager::getTeamFolderProvider() is @since 35.0.0 */
+		$providerAvailable = $this->teamManager->getTeamFolderProvider() !== null;
+		$this->initialState->provideInitialState('teamFolderProviderAvailable', $providerAvailable);
+
 		Util::addScript(Application::APP_ID, 'teams-main');
 		Util::addStyle(Application::APP_ID, 'teams-main');
 

src/components/AdminTeamFolders.vue

@@ -154,9 +154,7 @@ async function onSaveQuota() {
 			{{ t('circles', 'Automatically create a team space') }}
 		</NcCheckboxRadioSwitch>
 
-		<div
-			v-show="teamFolderAutoCreate"
-			class="team-folders__sub-section">
+		<div class="team-folders__sub-section">
 			<div class="team-folders__input-row">
 				<NcSelect
 					v-model="selectedQuota"
@@ -184,7 +182,6 @@ async function onSaveQuota() {
 <style scoped>
 .team-folders__sub-section {
 	margin-top: 12px;
-	margin-left: 44px;
 	display: flex;
 	flex-direction: column;
 	gap: 8px;

src/teams/team-page/components/CircleDetails.spec.ts

@@ -0,0 +1,213 @@
+/*!
+ * SPDX-FileCopyrightText: 2026 Nextcloud GmbH and Nextcloud contributors
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import type { TeamFolder } from '../../api.ts'
+
+import { shallowMount } from '@vue/test-utils'
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import Circle from '../models/circle.ts'
+import CircleDetails from './CircleDetails.vue'
+
+/**
+ * The component reads these at construction time (in data()), so the mock
+ * values must be in place before mount. `vi.hoisted` keeps them available to
+ * the factory mock below.
+ */
+const loadState = vi.hoisted(() => vi.fn((app: string, key: string, fallback: unknown) => fallback))
+const getTeamFolder = vi.hoisted(() => vi.fn<(teamId: string) => Promise<TeamFolder | null>>(async () => null))
+const upgradeTeamFolder = vi.hoisted(() => vi.fn<(teamId: string) => Promise<TeamFolder>>(async () => ({ id: 1, mountPoint: 'Team' })))
+
+vi.mock('@nextcloud/initial-state', () => ({ loadState }))
+vi.mock('@nextcloud/auth', () => ({
+	getCurrentUser: () => ({ uid: 'owner-1', isAdmin: false }),
+}))
+vi.mock('@nextcloud/router', async (importOriginal) => {
+	const actual = await importOriginal<typeof import('@nextcloud/router')>()
+	return {
+		...actual,
+		generateUrl: (tpl: string) => tpl,
+		generateOcsUrl: (tpl: string) => tpl,
+		generateRemoteUrl: (tpl: string) => tpl,
+	}
+})
+vi.mock('@nextcloud/axios', () => ({
+	default: {
+		get: vi.fn(async () => ({ data: { ocs: { data: { resources: [] } } } })),
+		post: vi.fn(async () => ({ data: { ocs: { data: {} } } })),
+		request: vi.fn(async () => ({ data: {} })),
+	},
+}))
+vi.mock('@nextcloud/dialogs', () => ({
+	FilePickerClosed: {},
+	FilePickerType: { Choose: 1 },
+	getFilePickerBuilder: () => ({
+		setMultiSelect: () => ({ setMimeTypeFilter: () => ({ setType: () => ({ allowDirectories: () => ({ build: () => ({}) }) }) }) }),
+	}),
+	showError: vi.fn(),
+	showSuccess: vi.fn(),
+}))
+vi.mock('@nextcloud/event-bus', () => ({ emit: vi.fn() }))
+vi.mock('../../api.ts', () => ({ getTeamFolder, upgradeTeamFolder }))
+
+/**
+ * Build a Circle instance with the fields the component under test needs.
+ *
+ * @param overrides - partial raw data merged over the defaults
+ */
+function makeCircle(overrides: Record<string, unknown> = {}): Circle {
+	return new Circle({
+		id: 'team-1',
+		displayName: 'Marketing',
+		description: '',
+		creation: 0,
+		population: 1,
+		populationInherited: 1,
+		config: 0,
+		settings: {},
+		owner: { singleId: 'owner-1', userId: 'owner-1', displayName: 'Owner', level: 9, type: 1, isUser: true, instance: '', source: '' },
+		initiator: { singleId: 'owner-1', userId: 'owner-1', displayName: 'Owner', level: 9, type: 1, isUser: true, instance: '', source: '' },
+		...overrides,
+	})
+}
+
+const MEMBER_INITIATOR = { singleId: 'm-1', userId: 'm-1', displayName: 'Member', level: 1, type: 1, isUser: true, instance: '', source: '' }
+
+/**
+ * Mount the component with owner-level permissions and explicit feature flags.
+ *
+ * @param overrides - circle raw-data overrides (e.g. initiator level)
+ * @param flags - feature flags for loadState + optional pre-linked team folder
+ */
+function mountDetails(
+	overrides: Record<string, unknown> = {},
+	flags: { autoCreate?: boolean; providerAvailable?: boolean; teamFolder?: TeamFolder | null } = {},
+) {
+	loadState.mockImplementation((app: string, key: string, fallback: unknown) => {
+		if (app !== 'circles') return fallback
+		if (key === 'teamFolderAutoCreate') return flags.autoCreate ?? true
+		if (key === 'teamFolderProviderAvailable') return flags.providerAvailable ?? true
+		return fallback
+	})
+	getTeamFolder.mockImplementation(async () => flags.teamFolder ?? null)
+	const circle = makeCircle(overrides)
+	return shallowMount(CircleDetails, {
+		props: { circle },
+		global: {
+			mocks: {
+				t: (pkg: string, text: string, vars?: Record<string, unknown>) => {
+					if (vars && typeof text === 'string') {
+						return text.replace(/\{(\w+)\}/g, (_, k: string) => String(vars[k] ?? `{${k}}`))
+					}
+					return text
+				},
+				$store: {
+					getters: { getCircle: () => null },
+					dispatch: vi.fn(),
+					commit: vi.fn(),
+				},
+				$router: { push: vi.fn(), resolve: () => ({ href: '#' }) },
+			},
+			stubs: {
+				// Render NcNoteCard and NcButton slot/text content so banner
+				// text is visible in the rendered HTML.
+				NcNoteCard: {
+					template: '<div class="nc-notecard-stub"><slot /></div>',
+				},
+				NcButton: {
+					template: '<button class="nc-button-stub"><slot /></button>',
+				},
+			},
+		},
+	})
+}
+
+describe('CircleDetails folder button', () => {
+	beforeEach(() => {
+		vi.clearAllMocks()
+	})
+
+	it('renders no folder button in the Create section (banner handles it)', () => {
+		const wrapper = mountDetails({}, { autoCreate: true, providerAvailable: true })
+		expect(wrapper.vm.folderButtonType).toBeNull()
+		// The Create section has Talk/Collective/Calendar buttons but no 'teamfolder'
+		const buttons = wrapper.findAllComponents({ name: 'TeamResourceButton' })
+		const ids = buttons.map((b) => b.props('resourceType')?.id)
+		expect(ids).not.toContain('teamfolder')
+		expect(ids).not.toContain('folder')
+	})
+
+	it('renders no folder button when a team folder already exists', async () => {
+		const wrapper = mountDetails({}, {
+			autoCreate: true,
+			providerAvailable: true,
+			teamFolder: { id: 42, mountPoint: 'Marketing' },
+		})
+		await vi.waitFor(() => expect(wrapper.vm.teamFolder).not.toBeNull())
+		expect(wrapper.vm.folderButtonType).toBeNull()
+	})
+})
+
+describe('CircleDetails team folder upgrade banner', () => {
+	beforeEach(() => {
+		vi.clearAllMocks()
+	})
+
+	it('renders the banner with create text for owners when provider is available', async () => {
+		const wrapper = mountDetails({}, { autoCreate: true, providerAvailable: true })
+		await vi.waitFor(() => expect(wrapper.vm.loadingTeamFolder).toBe(false))
+
+		expect(wrapper.vm.showTeamFolderBanner).toBe(true)
+		const html = wrapper.html()
+		expect(html).toContain('Create one to share files with the whole team.')
+		expect(html).toContain('Create team folder')
+	})
+
+	it('renders the banner with "ask owner" text for non-owners', async () => {
+		const wrapper = mountDetails({ initiator: MEMBER_INITIATOR }, { autoCreate: true, providerAvailable: true })
+		await vi.waitFor(() => expect(wrapper.vm.loadingTeamFolder).toBe(false))
+
+		const html = wrapper.html()
+		expect(html).toContain('Ask a team owner to create one.')
+		expect(html).not.toContain('Create team folder')
+	})
+
+	it('renders the banner with "ask admin" text when provider is missing', async () => {
+		const wrapper = mountDetails({}, { autoCreate: true, providerAvailable: false })
+		await vi.waitFor(() => expect(wrapper.vm.loadingTeamFolder).toBe(false))
+
+		const html = wrapper.html()
+		expect(html).toContain('Ask your administrator to enable the Team Folders app.')
+		expect(html).not.toContain('Create team folder')
+	})
+
+	it('hides the banner when a team folder exists', async () => {
+		const wrapper = mountDetails({}, {
+			autoCreate: true,
+			providerAvailable: true,
+			teamFolder: { id: 42, mountPoint: 'Marketing' },
+		})
+		await vi.waitFor(() => expect(wrapper.vm.teamFolder).not.toBeNull())
+
+		expect(wrapper.vm.showTeamFolderBanner).toBe(false)
+		const html = wrapper.html()
+		expect(html).not.toContain('This team does not have a team folder yet.')
+	})
+
+	it('hides the banner while loading', () => {
+		const wrapper = mountDetails({}, { autoCreate: true, providerAvailable: true })
+		// loadTeamFolder is in-flight; loadingTeamFolder is true
+		expect(wrapper.vm.loadingTeamFolder).toBe(true)
+		expect(wrapper.vm.showTeamFolderBanner).toBe(false)
+	})
+
+	it('shows the banner even when auto-create is off (owner can still create)', async () => {
+		const wrapper = mountDetails({}, { autoCreate: false, providerAvailable: true })
+		await vi.waitFor(() => expect(wrapper.vm.loadingTeamFolder).toBe(false))
+
+		const html = wrapper.html()
+		expect(html).toContain('Create one to share files with the whole team.')
+		expect(html).toContain('Create team folder')
+	})
+})