From daf3f2b82b90c787c2730f7d5388eec45fad8ba6 Mon Sep 17 00:00:00 2001 From: Thomas Parisot Date: Thu, 5 Dec 2024 16:18:11 +0100 Subject: [PATCH 1/2] =?UTF-8?q?fix(front):=20possibilit=C3=A9=20de=20compa?= =?UTF-8?q?rer=20entre=20working=20copy=20et=20versions?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- front/src/components/Write/Versions.jsx | 140 +++++++++++++----- front/src/components/Write/Write.graphql | 10 +- .../Write/bibliographe/CitationsPanel.jsx | 3 - .../Write/providers/monaco/DiffEditor.jsx | 4 +- .../Write/providers/monaco/Editor.jsx | 10 +- .../src/components/Write/versions.module.scss | 9 +- front/src/components/article.module.scss | 5 +- front/src/index.jsx | 4 +- 8 files changed, 132 insertions(+), 53 deletions(-) diff --git a/front/src/components/Write/Versions.jsx b/front/src/components/Write/Versions.jsx index 0d9092053..8590b412d 100644 --- a/front/src/components/Write/Versions.jsx +++ b/front/src/components/Write/Versions.jsx @@ -1,8 +1,9 @@ -import React, { useCallback, useState } from 'react' +import React, { useCallback, useMemo, useState } from 'react' import PropTypes from 'prop-types' import { useTranslation } from 'react-i18next' import { Link } from 'react-router-dom' import { shallowEqual, useDispatch, useSelector } from 'react-redux' +import { useLocation } from 'react-router-dom' import { ArrowLeft, Check, ChevronDown, ChevronRight, Edit3 } from 'react-feather' import TimeAgo from '../TimeAgo.jsx' @@ -22,14 +23,20 @@ import clsx from 'clsx' function Version ({ articleId, compareTo, readOnly, selectedVersion, v }) { const { t } = useTranslation() - const className = clsx({ - [styles.selected]: v._id === selectedVersion, - [styles.compareTo]: v._id === compareTo - }) const articleVersionId = v._id - const versionPart = selectedVersion ? `version/${selectedVersion}/` : '' - const compareLink = `/article/${articleId}/${versionPart}compare/${v._id}` + + const isComparing = useMemo(() => compareTo || selectedVersion, [compareTo, selectedVersion]) + const isSelected = useMemo(() => articleVersionId === selectedVersion, [articleVersionId, selectedVersion]) + const versionPart = useMemo(() => selectedVersion ? `version/${selectedVersion}/` : '', [selectedVersion]) + const compareLink = useMemo(() => `/article/${articleId}/${versionPart}compare/${articleVersionId}`, [articleId, versionPart, articleVersionId]) + const canCompare = useMemo(() => ![compareTo, selectedVersion].includes(articleVersionId), [compareTo, selectedVersion, articleVersionId]) + const canStopCompare = useMemo(() => isComparing && compareTo && articleVersionId === compareTo, [compareTo, articleVersionId]) + + const className = clsx({ + [styles.selected]: isSelected, + [styles.compareTo]: isComparing && articleVersionId === compareTo + }) const runQuery = useGraphQL() const [renaming, setRenaming] = useState(false) @@ -48,6 +55,7 @@ function Version ({ articleId, compareTo, readOnly, selectedVersion, v }) { }, [title]) return
  • {renaming && (
    @@ -92,28 +100,25 @@ function Version ({ articleId, compareTo, readOnly, selectedVersion, v }) {

    } - {!renaming && selectedVersion &&
      - {![compareTo, selectedVersion].includes(v._id) && ( -
    • - - {t('write.compareVersion.button')} - -
      • - )} - {v._id === compareTo && ( -
    • - - {t('write.stopCompareVersion.button')} - -
      • - )} -
    } + +
      + + +
    • } @@ -125,6 +130,67 @@ Version.propTypes = { readOnly: PropTypes.bool, } +export function WorkingVersion ({ articleId, selectedVersion = null, compareTo = null, readOnly }) { + const updatedAt = useSelector(state => state.workingArticle.updatedAt) + const { t } = useTranslation() + const { pathname } = useLocation() + + const articleVersionId = null + const isComparing = useMemo(() => pathname.includes('/compare'), [pathname]) + + const isSelected = useMemo(() => articleVersionId === selectedVersion, [articleVersionId, selectedVersion]) + const compareLink = useMemo(() => selectedVersion ? `/article/${articleId}/version/${selectedVersion}/compare/working-copy` : `/article/${articleId}/compare/${selectedVersion}`, [articleId, selectedVersion, articleVersionId]) + const canCompare = useMemo(() => isComparing ? ![compareTo, selectedVersion].includes(articleVersionId) : selectedVersion, [isComparing, compareTo, selectedVersion, articleVersionId]) + const canStopCompare = useMemo(() => isComparing && compareTo === articleVersionId, [isComparing, isSelected]) + + const className = clsx({ + [styles.selected]: isSelected, + [styles.compareTo]: isComparing && articleVersionId === compareTo + }) + + return
  • + +
    + + {t('workingVersion.spanWorkingCopy.text')} + +
    + +

    + + + +

    + + + +
    • +} + +WorkingVersion.propTypes = { + articleId: PropTypes.string.isRequired, + selectedVersion: PropTypes.string, + compareTo: PropTypes.string, + readOnly: PropTypes.bool, +} + export default function Versions ({ article, selectedVersion, compareTo, readOnly }) { const articleVersions = useSelector(state => state.articleVersions, shallowEqual) const expand = useSelector(state => state.articlePreferences.expandVersions) @@ -168,13 +234,19 @@ export default function Versions ({ article, selectedVersion, compareTo, readOnl

    )} diff --git a/front/src/components/Write/Write.graphql b/front/src/components/Write/Write.graphql index 332a71add..8fd7b3f83 100644 --- a/front/src/components/Write/Write.graphql +++ b/front/src/components/Write/Write.graphql @@ -1,8 +1,14 @@ -query compareVersion ($to: ID!) { - version(version: $to) { +query compareVersion ($to: ID!, $article: ID!, $hasVersion: Boolean!) { + version(version: $to) @include(if: $hasVersion) { _id md } + + article (article: $article) { + workingVersion @skip(if: $hasVersion) { + md + } + } } query renameVersion ($version: ID!, $name: String) { diff --git a/front/src/components/Write/bibliographe/CitationsPanel.jsx b/front/src/components/Write/bibliographe/CitationsPanel.jsx index 1dc9e611d..561fbeeae 100644 --- a/front/src/components/Write/bibliographe/CitationsPanel.jsx +++ b/front/src/components/Write/bibliographe/CitationsPanel.jsx @@ -58,9 +58,6 @@ export default function CitationsPanel ({ onChange }) { const handleChanges = useCallback(() => onChange(bib), [bib]) - console.log({ isValid, isEmpty}) - console.log(citationValidationResult) - return (
    { - runQuery({ query, variables: { to: compareTo } }) - .then(({ version }) => setModifiedText(version.md)) + runQuery({ query, variables: { article: articleId, to: compareTo ?? 'working-copy', hasVersion: Boolean(compareTo) } }) + .then(({ article, version }) => setModifiedText(version?.md ?? article.workingVersion?.md)) }, [compareTo]) const monacoOptions = useMemo(() => ({ diff --git a/front/src/components/Write/providers/monaco/Editor.jsx b/front/src/components/Write/providers/monaco/Editor.jsx index e4f75627e..3e3b99831 100644 --- a/front/src/components/Write/providers/monaco/Editor.jsx +++ b/front/src/components/Write/providers/monaco/Editor.jsx @@ -1,4 +1,5 @@ -import React from 'react' +import React, { useMemo } from 'react' +import { useLocation } from 'react-router-dom' import MonacoTextEditor from './TextEditor' import MonacoDiffEditor from './DiffEditor' @@ -12,14 +13,17 @@ export default function Editor ({ readOnly, onTextUpdate, }) { + const location = useLocation() + const isComparing = useMemo(() => location.pathname.includes('/compare'), [location.pathname, compareTo]) + return ( <> - {!compareTo && } - {compareTo && header { max-width: 265px; diff --git a/front/src/components/article.module.scss b/front/src/components/article.module.scss index f16a5733f..1b78983d4 100644 --- a/front/src/components/article.module.scss +++ b/front/src/components/article.module.scss @@ -130,9 +130,12 @@ display: inline-flex; } +.author { + margin-right: 0.5em; +} + .momentsAgo { opacity: .5; - margin-left: .5em; } .workspaces { diff --git a/front/src/index.jsx b/front/src/index.jsx index 4d10d00e8..3f88bd932 100644 --- a/front/src/index.jsx +++ b/front/src/index.jsx @@ -158,8 +158,8 @@ root.render( {/* Write and Compare */} - + path={[`/article/:id/compare/:compareTo`, `/article/:id/version/:version/compare/working-copy`, `/article/:id/version/:version/compare/:compareTo`]} exact> + {/* Write with a given version */} From 4cac3110f8097f9be6f04a40982b1f62aa856bf5 Mon Sep 17 00:00:00 2001 From: Thomas Parisot Date: Thu, 5 Dec 2024 16:18:28 +0100 Subject: [PATCH 2/2] fix: suppression d'un console.log() --- export/src/export.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/export/src/export.js b/export/src/export.js index faa59d0d2..37f6e43f0 100644 --- a/export/src/export.js +++ b/export/src/export.js @@ -91,7 +91,7 @@ const getArticleExportContext = async (articleId) => { const getBookExportContext = async (bookId) => { const book = await getCorpusById(bookId) - console.log({book}) + const { articles: chapters, _id: id, name: title } = book // we can create empty books… but no need to preview them