diff --git a/gradle/changelog/mdcontent.yaml b/gradle/changelog/mdcontent.yaml new file mode 100644 index 0000000000..55cf455185 --- /dev/null +++ b/gradle/changelog/mdcontent.yaml @@ -0,0 +1,2 @@ +- type: Fixed + description: Refetching of content on switching between source and md view ([#1823](https://github.com/scm-manager/scm-manager/pull/1823)) diff --git a/scm-ui/ui-api/package.json b/scm-ui/ui-api/package.json index f634777b0c..c72ad10b22 100644 --- a/scm-ui/ui-api/package.json +++ b/scm-ui/ui-api/package.json @@ -30,7 +30,7 @@ "gitdiff-parser": "^0.1.2", "query-string": "5", "react": "^17.0.1", - "react-query": "^3.12.2" + "react-query": "^3.25.1" }, "babel": { "presets": [ diff --git a/scm-ui/ui-webapp/src/repos/sources/components/content/MarkdownViewer.tsx b/scm-ui/ui-webapp/src/repos/sources/components/content/MarkdownViewer.tsx index 16db1487e9..3f06506c14 100644 --- a/scm-ui/ui-webapp/src/repos/sources/components/content/MarkdownViewer.tsx +++ b/scm-ui/ui-webapp/src/repos/sources/components/content/MarkdownViewer.tsx @@ -22,36 +22,18 @@ * SOFTWARE. */ import React, { FC } from "react"; -import { File } from "@scm-manager/ui-types"; -import { ErrorNotification, Loading, MarkdownView } from "@scm-manager/ui-components"; -import replaceBranchWithRevision from "../../ReplaceBranchWithRevision"; -import { useLocation } from "react-router-dom"; -import { useFileContent } from "@scm-manager/ui-api"; +import { MarkdownView } from "@scm-manager/ui-components"; type Props = { - file: File; + content: string; + permalink: string; basePath: string; }; -const MarkdownViewer: FC = ({ file, basePath }) => { - const { isLoading, error, data: content } = useFileContent(file); - const location = useLocation(); - - if (!content || isLoading) { - return ; - } - - if (error) { - return ; - } - - const permalink = replaceBranchWithRevision(location.pathname, file.revision); - - return ( -
- -
- ); -}; +const MarkdownViewer: FC = ({ content, basePath, permalink }) => ( +
+ +
+); export default MarkdownViewer; diff --git a/scm-ui/ui-webapp/src/repos/sources/components/content/SwitchableMarkdownViewer.tsx b/scm-ui/ui-webapp/src/repos/sources/components/content/SwitchableMarkdownViewer.tsx index 7d417b8ab2..d4c46b62c3 100644 --- a/scm-ui/ui-webapp/src/repos/sources/components/content/SwitchableMarkdownViewer.tsx +++ b/scm-ui/ui-webapp/src/repos/sources/components/content/SwitchableMarkdownViewer.tsx @@ -24,10 +24,12 @@ import React, { FC, useState } from "react"; import styled from "styled-components"; import MarkdownViewer from "./MarkdownViewer"; -import SourcecodeViewer from "./SourcecodeViewer"; import { File } from "@scm-manager/ui-types"; -import { Button } from "@scm-manager/ui-components"; +import { Button, ErrorNotification, Loading, SyntaxHighlighter } from "@scm-manager/ui-components"; import { useTranslation } from "react-i18next"; +import { useFileContent } from "@scm-manager/ui-api"; +import replaceBranchWithRevision from "../../ReplaceBranchWithRevision"; +import { useLocation } from "react-router-dom"; const ToggleButton = styled(Button)` max-width: 1rem; @@ -43,13 +45,24 @@ type Props = { }; const SwitchableMarkdownViewer: FC = ({ file, basePath }) => { + const { isLoading, error, data: content } = useFileContent(file); const { t } = useTranslation("repos"); + const location = useLocation(); const [renderMarkdown, setRenderMarkdown] = useState(true); const toggleMarkdown = () => { setRenderMarkdown(!renderMarkdown); }; + if (isLoading) { + return ; + } + if (error) { + return ; + } + + const permalink = replaceBranchWithRevision(location.pathname, file.revision); + return (
= ({ file, basePath }) => { {renderMarkdown ? ( - + ) : ( - + )}
); diff --git a/yarn.lock b/yarn.lock index 29bb625031..a243b19aeb 100644 --- a/yarn.lock +++ b/yarn.lock @@ -16437,10 +16437,10 @@ react-popper@^2.2.4: react-fast-compare "^3.0.1" warning "^4.0.2" -react-query@^3.12.2: - version "3.16.0" - resolved "https://registry.yarnpkg.com/react-query/-/react-query-3.16.0.tgz#8de1556aabb3d200d0f8eeb74ce2b0b3dd0a0a51" - integrity sha512-YOvI8mO9WG+r4XsyJinjlDMiV5IewUWUcTv2J7z6bIP3KOFvgT6k6HM8vQouz4hPnme7Ktq9j5e7LarUqgJXFQ== +react-query@^3.25.1: + version "3.25.1" + resolved "https://registry.yarnpkg.com/react-query/-/react-query-3.25.1.tgz#221ff17406518a7689378dcbbdc986b0ba2c3919" + integrity sha512-tGZkap921d9dJD2F8+NpEu3djLRP+tpZKHKhQvqUMYMfWT5R18iRtGAG5ZeUMlRKuhzNaZx3cHiYj3DsyZ1SWw== dependencies: "@babel/runtime" "^7.5.5" broadcast-channel "^3.4.1" @@ -20060,8 +20060,10 @@ watchpack@^1.7.4: resolved "https://registry.yarnpkg.com/watchpack/-/watchpack-1.7.5.tgz#1267e6c55e0b9b5be44c2023aed5437a2c26c453" integrity sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ== dependencies: + chokidar "^3.4.1" graceful-fs "^4.1.2" neo-async "^2.5.0" + watchpack-chokidar2 "^2.0.1" optionalDependencies: chokidar "^3.4.1" watchpack-chokidar2 "^2.0.1"