✨(frontend) add doc editor panel header

Add doc editor panel header to show
the doc title and other info.

src/frontend/apps/e2e/__tests__/app-impress/doc-header.spec.ts

@@ -0,0 +1,80 @@
+import { expect, test } from '@playwright/test';
+
+import { goToGridDoc } from './common';
+
+test.beforeEach(async ({ page }) => {
+  await page.goto('/');
+});
+
+test.describe('Doc Header', () => {
+  test('it checks the element are correctly displayed', async ({ page }) => {
+    await page.route('**/documents/**/', async (route) => {
+      const request = route.request();
+      if (
+        request.method().includes('GET') &&
+        !request.url().includes('page=')
+      ) {
+        await route.fulfill({
+          json: {
+            id: 'b0df4343-c8bd-4c20-9ff6-fbf94fc94egg',
+            content: '',
+            title: 'Mocked document',
+            accesses: [
+              {
+                id: 'b0df4343-c8bd-4c20-9ff6-fbf94fc94egg',
+                role: 'owner',
+                user: {
+                  email: 'super@owner.com',
+                },
+              },
+              {
+                id: 'b0df4343-c8bd-4c20-9ff6-fbf94fc94egg',
+                role: 'admin',
+                user: {
+                  email: 'super@admin.com',
+                },
+              },
+              {
+                id: 'b0df4343-c8bd-4c20-9ff6-fbf94fc94egg',
+                role: 'owner',
+                user: {
+                  email: 'super2@owner.com',
+                },
+              },
+            ],
+            abilities: {
+              destroy: true, // Means owner
+              versions_destroy: true,
+              versions_list: true,
+              versions_retrieve: true,
+              manage_accesses: true,
+              update: true,
+              partial_update: true,
+              retrieve: true,
+            },
+            is_public: true,
+            created_at: '2021-09-01T09:00:00Z',
+          },
+        });
+      } else {
+        await route.continue();
+      }
+    });
+
+    await goToGridDoc(page);
+
+    const card = page.getByLabel(
+      'It is the card information about the document.',
+    );
+    await expect(card.locator('a').getByText('home')).toBeVisible();
+    await expect(card.locator('h2').getByText('Mocked document')).toBeVisible();
+    await expect(card.getByText('Public')).toBeVisible();
+    await expect(
+      card.getByText('Created at 09/01/2021, 11:00 AM'),
+    ).toBeVisible();
+    await expect(
+      card.getByText('Owners: super@owner.com / super2@owner.com'),
+    ).toBeVisible();
+    await expect(card.getByText('Your role: Owner')).toBeVisible();
+  });
+});

src/frontend/apps/e2e/playwright.config.ts

@@ -48,6 +48,7 @@ export default defineConfig({
       use: {
         ...devices['Desktop Chrome'],
         locale: 'en-US',
+        timezoneId: 'Europe/Paris',
         storageState: 'playwright/.auth/user-chromium.json',
       },
       dependencies: ['setup'],
@@ -57,6 +58,7 @@ export default defineConfig({
       use: {
         ...devices['Desktop Safari'],
         locale: 'en-US',
+        timezoneId: 'Europe/Paris',
         storageState: 'playwright/.auth/user-webkit.json',
       },
       dependencies: ['setup'],