Skip to content

feat(filing): add markdown support to filing descriptions #2815

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
billhimmelsbach wants to merge 1 commit into
base: master
Choose a base branch
from
Draft

feat(filing): add markdown support to filing descriptions #2815

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -75,6 +75,7 @@
"redux": "4.2.1",
"redux-logger": "3.0.6",
"redux-thunk": "2.4.2",
"rehype-external-links": "^3.0.0",
"sass": "1.77.8",
"split2": "3.2.2",
"streamsaver": "2.0.6",
Expand Down
11 changes: 11 additions & 0 deletions src/filing/submission/edits/Table.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,12 @@
margin-bottom: 0;
}

.EditsTable caption .markdown-description,
.EditsTable .caption .markdown-description {
color: #323a45;
font-weight: normal;
}

.EditsTable:last-of-type {
margin-bottom: 2em;
}
Expand Down Expand Up @@ -71,3 +77,8 @@
#Q666 .caption p {
color: #212121;
}

#Q666 caption .markdown-description,
#Q666 .caption .markdown-description {
color: #212121;
}
41 changes: 32 additions & 9 deletions src/filing/submission/edits/Table.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,4 +1,6 @@
import PropTypes from 'prop-types'
import Markdown from 'react-markdown'
import rehypeExternalLinks from 'rehype-external-links'
import Loading from '../../../common/LoadingIcon.jsx'
import { splitEditPart, splitYearQuarter } from '../../api/utils.js'
import Pagination from '../../pagination/container.jsx'
Expand Down Expand Up @@ -65,7 +67,13 @@ export const renderTableCaption = (props) => {
const [edit] = splitEditPart(name)

const linkedName = (
<a href={`/documentation/fig/${year}/overview#edit-${edit}`} target='_blank' rel='noopener noreferrer'>{name}</a>
<a
href={`/documentation/fig/${year}/overview#edit-${edit}`}
target='_blank'
rel='noopener noreferrer'
>
{name}
</a>
)
let captionHeader

Expand All @@ -88,13 +96,13 @@ export const renderTableCaption = (props) => {
captionHeader = 'Review your loan/application IDs'
}

const description = props.edit.description.replace(/"/g, '')
const { description } = props.edit

if (shouldSuppressTable(props)) {
return (
<div className='caption'>
<h3>{captionHeader}</h3>
{description ? <p>{description}</p> : null}
{renderDescription(description)}
{name === 'S040' ? (
<p>
Please check your file or system of record for duplicate
Expand All @@ -108,11 +116,30 @@ export const renderTableCaption = (props) => {
return (
<caption>
<h3>{captionHeader}</h3>
{description ? <p>{description}</p> : null}
{renderDescription(description)}
</caption>
)
}

export const renderDescription = (description) => {
if (!description) return null

return (
<div className='markdown-description'>
<Markdown
rehypePlugins={[
[
rehypeExternalLinks,
{ target: '_blank', rel: ['noopener', 'noreferrer'] },
],
]}
>
{description}
</Markdown>
</div>
)
}

export const makeTable = (props) => {
const { edit } = props
const { type } = props
Expand All @@ -133,11 +160,7 @@ export const makeTable = (props) => {
className += props.paginationFade ? ' fadeOut' : ''

return (
<table
width='100%'
className={className}
summary={`Report for edit ${edit.edit} - ${edit.description}`}
>
<table width='100%' className={className}>
{caption}
<thead>{renderHeader(edit, rowObj.rows, type)}</thead>
<tbody>{renderBody(edit, rowObj.rows, type)}</tbody>
Expand Down
31 changes: 31 additions & 0 deletions yarn.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8239,6 +8239,15 @@ __metadata:
languageName: node
linkType: hard

"hast-util-is-element@npm:^3.0.0":
version: 3.0.0
resolution: "hast-util-is-element@npm:3.0.0"
dependencies:
"@types/hast": "npm:^3.0.0"
checksum: 10c0/f5361e4c9859c587ca8eb0d8343492f3077ccaa0f58a44cd09f35d5038f94d65152288dcd0c19336ef2c9491ec4d4e45fde2176b05293437021570aa0bc3613b
languageName: node
linkType: hard

"hast-util-to-jsx-runtime@npm:^2.0.0":
version: 2.3.6
resolution: "hast-util-to-jsx-runtime@npm:2.3.6"
Expand Down Expand Up @@ -8390,6 +8399,7 @@ __metadata:
redux: "npm:4.2.1"
redux-logger: "npm:3.0.6"
redux-thunk: "npm:2.4.2"
rehype-external-links: "npm:^3.0.0"
sass: "npm:1.77.8"
serialize-javascript: "npm:7.0.5"
split2: "npm:3.2.2"
Expand Down Expand Up @@ -8703,6 +8713,13 @@ __metadata:
languageName: node
linkType: hard

"is-absolute-url@npm:^4.0.0":
version: 4.0.1
resolution: "is-absolute-url@npm:4.0.1"
checksum: 10c0/6f8f603945bd9f2c6031758bbc12352fc647bd5d807cad10d96cc6300fd0e15240cc091521a61db767e4ec0bacff257b4f1015fd5249c147bbb4a4497356c72e
languageName: node
linkType: hard

"is-absolute@npm:^1.0.0":
version: 1.0.0
resolution: "is-absolute@npm:1.0.0"
Expand Down Expand Up @@ -12630,6 +12647,20 @@ __metadata:
languageName: node
linkType: hard

"rehype-external-links@npm:^3.0.0":
version: 3.0.0
resolution: "rehype-external-links@npm:3.0.0"
dependencies:
"@types/hast": "npm:^3.0.0"
"@ungap/structured-clone": "npm:^1.0.0"
hast-util-is-element: "npm:^3.0.0"
is-absolute-url: "npm:^4.0.0"
space-separated-tokens: "npm:^2.0.0"
unist-util-visit: "npm:^5.0.0"
checksum: 10c0/486b5db73d8fe72611d62b4eb0b56ec71025ea32bba764ad54473f714ca627be75e057ac29243763f85a77c3810f31727ce3e03c975b3803c1c98643d038e9ae
languageName: node
linkType: hard

"remark-parse@npm:^11.0.0":
version: 11.0.0
resolution: "remark-parse@npm:11.0.0"
Expand Down
Loading