fixup! ♻️(frontend) refactor DocSearchModalGlobal

Signed-off-by: charles <charles.englebert@protonmail.com>

Author: mascarpon3

src/frontend/apps/impress/src/features/docs/doc-editor/components/custom-inline-content/Interlinking/SearchPage.tsx

@@ -9,7 +9,15 @@ import { useEffect, useRef, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { css } from 'styled-components';
 
-import { Box, Card, QuickSearch, QuickSearchGroup, Text } from '@/components';
+import {
+  Box,
+  Card,
+  Icon,
+  QuickSearch,
+  QuickSearchGroup,
+  QuickSearchItemContent,
+  Text,
+} from '@/components';
 import { useCunninghamTheme } from '@/cunningham';
 import {
   DocsBlockSchema,
@@ -19,6 +27,7 @@ import {
 import AddPageIcon from '@/docs/doc-editor/assets/doc-plus.svg';
 import {
   Doc,
+  getEmojiAndTitle,
   useCreateChildDocTree,
   useDocStore,
   useTrans,
@@ -61,6 +70,10 @@ type SearchPageProps = {
   contentRef: (node: HTMLElement | null) => void;
 };
 
+function FoundPageIcon(props: { width: string; style: { maxHeight: string } }) {
+  return null;
+}
+
 export const SearchPage = ({
   contentRef,
   trigger,
@@ -250,6 +263,52 @@ export const SearchPage = ({
 
                 editor.focus();
               }}
+              renderSearchElement={(doc) => {
+                const { emoji, titleWithoutEmoji } = getEmojiAndTitle(
+                  doc.title || untitledDocument,
+                );
+
+                return (
+                  <QuickSearchItemContent
+                    left={
+                      <Box
+                        $direction="row"
+                        $gap="0.2rem"
+                        $align="center"
+                        $padding={{ vertical: '0.5rem', horizontal: '0.2rem' }}
+                        $width="100%"
+                      >
+                        <Box
+                          $css={css`
+                            width: 24px;
+                            flex-shrink: 0;
+                          `}
+                        >
+                          {emoji ? (
+                            <Text $size="18px">{emoji}</Text>
+                          ) : (
+                            <FoundPageIcon
+                              width="100%"
+                              style={{ maxHeight: '24px' }}
+                            />
+                          )}
+                        </Box>
+
+                        <Text
+                          $size="sm"
+                          $color="var(--c--globals--colors--gray-1000)"
+                          spellCheck="false"
+                        >
+                          {titleWithoutEmoji}
+                        </Text>
+                      </Box>
+                    }
+                    right={
+                      <Icon iconName="keyboard_return" spellCheck="false" />
+                    }
+                  />
+                );
+              }}
             />
             <QuickSearchGroup
               group={{