Hash the dynamic icon file so that cach is refreshed when new icons are used

emove console log

Author: garronej

src/bin/only-include-used-icons.ts

@@ -24,14 +24,15 @@ import * as fs from "fs";
 import { join as pathJoin, relative as pathRelative } from "path";
 import { assert } from "tsafe/assert";
 import { exclude } from "tsafe/exclude";
-import { writeFile, readFile, rm } from "fs/promises";
+import { writeFile, readFile, rm, cp } from "fs/promises";
 import { crawl } from "./tools/crawl";
 import { basename as pathBasename, sep as pathSep, dirname as pathDirname } from "path";
 import type { Equals } from "tsafe";
 import yargsParser from "yargs-parser";
 import { getAbsoluteAndInOsFormatPath } from "./tools/getAbsoluteAndInOsFormatPath";
 import { readPublicDirPath } from "./readPublicDirPath";
 import { existsAsync } from "./tools/fs.existsAsync";
+import { fnv1aHashToHex } from "./tools/fnv1aHashToHex";
 
 export const pathOfIconsJson = pathJoin("utility", "icons", "icons.json");
 
@@ -460,55 +461,106 @@ async function main() {
         "utf8"
     );
 
-    const onConfirmedChange = async () => {
-        const nextCacheDir = pathJoin(projectDirPath, ".next", "cache");
+    let hasChanged = false;
 
-        if (!fs.existsSync(nextCacheDir)) {
-            return;
-        }
+    const utilityIconsRelativeDirPath = pathJoin("utility", "icons");
 
-        await rm(nextCacheDir, { "recursive": true, "force": true });
-    };
+    await Promise.all(
+        [dsfrDistInNodeModulesDirPath, dsfrDistInPublicDirPath]
+            .filter(exclude(undefined))
+            .map(async dsfrDistDirPath => {
+                const cssFilePath = pathJoin(
+                    dsfrDistDirPath,
+                    utilityIconsRelativeDirPath,
+                    "icons.min.css"
+                );
 
-    console.log({ dsfrDistInPublicDirPath });
+                if (!fs.existsSync(cssFilePath)) {
+                    return;
+                }
 
-    [dsfrDistInNodeModulesDirPath, dsfrDistInPublicDirPath]
-        .filter(exclude(undefined))
-        .forEach(async dsfrDistDirPath => {
-            const cssFilePath = pathJoin(dsfrDistDirPath, "utility", "icons", "icons.min.css");
+                const remixiconDirPath = pathJoin(dsfrDistDirPath, "icons", "remixicon");
 
-            if (!fs.existsSync(cssFilePath)) {
-                return;
-            }
+                if (!fs.existsSync(remixiconDirPath)) {
+                    fs.mkdirSync(remixiconDirPath);
+                }
 
-            const remixiconDirPath = pathJoin(dsfrDistDirPath, "icons", "remixicon");
+                usedIcons
+                    .map(icon => (icon.prefix !== "ri-" ? undefined : icon))
+                    .filter(exclude(undefined))
+                    .map(({ iconId, rawSvgCode }) =>
+                        writeFile(
+                            pathJoin(remixiconDirPath, `${iconId}.svg`),
+                            Buffer.from(rawSvgCode, "utf8")
+                        )
+                    );
 
-            if (!fs.existsSync(remixiconDirPath)) {
-                fs.mkdirSync(remixiconDirPath);
-            }
+                log?.(`Patching ${pathRelative(projectDirPath, cssFilePath)}`);
 
-            usedIcons
-                .map(icon => (icon.prefix !== "ri-" ? undefined : icon))
-                .filter(exclude(undefined))
-                .map(({ iconId, rawSvgCode }) =>
+                const dynamicFilePath = pathJoin(
+                    pathDirname(cssFilePath),
+                    `icons.${fnv1aHashToHex(rawIconCssCodeBuffer.toString("utf8"))}.css`
+                );
+
+                if (fs.existsSync(dynamicFilePath)) {
+                    return;
+                }
+
+                fs.readdirSync(pathDirname(cssFilePath))
+                    .filter(
+                        fileBasename =>
+                            fileBasename.startsWith("icons.") && fileBasename.endsWith(".css")
+                    )
+                    .map(fileBasename => pathJoin(pathDirname(cssFilePath), fileBasename))
+                    .forEach(filePath => fs.unlinkSync(filePath));
+
+                await Promise.all([
+                    writeFile(dynamicFilePath, rawIconCssCodeBuffer),
                     writeFile(
-                        pathJoin(remixiconDirPath, `${iconId}.svg`),
-                        Buffer.from(rawSvgCode, "utf8")
+                        cssFilePath,
+                        Buffer.from(`@import url("./${pathBasename(dynamicFilePath)}");`, "utf8")
                     )
-                );
+                ]);
 
-            log?.(`Patching ${pathRelative(projectDirPath, cssFilePath)}`);
+                hasChanged = true;
+            })
+    );
 
-            const currentCode = await readFile(cssFilePath);
+    clear_next_cache: {
+        if (!hasChanged) {
+            break clear_next_cache;
+        }
 
-            if (Buffer.compare(rawIconCssCodeBuffer, currentCode) === 0) {
-                return;
-            }
+        const nextCacheDir = pathJoin(projectDirPath, ".next", "cache");
+
+        if (!fs.existsSync(nextCacheDir)) {
+            break clear_next_cache;
+        }
+
+        await rm(nextCacheDir, { "recursive": true, "force": true });
+    }
 
-            onConfirmedChange();
+    copy_used_dsfr_icons_to_public: {
+        if (!hasChanged) {
+            break copy_used_dsfr_icons_to_public;
+        }
 
-            writeFile(cssFilePath, rawIconCssCodeBuffer);
-        });
+        if (dsfrDistInPublicDirPath === undefined || dsfrDistInNodeModulesDirPath === undefined) {
+            break copy_used_dsfr_icons_to_public;
+        }
+
+        await Promise.all(
+            usedIcons
+                .filter(icon => icon.prefix === "fr-icon-")
+                .map(({ svgRelativePath }) =>
+                    ([dsfrDistInNodeModulesDirPath, dsfrDistInPublicDirPath] as const).map(
+                        baseDirPath =>
+                            pathJoin(baseDirPath, utilityIconsRelativeDirPath, svgRelativePath)
+                    )
+                )
+                .map(([srcFilePath, destFilePath]) => cp(srcFilePath, destFilePath))
+        );
+    }
 }
 
 if (require.main === module) {

src/bin/tools/fnv1aHashToHex.ts

@@ -0,0 +1,8 @@
+export function fnv1aHashToHex(str: string) {
+    let hash = 2166136261;
+    for (let i = 0; i < str.length; i++) {
+        hash ^= str.charCodeAt(i);
+        hash += (hash << 1) + (hash << 4) + (hash << 7) + (hash << 8) + (hash << 24);
+    }
+    return (hash >>> 0).toString(16); // Convert to unsigned 32-bit integer and then to hexadecimal
+}