diff --git a/src/frontend/apps/impress/public/favicon.ico b/src/frontend/apps/impress/public/favicon.ico index d881a763..ce7bc2c5 100644 Binary files a/src/frontend/apps/impress/public/favicon.ico and b/src/frontend/apps/impress/public/favicon.ico differ diff --git a/src/frontend/apps/impress/src/components/DropdownMenu.tsx b/src/frontend/apps/impress/src/components/DropdownMenu.tsx index 82e80fc6..8c390c73 100644 --- a/src/frontend/apps/impress/src/components/DropdownMenu.tsx +++ b/src/frontend/apps/impress/src/components/DropdownMenu.tsx @@ -77,7 +77,7 @@ export const DropdownMenu = ({ {topMessage} )} - {options.map((option) => { + {options.map((option, index) => { if (option.show !== undefined && !option.show) { return; } @@ -104,6 +104,16 @@ export const DropdownMenu = ({ $gap={spacings['base']} $css={css` border: none; + ${index === 0 && + css` + border-top-left-radius: 4px; + border-top-right-radius: 4px; + `} + ${index === options.length - 1 && + css` + border-bottom-left-radius: 4px; + border-bottom-right-radius: 4px; + `} font-size: var(--c--theme--font--sizes--sm); color: var(--c--theme--colors--greyscale-1000); font-weight: 500; diff --git a/src/frontend/apps/impress/src/components/quick-search/QuickSearchStyle.tsx b/src/frontend/apps/impress/src/components/quick-search/QuickSearchStyle.tsx index 7738f2cb..27967b2f 100644 --- a/src/frontend/apps/impress/src/components/quick-search/QuickSearchStyle.tsx +++ b/src/frontend/apps/impress/src/components/quick-search/QuickSearchStyle.tsx @@ -71,8 +71,6 @@ export const QuickSearchStyle = createGlobalStyle` flex:1; overflow-y: auto; overscroll-behavior: contain; - transition: 100ms ease; - transition-property: height; } [cmdk-vercel-shortcuts] { diff --git a/src/frontend/apps/impress/src/cunningham/cunningham-style.css b/src/frontend/apps/impress/src/cunningham/cunningham-style.css index 4090f557..00d95617 100644 --- a/src/frontend/apps/impress/src/cunningham/cunningham-style.css +++ b/src/frontend/apps/impress/src/cunningham/cunningham-style.css @@ -545,8 +545,8 @@ input:-webkit-autofill:focus { color: var(--c--theme--colors--greyscale-600); } -.c__modal__footer { - margin-top: -1rem; +.c__modal__close .c__button { + padding: 0 !important; } .c__modal--full .c__modal__content { diff --git a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx index 08497bd2..8886562b 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-editor/components/BlockNoteEditor.tsx @@ -10,7 +10,7 @@ import * as Y from 'yjs'; import { Box, TextErrors } from '@/components'; import { useAuthStore } from '@/core/auth'; -import { Doc, Role, currentDocRole } from '@/features/docs/doc-management'; +import { Doc } from '@/features/docs/doc-management'; import { useUploadFile } from '../hook'; import { useHeadings } from '../hook/useHeadings'; @@ -167,23 +167,6 @@ export const BlockNoteEditor = ({ doc, provider }: BlockNoteEditorProps) => { ); useHeadings(editor); - /** - * With the collaboration it gets complicated to create the initial block - * better to let Blocknote manage, then we update the block with the content. - */ - useEffect(() => { - if (doc.content || currentDocRole(doc.abilities) !== Role.OWNER) { - return; - } - - setTimeout(() => { - editor.updateBlock(editor.document[0], { - type: 'heading', - content: '', - }); - }, 100); - }, [editor, doc.content, doc.abilities]); - useEffect(() => { setEditor(editor); diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx index 977fe3a8..f40e7248 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocHeader.tsx @@ -42,7 +42,7 @@ export const DocHeader = ({ doc }: DocHeaderProps) => { {docIsPublic && ( { border: 1px solid var(--c--theme--colors--primary-300, #e3e3fd); `} > - - {t('Public document')} + + + {t('Public document')} + )} diff --git a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx index 5e7765d4..2144fa12 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx @@ -212,6 +212,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => { $theme="primary" $padding={{ all: 'xs' }} $css={css` + border-radius: 4px; &:hover { background-color: ${colors['greyscale-100']}; } diff --git a/src/frontend/apps/impress/src/features/docs/doc-management/components/ModalRemoveDoc.tsx b/src/frontend/apps/impress/src/features/docs/doc-management/components/ModalRemoveDoc.tsx index 53a21997..6dab1516 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-management/components/ModalRemoveDoc.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-management/components/ModalRemoveDoc.tsx @@ -46,7 +46,6 @@ export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => { onClose()} rightActions={ <> @@ -72,17 +71,14 @@ export const ModalRemoveDoc = ({ onClose, doc }: ModalRemoveDocProps) => { } - size={ModalSize.SMALL} + size={ModalSize.MEDIUM} title={ {t('Delete a doc')} } > - + {!isError && ( {t('Are you sure you want to delete the document "{{title}}"?', { diff --git a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx index 4146db10..9a564f74 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/Heading.tsx @@ -65,7 +65,7 @@ export const Heading = ({ $width="100%" $padding={{ vertical: 'xtiny', left: leftPaddingMap[level] }} $variation={isActive ? '1000' : '700'} - $weight={isActive ? 'bold' : 'normal'} + $weight={isHighlight ? 'bold' : 'normal'} $css="overflow-wrap: break-word;" $hasTransition aria-selected={isHighlight} diff --git a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx index a0a397c5..4ad01fa0 100644 --- a/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx +++ b/src/frontend/apps/impress/src/features/docs/doc-table-content/components/TableContent.tsx @@ -78,7 +78,12 @@ export const TableContent = () => { setIsHover(false); }; - if (!editor) { + if ( + !editor || + !headings || + headings.length === 0 || + (headings.length === 1 && !headings[0].contentText) + ) { return null; } diff --git a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx index c51ca99b..a62c7e41 100644 --- a/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx +++ b/src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGrid.tsx @@ -1,4 +1,4 @@ -import { Button, Loader } from '@openfun/cunningham-react'; +import { Button } from '@openfun/cunningham-react'; import { useTranslation } from 'react-i18next'; import { InView } from 'react-intersection-observer'; import { css } from 'styled-components'; @@ -36,7 +36,7 @@ export const DocsGrid = ({ }), }); const loading = isFetching || isLoading; - + const hasDocs = data?.pages.some((page) => page.results.length > 0); const loadMore = (inView: boolean) => { if (!inView || loading) { return; @@ -63,7 +63,7 @@ export const DocsGrid = ({ overflow-y: auto; `} > - + - - - - - {t('Name')} - - - {isDesktop && ( - - - {t('Updated at')} - - - )} - - - - - {/* Body */} - {data?.pages.map((currentPage) => { - return currentPage.results.map((doc) => ( - - )); - })} - - - {loading && ( - - + {!hasDocs && ( + + + {t('No documents found')} + )} + {hasDocs && ( + + + + + {t('Name')} + + + {isDesktop && ( + + + {t('Updated at')} + + + )} + + + + + {/* Body */} + {data?.pages.map((currentPage) => { + return currentPage.results.map((doc) => ( + + )); + })} + + )} + {hasNextPage && !loading && ( { font-weight: ${isActive ? 700 : undefined}; &:hover { background-color: ${colors['greyscale-100']}; - font-weight: 700; } `} > diff --git a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelContent.tsx b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelContent.tsx index 2dd043b0..b621e1c5 100644 --- a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelContent.tsx +++ b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelContent.tsx @@ -22,7 +22,7 @@ export const LeftPanelContent = () => { flex: 0 0 auto; `} > - + diff --git a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelDocContent.tsx b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelDocContent.tsx index e2e615c1..d571b698 100644 --- a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelDocContent.tsx +++ b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelDocContent.tsx @@ -1,10 +1,14 @@ +import { css } from 'styled-components'; + import { Box, SeparatedSection } from '@/components'; +import { useCunninghamTheme } from '@/cunningham'; import { useDocStore } from '@/features/docs'; import { SimpleDocItem } from '@/features/docs/docs-grid/components/SimpleDocItem'; export const LeftPanelDocContent = () => { const { currentDoc } = useDocStore(); - + const { spacingsTokens } = useCunninghamTheme(); + const spacing = spacingsTokens(); if (!currentDoc) { return null; } @@ -17,7 +21,15 @@ export const LeftPanelDocContent = () => { > - + + + diff --git a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavoriteItem.tsx b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavoriteItem.tsx new file mode 100644 index 00000000..374e67c6 --- /dev/null +++ b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavoriteItem.tsx @@ -0,0 +1,52 @@ +import { useModal } from '@openfun/cunningham-react'; +import { css } from 'styled-components'; + +import { Box, StyledLink } from '@/components'; +import { useCunninghamTheme } from '@/cunningham'; +import { Doc, DocsGridActions, SimpleDocItem } from '@/features/docs'; +import { DocShareModal } from '@/features/docs/doc-share/component/DocShareModal'; +import { useResponsiveStore } from '@/stores'; + +type LeftPanelFavoriteItemProps = { + doc: Doc; +}; + +export const LeftPanelFavoriteItem = ({ doc }: LeftPanelFavoriteItemProps) => { + const shareModal = useModal(); + const { spacingsTokens } = useCunninghamTheme(); + const { isDesktop } = useResponsiveStore(); + const spacing = spacingsTokens(); + return ( + + + + +
+ +
+ {shareModal.isOpen && ( + + )} + + ); +}; diff --git a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavorites.tsx b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavorites.tsx index 3de5297e..8ab80bd7 100644 --- a/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavorites.tsx +++ b/src/frontend/apps/impress/src/features/left-panel/components/LeftPanelFavorites.tsx @@ -1,16 +1,11 @@ import { useTranslation } from 'react-i18next'; -import { css } from 'styled-components'; -import { - Box, - InfiniteScroll, - SeparatedSection, - StyledLink, - Text, -} from '@/components'; +import { Box, InfiniteScroll, Text } from '@/components'; +import { HorizontalSeparator } from '@/components/separators/HorizontalSeparator'; import { useCunninghamTheme } from '@/cunningham'; import { useInfiniteDocs } from '@/features/docs'; -import { SimpleDocItem } from '@/features/docs/docs-grid/components/SimpleDocItem'; + +import { LeftPanelFavoriteItem } from './LeftPanelFavoriteItem'; export const LeftPanelFavorites = () => { const { t } = useTranslation(); @@ -23,17 +18,18 @@ export const LeftPanelFavorites = () => { is_favorite: true, }); - const invitations = docs.data?.pages.flatMap((page) => page.results) || []; + const favoriteDocs = docs.data?.pages.flatMap((page) => page.results) || []; - if (invitations.length === 0) { + if (favoriteDocs.length === 0) { return null; } return ( - + + { isLoading={docs.isFetchingNextPage} next={() => void docs.fetchNextPage()} > - {invitations.map((doc) => ( - - - - - + {favoriteDocs.map((doc) => ( + ))} - + ); };