From 5fa385e92320a1b1ffb6e59302b10e5ff8512125 Mon Sep 17 00:00:00 2001
From: Ayo Ayco <ayo@ayco.io>
Date: Mon, 26 Aug 2024 09:37:26 +0200
Subject: [PATCH] chore: make readme logo absolute path (#2340)

* chore: make readme logo absolute path

* Update rewrite-links.js

* Revert README.md

* Revert README.md

* Prettify rewrite-links.js

* Fix lint errors of rewrite-links.js

---------

Co-authored-by: ByoungYong Kim <ryubro@users.noreply.github.com>
---
 scripts/rewrite-links.js | 60 ++++++++++++++++++----------------------
 1 file changed, 27 insertions(+), 33 deletions(-)

diff --git a/scripts/rewrite-links.js b/scripts/rewrite-links.js
index 2495041f1..19968e524 100644
--- a/scripts/rewrite-links.js
+++ b/scripts/rewrite-links.js
@@ -7,7 +7,8 @@ const fs = require('fs');
 const path = require('path');
 
 const rewriteLinksConfig = {
-  githubPath: 'https://github.com/ing-bank/lion/blob/master/',
+  repoBasePath: 'https://github.com/ing-bank/lion/blob/master/',
+  assetBasePath: 'https://raw.githubusercontent.com/ing-bank/lion/master/',
   monorepoRootPath: path.resolve(__dirname, '../'),
 };
 
@@ -54,57 +55,50 @@ function gatherFilesFromDir(startPath, cfg = gatherFilesConfig, result = []) {
  * @param {string} filePath - local filesystem path of md file,
  * like '/path/to/lion/packages/my-component/docs/myClass.md'
  * @param {object} cfg - configurantion object
- * @param {string} cfg.githubPath - root github url for the absolute result links
+ * @param {string} cfg.repoBasePath - root repository url for the absolute result links
+ * @param {string} cfg.assetBasePath - root asset url for the absolute result image url
  * @param {string} cfg.monorepoRootPath - local filesystem root path of the monorepo
  * @returns {string} adjusted contents of input md file (mdContent)
  */
 function rewriteLinksInMdContent(mdContent, filePath, cfg = rewriteLinksConfig) {
-  const rewrite = (/** @type {string} */ href) => {
-    let newHref = href;
-    const isRelativeUrlPattern = /^(\.\/|\.\.\/)/; // starts with './' or '../'
-    if (href.match(isRelativeUrlPattern)) {
+  const rewrite =
+    (/** @type {string} */ repoBasePath, /** @type {string} */ repoRootPath) =>
+    (/** @type {string} */ href) => {
+      const isRelativeUrlPattern = /^(\.\/|\.\.\/)/; // starts with './' or '../'
+      if (!href.match(isRelativeUrlPattern)) {
+        return href;
+      }
+
       const fileFolder = filePath.replace(/(.*\/).*/g, '$1');
       const absoluteLocalPath = path.resolve(fileFolder, href);
       // relativeFromRootPath: for instance 'packages/my-component/docs/' when
       // filePath is 'path/to/repo/packages/my-component/docs/myDoc.md'
-      const relativeFromRootPath = absoluteLocalPath.replace(cfg.monorepoRootPath, '').slice(1);
+      const relativeFromRootPath = absoluteLocalPath.replace(repoRootPath, '').slice(1);
       // newRoot: https://github.com/ing-bank/lion/blob/master/packages/my-component/docs/
-      newHref = cfg.githubPath + relativeFromRootPath;
-    }
-    return newHref;
-  };
+
+      return repoBasePath + relativeFromRootPath;
+    };
 
   const mdLink = (
     /** @type {string} */ href,
     /** @type {string} */ title,
     /** @type {string} */ text,
-  ) => `[${text}](${rewrite(href)}${title ? ` ${title}` : ''})`;
+  ) =>
+    `[${text}](${rewrite(cfg.repoBasePath, cfg.monorepoRootPath)(href)}${title ? ` ${title}` : ''})`;
 
-  /** @type {string[]} */
-  const resultLinks = [];
   // /^!?\[(label)\]\(href(?:\s+(title))?\s*\)/
   const linkPattern = '!?\\[(.*)\\]\\(([^|\\s]*)( +(.*))?\\s*\\)'; // eslint-disable-line
-  const matches = mdContent.match(new RegExp(linkPattern, 'g')) || [];
+  const linkReplaced = mdContent.replace(new RegExp(linkPattern, 'g'), (_, p1, p2, p3) =>
+    mdLink(p2, p3, p1),
+  );
 
-  matches.forEach(link => {
-    let newLink = '';
-    const parts = link.match(new RegExp(linkPattern));
-    if (parts) {
-      newLink = mdLink(parts[2], parts[3], parts[1]);
-    }
-    resultLinks.push(newLink);
-  });
+  const imgSrcPattern = `src *= *['"](.*)['"]`;
+  const imageReplaced = linkReplaced.replace(
+    new RegExp(imgSrcPattern, 'g'),
+    (_, p1) => `src="${rewrite(cfg.assetBasePath, cfg.monorepoRootPath)(p1)}`,
+  );
 
-  // Now that we have our rewritten links, stitch back together the desired result
-  const tokenPattern = /!?\[.*\]\([^|\s]*(?: +.*)?\s*\)/;
-  const tokens = mdContent.split(new RegExp(tokenPattern, 'g'));
-  /** @type {string[]} */
-  const resultTokens = [];
-  tokens.forEach((token, i) => {
-    resultTokens.push(token + (resultLinks[i] || ''));
-  });
-  const resultContent = resultTokens.join('');
-  return resultContent;
+  return imageReplaced;
 }
 
 /**