Skip to content

Commit

Permalink
fix: Markdown README issues (#507)
Browse files Browse the repository at this point in the history
  • Loading branch information
dogmar authored Aug 10, 2023
1 parent 3260636 commit b42fae6
Show file tree
Hide file tree
Showing 2 changed files with 63 additions and 8 deletions.
46 changes: 40 additions & 6 deletions src/components/Markdown.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,8 @@ import ReactMarkdown from 'react-markdown'
import rehypeRaw from 'rehype-raw'
import styled from 'styled-components'

import { isExternalUrl, removeTrailingSlashes } from '../utils/urls'

import MultilineCode from './Code'
import InlineCode from './InlineCode'

Expand Down Expand Up @@ -42,8 +44,10 @@ function getLastStringChild(children: any, depth = 0): any {
function MarkdownPreformatted({ children, ...props }: any) {
let lang

if (children.props?.className?.startsWith('lang-')) {
lang = children.props.className.slice(5)
const className = children?.[0]?.props?.className

if (className && typeof className === 'string') {
lang = /language-(\w+)/.exec(className)?.[1] || ''
}
const stringChild = getLastStringChild(children) || ''

Expand Down Expand Up @@ -170,9 +174,9 @@ function MarkdownImage({
...props
}: any) {
// Convert local image paths to full path on github
// Only works if primary git branch is named "master"
if (gitUrl && src && !src.match(/^https*/)) {
src = `${gitUrl}/raw/${mainBranch}/${src}`
if (gitUrl && src && !isExternalUrl(src)) {
src = src.replace(/^\//, '')
src = `${removeTrailingSlashes(gitUrl)}/raw/${mainBranch}/${src}`
}

return (
Expand All @@ -186,6 +190,33 @@ function MarkdownImage({
)
}

function MarkdownLink({
href,
gitUrl,
mainBranch,
...props
}: {
href: string
gitUrl: string
mainBranch: string
}) {
// Convert local readme hrefs to full path on github
if (gitUrl && href && !isExternalUrl(href)) {
// Remove potential starting slash
href = href.replace(/^\//, '')
href = `${removeTrailingSlashes(gitUrl)}/blob/${mainBranch}/${href}`
}

return (
<MdA
{...props}
target="_blank"
rel="noopener noreferrer"
href={href}
/>
)
}

function Markdown({ text, gitUrl, mainBranch }: MarkdownProps) {
return useMemo(
() => (
Expand All @@ -208,7 +239,10 @@ function Markdown({ text, gitUrl, mainBranch }: MarkdownProps) {
}),
p: render({ component: MdP }),
div: render({ component: MdDiv }),
a: render({ component: MdA, props: { target: '_blank' } }),
a: render({
component: MarkdownLink,
props: { gitUrl, mainBranch },
}),
span: render({ component: MdSpan }),
code: render({ component: InlineCode }),
pre: render({
Expand Down
25 changes: 23 additions & 2 deletions src/stories/Markdown.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ const markdown = `# Plural Console
</div>
</div>
![Console](/assets/public/PluralConsole-background.png)
# H1 - Some un-ordered lists
* Reception of over-the-air application updates
Expand Down Expand Up @@ -47,14 +49,33 @@ Lorem <i>italic</i> dolor sit <em>em</em>, consectetur adipiscing elit, sed do e
> Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
###### H6 - A code block
###### H6 - A code block without a language
\`\`\`sh
\`\`\`
brew install erlang@23
cp -r /opt/homebrew/opt/erlang@23/lib/erlang ~/.asdf/installs/erlang/23.1.5
asdf reshim erlang 23.1.5
\`\`\`
###### H6 - A code block with a language
\`\`\`javascript
function sum(x,y) {
return x + y;
}
const num1 = 12;
const num2 = 24;
console.log(sum(num1, num2));
\`\`\`
###### Links
[Absolute url](https://google.com)
[Absolute url - no protocol](//google.com)
[Relative url – Console Readme](README.md)
[Root relative url – Console Security](/SECURITY.md)
___
# Some more stuff from Chatwoot's readme
Expand Down

0 comments on commit b42fae6

Please sign in to comment.