snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/views/omnichannel/departments/DepartmentsPage.tsx

@@ -0,0 +1,63 @@
+import { Tabs, TabsItem, Button } from '@rocket.chat/fuselage';
+import { useStableCallback } from '@rocket.chat/fuselage-hooks';
+import { Page, PageHeader, PageContent } from '@rocket.chat/ui-client';
+import { useRoute, useTranslation, useRouteParameter } from '@rocket.chat/ui-contexts';
+
+import DepartmentsTable from './DepartmentsTable';
+import EditDepartmentWithData from './EditDepartmentWithData';
+import NewDepartment from './NewDepartment';
+
+const DepartmentsPage = () => {
+	const t = useTranslation();
+	const departmentsRoute = useRoute('omnichannel-departments');
+
+	const context = useRouteParameter('context');
+	const id = useRouteParameter('id');
+
+	const handleTabClick = useStableCallback((tab: undefined | 'archived') =>
+		departmentsRoute.push(
+			tab
+				? {
+						context: tab,
+					}
+				: {},
+		),
+	);
+
+	const onAddNew = useStableCallback(() =>
+		departmentsRoute.push({
+			context: 'new',
+		}),
+	);
+
+	if (context === 'new') {
+		return <NewDepartment id={id} />;
+	}
+
+	if (context === 'edit') {
+		return <EditDepartmentWithData id={id} title={t('Edit_Department')} />;
+	}
+
+	return (
+		<Page flexDirection='row'>
+			<Page>
+				<PageHeader title={t('Departments')}>
+					<Button onClick={onAddNew}>{t('Create_department')}</Button>
+				</PageHeader>
+				<Tabs>
+					<TabsItem key='departments' selected={!context} onClick={() => handleTabClick(undefined)}>
+						{t('All')}
+					</TabsItem>
+					<TabsItem key='archived' selected={context === 'archived'} onClick={() => handleTabClick('archived')}>
+						{t('Archived')}
+					</TabsItem>
+				</Tabs>
+				<PageContent>
+					<DepartmentsTable archived={context === 'archived'} />
+				</PageContent>
+			</Page>
+		</Page>
+	);
+};
+
+export default DepartmentsPage;