refactor: xo feedback

scripts/md-resolve-svg.js

@@ -25,8 +25,8 @@ const findReplacements = (file, filesToReplace) => {
 		svgName = decodeURI(svgName)
 			.replace('https://img.shields.io/badge/', '')
 			.replace('.svg', '')
-			.replace(/[^a-zA-Z\d\s]/g, '')
-			.replace(/ /g, '_');
+			.replaceAll(/[^a-zA-Z\d\s]/g, '')
+			.replaceAll(' ', '_');
 		const pathname = `${docsPath}/${svgName}`;
 		const pathNameSvg = `${pathname}.svg`;
 
@@ -103,7 +103,7 @@ const convertImages = async () => {
 	// Windows has double backslash for paths
 	filesToReplace = filesToReplace.map((file) => ({
 		...file,
-		files: file.files.map((fileName) => fileName.replace(/\\/g, '/'))
+		files: file.files.map((fileName) => fileName.replaceAll('\\', '/'))
 	}));
 
 	startReplacement(filesToReplace);

showcases/patternhub/pages/foundations/variables/examples.tsx

@@ -43,7 +43,7 @@ const Example = () => {
 										<div
 											className={`example-${example
 												.toLowerCase()
-												.replace(/ /g, '-')}`}>
+												.replaceAll(' ', '-')}`}>
 											{example === 'Spacing fixed' && (
 												<div>
 													<DBIcon icon="account">

showcases/patternhub/scripts/get-code-files.js

@@ -82,7 +82,7 @@ const writeCodeFiles = async (componentPath, componentName) => {
 	if (FS.existsSync(path)) {
 		variants = JSON.parse(FS.readFileSync(path, 'utf8')).map((variant) => ({
 			...variant,
-			name: variant.name.replace(/\s/g, '').replace(/\W/g, '')
+			name: variant.name.replaceAll(/\s/g, '').replaceAll(/\W/g, '')
 		}));
 		for (const variant of variants) {
 			if (!FS.existsSync(codePath)) {

showcases/patternhub/scripts/get-example-file.js

@@ -76,8 +76,8 @@ const getOption = (optionName, tsType) => {
 			(property) =>
 				`"${getOption(property.key, property.value)
 					.replace('=', '":')
-					.replace(/{/g, '')
-					.replace(/}/g, '')}`
+					.replaceAll('{', '')
+					.replaceAll('}', '')}`
 		)}}}`;
 	}
 

showcases/patternhub/scripts/get-properties-file.js

@@ -14,15 +14,15 @@ const getOptions = (tsType) => {
 
 		case 'signature': {
 			return `${tsType.raw
-				.replace(/\/\*\*\n\t/g, '')
-				.replace(/\*\/\n\t/g, '')
-				.replace(/\*/g, '//')
-				.replace(/{/g, '{')
-				.replace(/}/g, '}')
-				.replace(/\r\n\t\t/g, ' ')
-				.replace(/\t/g, ' ')
-				.replace(/\r\n|\r|\n/g, '<br/>')
-				.replace(/\|/g, '&#124;')}`;
+				.replaceAll('/**\n\t', '')
+				.replaceAll('*/\n\t', '')
+				.replaceAll('*', '//')
+				.replaceAll('{', '&#123;')
+				.replaceAll('}', '&#125;')
+				.replaceAll('\r\n\t\t', ' ')
+				.replaceAll('\t', '&ensp;')
+				.replaceAll(/\r\n|\r|\n/g, '<br/>')
+				.replaceAll('|', '&#124;')}`;
 		}
 
 		case 'union': {
@@ -56,13 +56,14 @@ const getPropertiesFile = ({ displayName, description, props }) => {
 		const options = getOptions(prop.tsType);
 		propTable += `| ${propKey} `;
 		propTable += `| ${
-			prop.description.replace(/\r\n|\r|\n/g, '<br/>') || 'No description'
+			prop.description.replaceAll(/\r\n|\r|\n/g, '<br/>') ||
+			'No description'
 		} `;
 		propTable += `| ${prop.tsType.type ?? prop.tsType.name} `;
 		propTable += `| ${
 			options
-				? `<pre><code className="code-pre-wrap">${options.replace(
-						/<T>/g,
+				? `<pre><code className="code-pre-wrap">${options.replaceAll(
+						'<T>',
 						''
 				  )}</code></pre>`
 				: ''

showcases/patternhub/scripts/utils.js

@@ -55,7 +55,7 @@ export const getCodeByFramework = (componentName, framework, example) => {
 				framework !== 'react' &&
 				(props[key] instanceof Object || key === 'click')
 			) {
-				value = value.replace(/"/g, "'");
+				value = value.replaceAll('"', "'");
 			}
 
 			if (framework === 'angular') {
@@ -101,7 +101,7 @@ export const getColorVariants = () => [
 
 export const getComponentName = (filePath) => {
 	let componentName = filePath.split('/').at(-1);
-	componentName = componentName.replace('.tsx', '').replace(/\s/g, '');
+	componentName = componentName.replace('.tsx', '').replaceAll(/\s/g, '');
 	return componentName;
 };