Skip to content

Commit d72cf65

Browse files
confused-Techieconfused-Techie
committed
Migrate settings-view 
1 parent 8f88f11 commit d72cf65

File tree

5 files changed

+61
-79
lines changed

5 files changed

+61
-79
lines changed

‎packages/settings-view/lib/package-detail-view.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -385,22 +385,24 @@ export default class PackageDetailView {
385385
readme = fs.readFileSync(this.readmePath, {encoding: 'utf8'})
386386
}
387387

388-
let readmeSrc
388+
let readmeSrc, readmeIsLocal;
389389

390390
if (this.pack.path) {
391391
// If package is installed, use installed path
392392
readmeSrc = this.pack.path
393+
readmeIsLocal = true;
393394
} else {
394395
// If package isn't installed, use url path
395396
let repoUrl = this.packageManager.getRepositoryUrl(this.pack)
397+
readmeIsLocal = false;
396398

397399
// Check if URL is undefined (i.e. package is unpublished)
398400
if (repoUrl) {
399401
readmeSrc = repoUrl + `/blob/master/`
400402
}
401403
}
402404

403-
const readmeView = new PackageReadmeView(readme, readmeSrc)
405+
const readmeView = new PackageReadmeView(readme, readmeSrc, readmeIsLocal)
404406
if (this.readmeView) {
405407
this.readmeView.element.parentElement.replaceChild(readmeView.element, this.readmeView.element)
406408
this.readmeView.destroy()

‎packages/settings-view/lib/package-readme-view.js

Lines changed: 20 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -1,57 +1,9 @@
11
/** @babel */
22

3-
import {marked} from 'marked'
4-
import createDOMPurify from 'dompurify'
5-
6-
function sanitize (html, readmeSrc) {
7-
const temporaryContainer = document.createElement('div')
8-
temporaryContainer.innerHTML = html
9-
10-
for (const checkbox of temporaryContainer.querySelectorAll('input[type="checkbox"]')) {
11-
checkbox.setAttribute('disabled', '')
12-
}
13-
14-
let path = require('path')
15-
16-
for (const image of temporaryContainer.querySelectorAll('img')) {
17-
let imageSrc = image.getAttribute('src')
18-
19-
let changeImageSrc = true
20-
21-
// If src contains a protocol then it must be absolute
22-
if (/^(?:[a-z]+:)?\/\//i.test(imageSrc)) {
23-
changeImageSrc = false
24-
}
25-
26-
// If src contains a base64 encoded image it must be left unchanged
27-
if (/^data:image\/.*;base64/i.test(imageSrc)) {
28-
changeImageSrc = false
29-
}
30-
31-
// If path is absolute on file system it must be a local file, e.g. emoji
32-
if (path.isAbsolute(imageSrc)) {
33-
changeImageSrc = false
34-
}
35-
36-
// If imageSrc needs changing and readmeSrc isn't undefined (i.e. if package was unpublished)
37-
if (changeImageSrc && readmeSrc) {
38-
if (path.isAbsolute(readmeSrc)) {
39-
// If repoUrl is a local path (i.e. package is installed)
40-
image.setAttribute('src', path.join(readmeSrc, imageSrc))
41-
} else {
42-
// If repoUrl is a URL (i.e. package isn't installed)
43-
image.setAttribute('src', new URL(imageSrc, readmeSrc))
44-
}
45-
}
46-
}
47-
48-
return createDOMPurify().sanitize(temporaryContainer.innerHTML)
49-
}
50-
513
// Displays the readme for a package, if it has one
524
// TODO Decide to keep this or current button-to-new-tab view
535
export default class PackageReadmeView {
54-
constructor (readme, readmeSrc) {
6+
constructor (readme, readmeSrc, readmeIsLocal) {
557
this.element = document.createElement('section')
568
this.element.classList.add('section')
579

@@ -69,13 +21,25 @@ export default class PackageReadmeView {
6921
container.appendChild(this.packageReadme)
7022
this.element.appendChild(container)
7123

72-
marked(readme || '### No README.', {breaks: false}, (err, content) => {
73-
if (err) {
74-
this.packageReadme.innerHTML = '<h3>Error parsing README</h3>'
75-
} else {
76-
this.packageReadme.innerHTML = sanitize(content, readmeSrc)
77-
}
78-
})
24+
readme ||= "### No README.";
25+
26+
const markdownOpts = {
27+
breaks: false,
28+
taskCheckboxDisabled: true,
29+
useGitHubHeadings: true
30+
};
31+
32+
if (readmeIsLocal) {
33+
markdownOpts.filePath = readmeSrc;
34+
} else {
35+
markdownOpts.rootDomain = readmeSrc;
36+
}
37+
38+
try {
39+
this.packageReadme.innerHTML = atom.ui.markdown.render(readme, markdownOpts);
40+
} catch(err) {
41+
this.packageReadme.innerHTML = "<h3>Error parsing README</h3>";
42+
}
7943
}
8044

8145
destroy () {

‎packages/settings-view/lib/rich-description.js

Lines changed: 12 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,3 @@
1-
const {marked} = require('marked')
2-
3-
const renderer = new marked.Renderer()
4-
renderer.code = () => ''
5-
renderer.blockquote = () => ''
6-
renderer.heading = () => ''
7-
renderer.html = (src) => {
8-
const match = src.match(/<br\s*\/?>/)
9-
if (match) {
10-
return `<br/>`
11-
}
12-
return ''
13-
}
14-
renderer.image = () => ''
15-
renderer.list = () => ''
16-
17-
const markdown = text => marked(text, {renderer, breaks: true}).replace(/<p>(.*)<\/p>/, '$1').trim()
181

192
module.exports = {
203
getSettingDescription (keyPath) {
@@ -23,6 +6,17 @@ module.exports = {
236
if (schema && schema.description) {
247
description = schema.description
258
}
26-
return markdown(description)
9+
return atom.ui.markdown.render(
10+
description,
11+
{
12+
html: false,
13+
useTaskCheckbox: false,
14+
disableInlineCode: true,
15+
disableCodeBlocks: true,
16+
disableHeading: true,
17+
disableImage: true,
18+
disableList: true
19+
}
20+
).replace(/<p>(.*)<\/p>/, "$1").trim();
2721
}
2822
}

‎packages/settings-view/package.json

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,13 +42,11 @@
4242
},
4343
"dependencies": {
4444
"async": "^3.2.0",
45-
"dompurify": "^2.0.17",
4645
"etch": "0.9.0",
4746
"fs-plus": "^3.0.0",
4847
"fuzzaldrin": "^2.1",
4948
"glob": "5.0.15",
5049
"hosted-git-info": "^2.8.9",
51-
"marked": "5.0.3",
5250
"request": "^2.83.0",
5351
"season": "^6.0.2",
5452
"semver": "^5.3.0",

‎src/ui.js

Lines changed: 25 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,7 +41,12 @@ function renderMarkdown(content, givenOpts = {}) {
4141
transformAtomLinks: true, // Attempt to rewrite links to Atom pages, changing them to Pulsar
4242
transformNonFqdnLinks: true, // Attempt to resolve non-FQDN links
4343
rootDomain: "", // The root URL that should be used for the above 'transform' options
44-
filePath: "", // The path to the file where this markdown is generated from
44+
filePath: "", // The path to the file where this markdown is generated from,
45+
disableInlineCode: false,
46+
disableCodeBlocks: false,
47+
disableHeading: false,
48+
disableImage: false,
49+
disableList: false
4550
};
4651

4752
let opts = { ...defaultOpts, ...givenOpts };
@@ -178,6 +183,25 @@ function renderMarkdown(content, givenOpts = {}) {
178183
return `<pre><code class="language-${lang}">${str}</code></pre>`;
179184
};
180185

186+
// Process disables
187+
if (opts.disableInlineCode) {
188+
md.renderer.rules.code_inline = () => { return ""; };
189+
}
190+
if (opts.disableCodeBlocks) {
191+
md.disable("code");
192+
md.disable("fence");
193+
}
194+
if (opts.disableHeading) {
195+
md.disable("heading");
196+
md.disable("lheading");
197+
}
198+
if (opts.disableImage) {
199+
md.disable("image");
200+
}
201+
if (opts.disableList) {
202+
md.disable("list");
203+
}
204+
181205
let textContent;
182206

183207
if (opts.handleFrontMatter) {

0 commit comments

Comments
 (0)