Pushing up fixes for new release

- Fixed Bug #5 with Some Pipelet Labels getting cut off
- Swapped order of Navigation as suggested in #2
- Fixed z-index issues reported in #2
- Fixed issue on server where direct links were throwing 404 errors
- Updated Tester Menu with some helpful options
- Fixed mobile issues with Open Menu and missing Debug Option
- Fixed broken page rendering reported in #1
- Updated font size in menu reported in #2

.devcontainer/Dockerfile

@@ -11,7 +11,7 @@ RUN sudo apt-get update \
     && sudo apt-get install gnupg2 -y
 
 # Install helpful scripts
-RUN sudo apt-get install exa curl unzip -y
+RUN sudo apt-get install exa curl unzip tidy -y
 
 # Copy / Replace Dot Files
 COPY dotfiles/.* /home/node

CHANGELOG.md

@@ -0,0 +1,18 @@
+# Change Log
+
+> Here's our record of all notable changes made to to this project
+
+## v0.2.0
+
+- Fixed Bug #5 with Some Pipelet Labels getting cut off
+- Swapped order of Navigation as suggested in #2
+- Fixed z-index issues reported in #2
+- Fixed issue on server where direct links were throwing 404 errors
+- Updated Tester Menu with some helpful options
+- Fixed mobile issues with Open Menu and missing Debug Option
+- Fixed broken page rendering reported in #1
+- Updated font size in menu reported in #2
+
+## v0.1.0
+
+- Initial Release for Testers

bin/cmd/build-nav.mjs

@@ -79,7 +79,7 @@ export default (cli) => {
   })
 
   // Sort all the things
-  nav.sort((a, b) => (a.title > b.title ? 1 : -1))
+  nav.sort((a, b) => (a.title < b.title ? 1 : -1))
   nav.forEach((page) => page.links.sort((a, b) => (a.title > b.title ? 1 : -1)))
   nav.forEach((page) =>
     page.links.forEach((sub) => {

bin/cmd/convert.mjs

@@ -121,11 +121,11 @@ export default (cli) => {
         fs.mkdirSync(folder, { recursive: true })
       }
 
-      // Fix Code Blocks
-      markdown = markdown.replace(/```\n([^```]+)```/g, '\n```javascript\n$1```\n')
-      markdown = markdown.replace(/```javascript\n\n/g, '```javascript\n')
-      markdown = markdown.replace(/\n\s+\n/g, '\n\n')
-      markdown = markdown.replace(/\n\n\n/g, '\n\n')
+      // // Fix Code Blocks
+      // markdown = markdown.replace(/```\n([^```]+)```/g, '\n```javascript\n$1```\n')
+      // markdown = markdown.replace(/```javascript\n\n/g, '```javascript\n')
+      // markdown = markdown.replace(/\n\s+\n/g, '\n\n')
+      // markdown = markdown.replace(/\n\n\n/g, '\n\n')
 
       // Add Front Matter for Markdown ( and escape single quotes )
       const mdTitle = `metaTitle: '${meta[metaKey].title.replace(/'/g, ''')}'`

bin/cmd/diff.mjs

@@ -7,7 +7,7 @@ import { compareSync } from 'dir-compare'
 import { Glob } from 'glob'
 import { spawnSync } from 'child_process'
 
-import { DATA_FOLDER, DIFF_FOLDER, SUPPORTED_VERSIONS, VERSIONS_FOLDER } from '../config.mjs'
+import { DATA_FOLDER, DIFF_FOLDER, SUPPORTED_VERSIONS, VERSIONS_FOLDER, TEMP_FOLDER } from '../config.mjs'
 
 const debug = Debug('sfcc-docs:diff')
 const SEP = path.sep
@@ -45,8 +45,13 @@ export default (cli) => {
 
     diffVersions.push(version.value)
 
-    const thisVersion = path.resolve(VERSIONS_FOLDER, version.value)
-    const previousVersion = path.resolve(VERSIONS_FOLDER, SUPPORTED_VERSIONS[index + 1].value)
+    // Get versions to compare
+    const thisVersion = path.resolve(TEMP_FOLDER, version.value)
+    const previousVersion = path.resolve(TEMP_FOLDER, SUPPORTED_VERSIONS[index + 1].value)
+
+    // Copy the two versions to a temp folder and strip out the HTML files of all class names
+
+    // Compare the two versions
     const diffs = compareSync(thisVersion, previousVersion, options)
 
     debug(chalk.green.bold(`DIFF: v${version.value} <==> v${SUPPORTED_VERSIONS[index + 1].value}`))
@@ -74,10 +79,12 @@ export default (cli) => {
       }
 
       // Exit if this is not an HTML file
-      if (!fileName.endsWith('.html')) {
+      if (!fileName.endsWith('.txt')) {
         return
       }
 
+      fileName = fileName.replace('.txt', '.html')
+
       if (dif.state !== 'equal') {
         let diffOutput = null
         let diffPatchFile = null
@@ -86,7 +93,18 @@ export default (cli) => {
         // Files exists in both versions
         if (dif.reason === 'different-content') {
           // Lets get the diff ( just the basic here )
-          const gitDiff = spawnSync('git', ['diff', '--shortstat', '--no-index', path.resolve(dif.path1, dif.name1), path.resolve(dif.path2, dif.name2), '--ignore-all-space', '--ignore-blank-lines'])
+          const gitDiff = spawnSync('git', [
+            'diff',
+            '--shortstat',
+            '--no-index',
+            path.resolve(dif.path1, dif.name1),
+            path.resolve(dif.path2, dif.name2),
+            '--word-diff',
+            '--ignore-all-space',
+            '--ignore-blank-lines',
+            '--ignore-space-at-eol',
+            '--ignore-space-change',
+          ])
           diffOutput = gitDiff.stdout ? gitDiff.stdout.toString().trim() : null
 
           // Now let's generate a complete diff file
@@ -105,6 +123,8 @@ export default (cli) => {
               '--minimal',
               '--ignore-all-space',
               '--ignore-blank-lines',
+              '--ignore-space-at-eol',
+              '--ignore-space-change',
             ])
           }
         } else if (dif.type1 === 'missing' && dif.type2 === 'file') {

bin/cmd/init.mjs

@@ -5,11 +5,12 @@ import path from 'path'
 
 import * as cheerio from 'cheerio'
 
+import { convert } from 'html-to-text'
 import { Glob } from 'glob'
 import { parse } from 'node-html-parser'
 import { spawnSync } from 'child_process'
 
-import { DATA_FOLDER, DIFF_FOLDER, MARKDOWN_FOLDER, PREP_FOLDER, SRC_DATA_FOLDER, SUPPORTED_VERSIONS_FILE, SUPPORTED_VERSIONS, VERSIONS_FOLDER } from '../config.mjs'
+import { DATA_FOLDER, DIFF_FOLDER, MARKDOWN_FOLDER, PREP_FOLDER, SRC_DATA_FOLDER, SUPPORTED_VERSIONS_FILE, SUPPORTED_VERSIONS, VERSIONS_FOLDER, TEMP_FOLDER } from '../config.mjs'
 import { downloadExternalFile } from '../utils.mjs'
 
 const debug = Debug('sfcc-docs:init')
@@ -121,5 +122,47 @@ export default (cli) => {
     }
   }
 
+  // Remove old temp folder for version if it exists
+  if (fs.existsSync(TEMP_FOLDER)) {
+    spawnSync('rm', ['-fr', TEMP_FOLDER])
+  }
+
+  // Make temp directory since we just deleted it
+  if (!fs.existsSync(TEMP_FOLDER)) {
+    fs.mkdirSync(TEMP_FOLDER, { recursive: true })
+  }
+
+  const htmlToTextOptions = { selectors: [{ selector: 'a', options: { ignoreHref: true } }] }
+
+  // Make a text only version of the HTML files
+  versions.forEach((version) => {
+    debug('CONVERTING', `${VERSIONS_FOLDER}${SEP}${version.value}${SEP}**${SEP}*.html`)
+
+    // Do some initial cleanup on the HTML files
+    const files = new Glob(`${VERSIONS_FOLDER}${SEP}${version.value}${SEP}**${SEP}*.html`, {})
+    for (const file of files) {
+      // Copy the two versions to a temp folder and strip out the HTML files of all class names
+      const html = fs.readFileSync(file)
+      const text = convert(html.toString(), htmlToTextOptions)
+      const newFilePath = file.replace(VERSIONS_FOLDER, TEMP_FOLDER).replace('.html', '.txt')
+
+      if (cli.verbose) {
+        debug(chalk.green('PROCESSING:'))
+        debug('› OLD:', chalk.dim(file))
+        debug('› NEW:', chalk.dim(newFilePath))
+      }
+
+      // Set new folder path
+      let folder = path.dirname(newFilePath)
+
+      // Make Directory if needed
+      if (!fs.existsSync(folder)) {
+        fs.mkdirSync(folder, { recursive: true })
+      }
+
+      fs.writeFileSync(newFilePath, text)
+    }
+  })
+
   debug(chalk.green.bold('✅ ALL DONE (๑˃̵ᴗ˂̵)و '))
 }

bin/cmd/prep.mjs

@@ -431,7 +431,7 @@ export default async (cli) => {
 
     const reParent = new RegExp(`^${parent} `, 'g')
     const reGroup = new RegExp(`^${groupTitle} `, 'g')
-    const reGroupAlt = new RegExp(`^${groupTitle}\.`, 'g')
+    const reGroupAlt = new RegExp(`^${groupTitle}\\.`, 'g')
 
     navTitle = navTitle.replace(/^Class /, '')
     navTitle = navTitle.replace(/^Job Step /, '')

bin/config.mjs

@@ -12,6 +12,7 @@ export const DIFF_FOLDER = path.resolve(DOCS_FOLDER, 'diff')
 export const MARKDOWN_FOLDER = path.resolve(DOCS_FOLDER, 'markdown')
 export const PREP_FOLDER = path.resolve(DOCS_FOLDER, 'prep')
 export const VERSIONS_FOLDER = path.resolve(DOCS_FOLDER, 'versions')
+export const TEMP_FOLDER = path.resolve(DOCS_FOLDER, 'temp')
 
 export const SRC_FOLDER = path.resolve(__dirname, '../src')
 export const SRC_DATA_FOLDER = path.resolve(SRC_FOLDER, 'data')

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sfccdevops/sfcc-docs",
-  "version": "0.1.0",
+  "version": "0.2.0",
   "description": "Unofficial community edition of the Salesforce Commerce Cloud developer documentation.",
   "license": "MIT",
   "author": "Peter Schmalfeldt <[email protected]>",
@@ -72,6 +72,7 @@
     "eslint-config-next": "13.0.2",
     "glob": "^10.3.3",
     "html-minifier": "^4.0.0",
+    "html-to-text": "^9.0.5",
     "markdownlint": "^0.30.0",
     "node-html-parser": "^6.1.5",
     "prettier": "^2.8.7",

src/components/DiffTimeline.jsx

@@ -64,6 +64,12 @@ export function DiffTimeline() {
     }
   }
 
+  const notifyUser = () => (evt) => {
+    alert('Version Links Disabled during Testing')
+    evt.preventDefault()
+    return false
+  }
+
   return (
     <div className="mt-12 flow-root border-t border-slate-200 pt-6 dark:border-slate-800">
       <h2 className="text-xl font-medium text-slate-900 dark:text-slate-100" id="change-history">
@@ -85,7 +91,7 @@ export function DiffTimeline() {
                   <div className="flex min-w-0 flex-1 justify-between space-x-4 pt-1.5">
                     <div>
                       <p className="text-sm text-slate-600 dark:text-slate-400">
-                        <a href={change.href} title={`View version ${change.version} of this document`} className="mr-1.5 inline-block w-12 font-medium text-sky-500 hover:underline">
+                        <a href={change.href} onClick={notifyUser()} title={`View version ${change.version} of this document`} className="mr-1.5 inline-block w-12 font-medium text-sky-500 hover:underline">
                           v{change.version}
                         </a>
                         <span aria-hidden="true" className="mr-2">