diff --git a/CHANGELOG.md b/CHANGELOG.md
index b1961069..0f771d60 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -13,6 +13,7 @@ and this project adheres to
- ✨(ci) add security scan #291
- ✨(frontend) Activate versions feature #240
+- ✨(frontend) one-click document creation #275
## Changed
diff --git a/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts b/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts
index 6fab7777..f0fcd335 100644
--- a/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts
+++ b/src/frontend/apps/e2e/__tests__/app-impress/doc-create.spec.ts
@@ -7,48 +7,12 @@ test.beforeEach(async ({ page }) => {
});
test.describe('Doc Create', () => {
- test('checks all the create doc elements are visible', async ({ page }) => {
- const buttonCreateHomepage = page.getByRole('button', {
- name: 'Create a new document',
- });
- await buttonCreateHomepage.click();
- await expect(buttonCreateHomepage).toBeHidden();
-
- const card = page.getByRole('dialog').first();
-
- await expect(
- card.locator('h2').getByText('Create a new document'),
- ).toBeVisible();
- await expect(card.getByLabel('Document name')).toBeVisible();
-
- await expect(
- card.getByRole('button', {
- name: 'Create the document',
- }),
- ).toBeVisible();
-
- await expect(card.getByLabel('Close the modal')).toBeVisible();
- });
-
- test('checks the cancel button interaction', async ({ page }) => {
- const buttonCreateHomepage = page.getByRole('button', {
- name: 'Create a new document',
- });
- await buttonCreateHomepage.click();
- await expect(buttonCreateHomepage).toBeHidden();
-
- const card = page.getByRole('dialog').first();
-
- await card.getByLabel('Close the modal').click();
-
- await expect(buttonCreateHomepage).toBeVisible();
- });
-
test('it creates a doc', async ({ page, browserName }) => {
const [docTitle] = await createDoc(page, 'My new doc', browserName, 1);
- expect(await page.locator('title').textContent()).toMatch(
- /My new doc - Docs/,
+ await page.waitForFunction(
+ () => document.title.match(/My new doc - Docs/),
+ { timeout: 5000 },
);
const header = page.locator('header').first();
@@ -59,7 +23,8 @@ test.describe('Doc Create', () => {
.getByRole('table');
await expect(datagrid.getByLabel('Loading data')).toBeHidden();
-
- await expect(datagrid.getByText(docTitle)).toBeVisible();
+ await expect(datagrid.getByText(docTitle)).toBeVisible({
+ timeout: 5000,
+ });
});
});
diff --git a/src/frontend/apps/impress/src/__tests__/pages.test.tsx b/src/frontend/apps/impress/src/__tests__/pages.test.tsx
index 140932bc..60d1e1ea 100644
--- a/src/frontend/apps/impress/src/__tests__/pages.test.tsx
+++ b/src/frontend/apps/impress/src/__tests__/pages.test.tsx
@@ -5,6 +5,14 @@ import { AppWrapper } from '@/tests/utils';
import Page from '../pages';
+jest.mock('next/navigation', () => ({
+ useRouter() {
+ return {
+ push: jest.fn(),
+ };
+ },
+}));
+
describe('Page', () => {
it('checks Page rendering', () => {
render(, { wrapper: AppWrapper });
diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/api/index.ts b/src/frontend/apps/impress/src/features/docs/doc-management/api/index.ts
index 8860f7da..5cf42cd7 100644
--- a/src/frontend/apps/impress/src/features/docs/doc-management/api/index.ts
+++ b/src/frontend/apps/impress/src/features/docs/doc-management/api/index.ts
@@ -1,3 +1,4 @@
+export * from './useCreateDoc';
export * from './useDoc';
export * from './useDocs';
export * from './useUpdateDoc';
diff --git a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridContainer.tsx b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridContainer.tsx
index 880f5652..a3534dc2 100644
--- a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridContainer.tsx
+++ b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridContainer.tsx
@@ -1,33 +1,34 @@
import { Button } from '@openfun/cunningham-react';
-import React, { useState } from 'react';
+import { useRouter } from 'next/navigation';
+import React from 'react';
import { useTranslation } from 'react-i18next';
-import { Box, Card } from '@/components';
-import { ModalCreateDoc } from '@/features/docs/doc-management';
+import { Box } from '@/components';
+import { useCreateDoc, useTrans } from '@/features/docs/doc-management/';
import { DocsGrid } from './DocsGrid';
export const DocsGridContainer = () => {
const { t } = useTranslation();
- const [isModalCreateOpen, setIsModalCreateOpen] = useState(false);
+ const { untitledDocument } = useTrans();
+ const router = useRouter();
+
+ const { mutate: createDoc } = useCreateDoc({
+ onSuccess: (doc) => {
+ router.push(`/docs/${doc.id}`);
+ },
+ });
+
+ const handleCreateDoc = () => {
+ createDoc({ title: untitledDocument });
+ };
return (
-
-
-
-
-
+
+
+
- {isModalCreateOpen && (
- setIsModalCreateOpen(false)} />
- )}
);
};