🩹(frontend) do not display emoji as page icon on main pages

We decided to not display the leading emoji
as page icon on the main pages to keep consistency
in the document list.
This commit is contained in:
Olivier Laurendeau
2025-09-15 12:34:38 +02:00
committed by Anthony LC
parent 8b73aa3644
commit 294922f966
3 changed files with 29 additions and 43 deletions

View File

@@ -8,7 +8,7 @@ import {
verifyDocName,
} from './utils-common';
import { mockedAccesses, mockedInvitations } from './utils-share';
import { createRootSubPage } from './utils-sub-pages';
import { createRootSubPage, getTreeRow } from './utils-sub-pages';
test.beforeEach(async ({ page }) => {
await page.goto('/');
@@ -73,17 +73,8 @@ test.describe('Doc Header', () => {
await verifyDocName(page, '👍 Hello Emoji World');
// Check the tree
const docTree = page.getByTestId('doc-tree');
await expect(docTree.getByText('Hello Emoji World')).toBeVisible();
await expect(docTree.getByTestId('doc-emoji-icon')).toBeVisible();
await expect(docTree.getByTestId('doc-simple-icon')).toBeHidden();
await page.getByTestId('home-button').click();
// Check the documents grid
const gridRow = await getGridRow(page, 'Hello Emoji World');
await expect(gridRow.getByTestId('doc-emoji-icon')).toBeVisible();
await expect(gridRow.getByTestId('doc-simple-icon')).toBeHidden();
const row = await getTreeRow(page, 'Hello Emoji World');
await expect(row.getByText('👍')).toBeVisible();
});
test('it deletes the doc', async ({ page, browserName }) => {

View File

@@ -107,6 +107,20 @@ export const addChild = async ({
return name;
};
export const getTreeRow = async (page: Page, title: string) => {
const docTree = page.getByTestId('doc-tree');
const row = docTree
.getByRole('treeitem')
.filter({
hasText: title,
})
.first();
await expect(row).toBeVisible();
return row;
};
export const navigateToTopParentFromTree = async ({ page }: { page: Page }) => {
await page.getByRole('link', { name: /Open root document/ }).click();
};

View File

@@ -4,20 +4,13 @@ import { css } from 'styled-components';
import { Box, Text } from '@/components';
import { useCunninghamTheme } from '@/cunningham';
import {
Doc,
getEmojiAndTitle,
useDocUtils,
useTrans,
} from '@/docs/doc-management';
import { Doc, useDocUtils, useTrans } from '@/docs/doc-management';
import { useResponsiveStore } from '@/stores';
import ChildDocument from '../assets/child-document.svg';
import PinnedDocumentIcon from '../assets/pinned-document.svg';
import SimpleFileIcon from '../assets/simple-document.svg';
import { DocIcon } from './DocIcon';
const ItemTextCss = css`
overflow: hidden;
text-overflow: ellipsis;
@@ -45,10 +38,6 @@ export const SimpleDocItem = ({
const { untitledDocument } = useTrans();
const { isChild } = useDocUtils(doc);
const { emoji, titleWithoutEmoji: displayTitle } = getEmojiAndTitle(
doc.title || untitledDocument,
);
return (
<Box
$direction="row"
@@ -76,25 +65,17 @@ export const SimpleDocItem = ({
data-testid="doc-pinned-icon"
color={colorsTokens['primary-500']}
/>
) : isChild ? (
<ChildDocument
aria-hidden="true"
data-testid="doc-child-icon"
color={colorsTokens['primary-500']}
/>
) : (
<DocIcon
emoji={emoji}
defaultIcon={
isChild ? (
<ChildDocument
aria-hidden="true"
data-testid="doc-child-icon"
color={colorsTokens['primary-500']}
/>
) : (
<SimpleFileIcon
aria-hidden="true"
data-testid="doc-simple-icon"
color={colorsTokens['primary-500']}
/>
)
}
$size="25px"
<SimpleFileIcon
aria-hidden="true"
data-testid="doc-simple-icon"
color={colorsTokens['primary-500']}
/>
)}
</Box>
@@ -106,7 +87,7 @@ export const SimpleDocItem = ({
$css={ItemTextCss}
data-testid="doc-title"
>
{displayTitle}
{doc.title || untitledDocument}
</Text>
{(!isDesktop || showAccesses) && (
<Box