@schalkneethling/miyagi-core 4.0.2

package/lib/render/views/main/docs.js

@@ -0,0 +1,47 @@
+import config from "../../../default-config.js";
+import { getUserUiConfig, getThemeMode } from "../../helpers.js";
+
+/**
+ * @param {object} object - parameter object
+ * @param {object} object.res - the express response object
+ * @param {object} object.doc
+ * @param {Function} [object.cb] - callback function
+ * @param {object} [object.cookies]
+ */
+export default async function renderMainDocs({ res, doc, cb, cookies }) {
+	const themeMode = getThemeMode(cookies);
+
+	await res.render(
+		"main.twig.miyagi",
+		{
+			lang: global.config.ui.lang,
+			folders: global.state.menu,
+			components: global.state.components,
+			flatUrlPattern: global.config.isBuild
+				? "/show-{{component}}.html"
+				: "/show?file={{component}}",
+			iframeSrc: doc.route.embedded,
+			requestedComponent: doc.paths.dir.short,
+			projectName: config.projectName,
+			userProjectName: global.config.projectName,
+			indexPath: global.config.indexPath.embedded,
+			miyagiDev: !!process.env.MIYAGI_DEVELOPMENT,
+			isBuild: global.config.isBuild,
+			userUiConfig: getUserUiConfig(cookies),
+			theme: themeMode
+				? Object.assign(global.config.ui.theme, { mode: themeMode })
+				: global.config.ui.theme,
+			basePath: global.config.isBuild ? global.config.build.basePath : "/",
+			uiTextDirection: global.config.ui.textDirection,
+		},
+		(html) => {
+			if (res.send) {
+				res.send(html);
+			}
+
+			if (cb) {
+				cb(null, html);
+			}
+		},
+	);
+}

package/lib/render/views/main/index.js

@@ -0,0 +1,46 @@
+import config from "../../../default-config.js";
+import { getUserUiConfig, getThemeMode } from "../../helpers.js";
+
+/**
+ * @param {object} object - parameter object
+ * @param {object} object.res - the express response object
+ * @param {Function} [object.cb] - callback function
+ * @param {object} [object.cookies]
+ */
+export default function renderMainIndex({ res, cb, cookies }) {
+	const themeMode = getThemeMode(cookies);
+
+	res.render(
+		"main.twig.miyagi",
+		{
+			lang: global.config.ui.lang,
+			folders: global.state.menu,
+			components: global.state.components,
+			flatUrlPattern: global.config.isBuild
+				? "/show-{{component}}.html"
+				: "/show?file={{component}}",
+			iframeSrc: global.config.indexPath.default,
+			showAll: true,
+			projectName: config.projectName,
+			userProjectName: global.config.projectName,
+			indexPath: global.config.indexPath.embedded,
+			miyagiDev: !!process.env.MIYAGI_DEVELOPMENT,
+			isBuild: global.config.isBuild,
+			userUiConfig: getUserUiConfig(cookies),
+			theme: themeMode
+				? Object.assign(global.config.ui.theme, { mode: themeMode })
+				: global.config.ui.theme,
+			basePath: global.config.isBuild ? global.config.build.basePath : "/",
+			uiTextDirection: global.config.ui.textDirection,
+		},
+		(html) => {
+			if (res.send) {
+				res.send(html);
+			}
+
+			if (cb) {
+				cb(null, html);
+			}
+		},
+	);
+}

package/lib/state/components.js

@@ -0,0 +1,132 @@
+import fs from "fs";
+import path from "path";
+
+import * as helpers from "../helpers.js";
+
+/**
+ * @param {Array} menu
+ * @param {boolean} isBuild
+ * @returns {Array}
+ */
+export default function getComponents(menu, isBuild) {
+	if (!menu) return [];
+
+	const components = [];
+
+	const partials = Object.keys(global.state.partials || []);
+
+	(function iterate(arr) {
+		arr.forEach((entry) => {
+			if (entry.shortPath && entry.normalizedShortPath) {
+				const componentName = path.basename(entry.shortPath);
+				const assetNames = {
+					css: `${componentName}.miyagi.css`,
+					js: `${componentName}.miyagi.js`,
+				};
+
+				components.push({
+					shortPath: entry.shortPath,
+					value: isBuild ? entry.normalizedShortPath : entry.shortPath,
+					assets: {
+						css: fs.existsSync(path.join(entry.fullPath, assetNames.css))
+							? path.relative(
+									process.cwd(),
+									path.join(entry.fullPath, assetNames.css),
+								)
+							: false,
+						js: fs.existsSync(path.join(entry.fullPath, assetNames.js))
+							? path.relative(
+									process.cwd(),
+									path.join(entry.fullPath, assetNames.js),
+								)
+							: false,
+					},
+				});
+
+				addToRoutes(
+					{
+						name: componentName,
+						shortPath: entry.shortPath,
+						fullPath: entry.fullPath,
+					},
+					partials,
+				);
+			}
+
+			if (entry.children && entry.children.length > 0) {
+				iterate(entry.children);
+			}
+		});
+	})(menu);
+
+	return components;
+}
+
+/**
+ * @param {object} item
+ * @param {string} item.name
+ * @param {string} item.shortPath
+ * @param {string} item.fullPath
+ * @param {Array} partials
+ */
+function addToRoutes({ name, shortPath, fullPath }, partials = []) {
+	if (!global.state.routes.includes(shortPath)) {
+		const fileName = `${path.basename(shortPath)}.${
+			global.config.files.templates.extension
+		}`;
+
+		const tplShortPath = path.join(shortPath, fileName);
+		const schemaFileName = `${global.config.files.schema.name}.${global.config.files.schema.extension}`;
+
+		const component = {
+			name,
+			route: {
+				default: global.config.isBuild
+					? `component-${helpers.normalizeString(shortPath)}.html`
+					: `/component?file=${shortPath}`,
+				embedded: global.config.isBuild
+					? `component-${helpers.normalizeString(shortPath)}-embedded.html`
+					: `/component?file=${shortPath}&embedded=true`,
+			},
+			alias: shortPath,
+			paths: {
+				dir: {
+					full: fullPath,
+					short: shortPath,
+				},
+				mocks: {
+					full(fileType) {
+						return path.join(
+							fullPath,
+							`${global.config.files.mocks.name}.${fileType}`,
+						);
+					},
+					short(fileType) {
+						return path.join(
+							shortPath,
+							`${global.config.files.mocks.name}.${fileType}`,
+						);
+					},
+				},
+				schema: {
+					full: path.join(fullPath, schemaFileName),
+					short: path.join(shortPath, schemaFileName),
+				},
+				docs: {
+					full: path.join(fullPath, "README.md"),
+					short: path.join(shortPath, "README.md"),
+				},
+			},
+			type: "components",
+		};
+
+		if (partials.includes(tplShortPath)) {
+			component.paths.tpl = {
+				short: tplShortPath,
+				full: path.join(fullPath, fileName),
+			};
+		}
+
+		global.state.routes.push(component);
+	}
+}

package/lib/state/css.js

@@ -0,0 +1,50 @@
+import css from "@adobe/css-tools";
+import deepMerge from "deepmerge";
+import log from "../logger.js";
+import { t } from "../i18n/index.js";
+
+/**
+ * @param {object} fileContents
+ * @returns {object}
+ */
+export default function getCSS(fileContents) {
+	const { assets } = global.config;
+	let cssObject = {};
+
+	if (assets?.customProperties?.files.length > 0) {
+		if (assets.customProperties.files.length > 1) {
+			cssObject = deepMerge.all(
+				assets.customProperties.files.map((file) => {
+					const fileContent = fileContents[file];
+
+					if (fileContent) {
+						return css.parse(fileContent);
+					}
+
+					log(
+						"warn",
+						t("customPropertyFileNotFound").replace("{{filePath}}", file),
+					);
+					return {};
+				}),
+			);
+		} else {
+			const fileContent = fileContents[assets.customProperties.files[0]];
+
+			if (fileContent) {
+				return css.parse(fileContents[assets.customProperties.files[0]]);
+			}
+
+			log(
+				"warn",
+				t("customPropertyFileNotFound").replace(
+					"{{filePath}}",
+					assets.customProperties.files[0],
+				),
+			);
+			return {};
+		}
+	}
+
+	return cssObject;
+}

package/lib/state/docs.js

@@ -0,0 +1,111 @@
+import PATH from "path";
+
+import * as helpers from "../helpers.js";
+
+export const getMenu = (sourceTree) => {
+	if (!sourceTree) return null;
+
+	return getMenuItem(sourceTree, {});
+};
+
+/**
+ * @param {object} sourceItem
+ * @param {string} sourceItem.name
+ * @param {string} sourceItem.type
+ * @param {string} sourceItem.path
+ * @param {Array} sourceItem.children
+ * @param {object} item
+ * @returns {object}
+ */
+function getMenuItem({ name, type, path, children }, item) {
+	const shortPath = PATH.relative(
+		process.cwd(),
+		type === "file"
+			? PATH.join(PATH.dirname(path), PATH.basename(path, PATH.extname(path)))
+			: path,
+	);
+
+	item.topLevel = shortPath == global.config.docs.folder;
+	item.id = shortPath;
+	item.shortPath = shortPath;
+	item.name = type === "file" ? PATH.basename(name, PATH.extname(name)) : name;
+	item.type = type;
+	item.section = "docs";
+	item.route = {
+		default: global.config.isBuild
+			? `component-${helpers.normalizeString(shortPath)}.html`
+			: `/component?file=${shortPath}`,
+		embedded: global.config.isBuild
+			? `component-${helpers.normalizeString(shortPath)}-embedded.html`
+			: `/component?file=${shortPath}&embedded=true`,
+	};
+
+	/**
+	 * if the current item in the tree is a directory, we check if any of
+	 * its children is a README.md or index.md. In that case, we want
+	 * this directory to be linked, not the file.
+	 */
+	if (item.type === "directory") {
+		if (children) {
+			const indexFile = children.find(
+				(child) => child.name === "README.md" || child.name === "index.md",
+			);
+
+			item.isLink = !!indexFile;
+
+			if (indexFile) {
+				item.file = indexFile.path;
+			}
+
+			if (item.isLink) {
+				addToRoutes(item);
+			}
+		}
+	} else {
+		item.isLink = true;
+		item.shortPath = shortPath;
+		item.file = path;
+
+		addToRoutes(item);
+	}
+
+	if (children) {
+		item.children = [];
+
+		children.forEach((child) => {
+			const fileName = PATH.basename(child.path);
+
+			if (
+				child.type === "directory" ||
+				!["README.md", "index.md"].includes(fileName)
+			) {
+				item.children.push(getMenuItem(child, {}));
+			}
+		});
+	}
+
+	return item;
+}
+
+/**
+ * @param {object} item
+ * @param {string} item.name
+ * @param {string} item.shortPath
+ * @param {string} item.file
+ * @param {string} item.route
+ */
+function addToRoutes({ name, shortPath, file, route }) {
+	if (!global.state.routes.includes(shortPath)) {
+		global.state.routes.push({
+			name,
+			route,
+			paths: {
+				dir: {
+					full: file,
+					short: shortPath,
+				},
+			},
+			type: "docs",
+		});
+	}
+}

package/lib/state/file-contents.js

@@ -0,0 +1,207 @@
+/**
+ * Module for getting the content of all relevant files
+ * @module stateFilecontents
+ */
+
+import { readFile as readFileFs } from "node:fs/promises";
+import path from "path";
+import anymatch from "anymatch";
+import yaml from "js-yaml";
+import { marked as Markdown } from "marked";
+import * as helpers from "../helpers.js";
+import log from "../logger.js";
+
+/**
+ * Checks if a given array of file paths includes a given file path
+ * @param {string} file - file path string
+ * @param {Array} fileNames - array of file path string
+ * @returns {boolean} is true if given array includes given file path
+ */
+function checkIfFileNamesIncludeFile(file, fileNames) {
+	return fileNames.includes(path.basename(file));
+}
+
+/**
+ * Returns all component and docs file from components.folder
+ * @param {object} sourceTree
+ * @returns {Promise<string[]>}
+ */
+async function getFilePaths(sourceTree) {
+	const { assets, components, files } = global.config;
+
+	const paths = [...assets.customProperties.files];
+
+	if (sourceTree.components) {
+		(function getPaths(entry) {
+			if (!anymatch(components.ignores, entry.path)) {
+				if (entry.type === "file") {
+					if (
+						checkIfFileNamesIncludeFile(entry.path, [
+							`${helpers.getResolvedFileName(
+								files.templates.name,
+								path.basename(entry.path, `.${files.templates.extension}`),
+							)}.${files.templates.extension}`,
+							`${files.mocks.name}.${files.mocks.extension[0]}`,
+							`${files.mocks.name}.${files.mocks.extension[1]}`,
+							`${files.schema.name}.${files.schema.extension}`,
+						]) ||
+						helpers.fileIsDocumentationFile(entry.path)
+					) {
+						paths.push(entry.path);
+					}
+				} else if (entry.type === "directory") {
+					entry.children.forEach((item) => getPaths(item));
+				}
+			}
+		})(sourceTree.components);
+	}
+
+	if (sourceTree.docs) {
+		(function getPaths(entry) {
+			if (entry.type === "file") {
+				paths.push(entry.path);
+			} else if (entry.type === "directory") {
+				entry.children.forEach((item) => getPaths(item));
+			}
+		})(sourceTree.docs);
+	}
+
+	return paths;
+}
+
+/**
+ * Calls the default export of an ES module and returns its return value
+ * or returns the return value directly if it is not a function
+ * @param {string} fileName - file path string
+ * @returns {Promise<string>} - the default export of the ES module
+ */
+async function getJsFileContent(fileName) {
+	const file = await import(path.resolve(`${fileName}?time=${Date.now()}`));
+
+	return file.default();
+}
+
+/**
+ * Returns the content of a YAML file parsed as JSON object
+ * @param {string} fileName - path to a yaml file
+ * @returns {Promise<object>} the content of the given file as an object
+ */
+async function getYamlFileContent(fileName) {
+	try {
+		const result = await readFileFs(fileName, "utf8");
+		return yaml.load(result);
+	} catch (err) {
+		return Promise.reject(err);
+	}
+}
+
+/**
+ * Returns the parsed content of a JSON file.
+ * @param {string} fileName - path to a json file
+ * @returns {Promise<object>} the parsed content of the given file
+ */
+async function getParsedJsonFileContent(fileName) {
+	try {
+		const result = await readFileFs(fileName, "utf8");
+		return JSON.parse(result);
+	} catch (err) {
+		return Promise.reject(err);
+	}
+}
+
+/**
+ * Returns the as HTML rendered content of markdown files.
+ * @param {string} fileName - path to a markdown file
+ * @returns {Promise<string>} the markdown of the given file converted into HTML
+ */
+async function getConvertedMarkdownFileContent(fileName) {
+	try {
+		const result = await readFileFs(fileName, "utf8");
+		return Markdown.parse(result);
+	} catch (err) {
+		return Promise.reject(err);
+	}
+}
+
+/**
+ * Calls different functions getting the file's content based on its type
+ * and returns the (converted) file content.
+ * @param {string} fileName - path to a file of any type
+ * @returns {Promise<string|object|Array>} content of the given file based on its type
+ */
+export const readFile = async function (fileName) {
+	switch (true) {
+		case [".yaml", ".yml"].includes(path.extname(fileName)):
+			{
+				try {
+					return await getYamlFileContent(fileName);
+				} catch (err) {
+					log("error", `Error when reading file ${fileName}`, err);
+				}
+			}
+			break;
+		case helpers.fileIsDocumentationFile(fileName):
+			{
+				try {
+					return await getConvertedMarkdownFileContent(fileName);
+				} catch (err) {
+					log("error", `Error when reading file ${fileName}`, err);
+				}
+			}
+			break;
+		case helpers.fileIsDataFile(fileName) &&
+			[".js", ".mjs"].includes(path.extname(fileName)):
+			{
+				try {
+					return await getJsFileContent(fileName);
+				} catch (err) {
+					log("error", `Error when reading file ${fileName}`, err);
+				}
+			}
+			break;
+		case fileName.endsWith(".json"):
+			{
+				try {
+					return await getParsedJsonFileContent(fileName);
+				} catch (err) {
+					log("error", `Error when reading file ${fileName}`, err);
+				}
+			}
+			break;
+		default: {
+			try {
+				return await readFileFs(fileName, { encoding: "utf8" });
+			} catch (err) {
+				log("error", `Error when reading file ${fileName}`, err);
+			}
+		}
+	}
+};
+
+/**
+ * Returns a promise which will be resolved with an object,
+ * including all component files (except for template files)
+ * and their content.
+ * @param {object} sourceTree
+ * @returns {Promise} gets resolved with the content of all docs, mocks, schema files
+ */
+export const getFileContents = async function (sourceTree) {
+	const fileContents = {};
+	const paths = await getFilePaths(sourceTree);
+
+	if (paths) {
+		await Promise.all(
+			paths.map(async (fullPath) => {
+				try {
+					fileContents[fullPath] = await readFile(fullPath.replace(/\0/g, ""));
+				} catch (err) {
+					return err;
+				}
+			}),
+		);
+
+		return fileContents;
+	}
+
+	return {};
+};

package/lib/state/helpers.js

@@ -0,0 +1,86 @@
+/**
+ * Helper functions for all state modules
+ * @module stateHelpers
+ */
+
+import path from "path";
+import log from "../logger.js";
+import { t } from "../i18n/index.js";
+import { readdir } from "node:fs/promises";
+
+/**
+ * @param {string|null} dir - the directory in which to look for files
+ * @param {string[]} ignores - an array of folders which should be ignored
+ * @param {string} configPath
+ * @param {string} type
+ * @param {Function} check - checks if the file should be returned, returns null or the file path
+ * @returns {Promise<string[]>} an array with file paths
+ */
+async function getFiles(dir, ignores, configPath, type, check) {
+	if (dir === null) return [];
+
+	try {
+		var entries = await readdir(path.join(process.cwd(), dir), {
+			withFileTypes: true,
+		});
+	} catch (error) {
+		if (error.code === "ENOENT") {
+			log(
+				"error",
+				t("srcFolderNotFound")
+					.replaceAll("{{directory}}", dir)
+					.replaceAll("{{type}}", type)
+					.replaceAll("{{config}}", configPath),
+			);
+			process.exit(1);
+		} else {
+			log("error", error.toString(), error);
+			process.exit(1);
+		}
+	}
+
+	const files = await Promise.all(
+		entries.map(async (entry) => {
+			const res = path.resolve(dir, entry.name);
+
+			if (isNotIgnored(res, ignores)) {
+				if (entry.isDirectory() || entry.isSymbolicLink()) {
+					return await getFiles(
+						path.join(dir, entry.name),
+						ignores,
+						configPath,
+						type,
+						check,
+					);
+				} else {
+					return check(res);
+				}
+			} else {
+				return null;
+			}
+		}),
+	);
+
+	return Array.prototype.concat(...files).filter((file) => file !== null);
+}
+
+/**
+ * Checks if a given file is not in one of the ignored folders
+ * @param {string} file - file path
+ * @param {Array} ignoredFolders - folders that should be ignored
+ * @returns {boolean} returns true if the given file is not inside any of the given ignoredFolders
+ */
+function isNotIgnored(file, ignoredFolders) {
+	for (let i = 0; i < ignoredFolders.length; i += 1) {
+		if (file.includes(ignoredFolders[i])) {
+			return false;
+		}
+	}
+
+	return true;
+}
+
+export default {
+	getFiles,
+	isNotIgnored,
+};