fix: trim leading, trailing, double replacement char

.eslintrc.js

@@ -3,6 +3,7 @@ module.exports = {
   env: {
     browser: true,
     es2020: true,
+    jest: true,
   },
   extends: ['eslint:recommended', 'plugin:react/recommended', 'prettier'],
   parserOptions: {

.github/workflows/test.yml

@@ -40,5 +40,7 @@ jobs:
         run: yarn lint
       - name: check formatting
         run: yarn format:ci
+      - name: run tests
+        run: yarn test
       - name: run build
         run: yarn build

package.json

@@ -7,6 +7,7 @@
     "build": "webpack --env.production",
     "develop": "webpack-dev-server --env.development",
     "lint": "eslint 'src/**/*.js'",
+    "test": "jest",
     "format": "prettier --write 'src/**/*.js'",
     "format:ci": "prettier --check 'src/**/*.js'",
     "semantic-release": "cross-env CI=true HUSKY_SKIP_HOOKS=1 semantic-release",
@@ -34,9 +35,9 @@
     "@emotion/core": "^10.0.35",
     "@emotion/styled": "^10.0.27",
     "netlify-cms-ui-default": "^2.11.1",
-    "react-select": "^3.1.0",
     "react": "^16.8.4",
-    "react-dom": "^16.8.4"
+    "react-dom": "^16.8.4",
+    "react-select": "^3.1.0"
   },
   "devDependencies": {
     "@babel/core": "^7.11.6",
@@ -56,6 +57,7 @@
     "eslint-plugin-react": "^7.20.3",
     "html-webpack-plugin": "^4.3.0",
     "husky": "^4.2.5",
+    "jest": "^26.4.2",
     "npm-run-all": "^4.1.5",
     "prettier": "^2.0.5",
     "semantic-release": "^17.1.1",

src/ParentWidget.js

@@ -42,6 +42,23 @@ const Option = (props) => {
   );
 };
 
+export const sanitizePath = (path) => {
+  const replacement = '-';
+  const sanitizedPath = path.replace(/[^a-z0-9]/gi, replacement).toLowerCase();
+
+  // Remove any doubled or leading/trailing replacement characters (that were added in the sanitizers).
+  const doubleReplacement = new RegExp(`(?:${replacement})+`, 'g');
+  const trailingReplacement = new RegExp(`${replacement}$`);
+  const leadingReplacement = new RegExp(`^${replacement}`);
+
+  const normalizedPath = sanitizedPath
+    .replace(doubleReplacement, replacement)
+    .replace(leadingReplacement, '')
+    .replace(trailingReplacement, '');
+
+  return normalizedPath;
+};
+
 export class ParentControl extends React.Component {
   constructor(props) {
     super(props);
@@ -54,7 +71,7 @@ export class ParentControl extends React.Component {
     let folder;
     if (this.isNewRecord()) {
       const title = this.state.title;
-      folder = title.replace(/[^a-z0-9]/gi, '-').toLowerCase();
+      folder = sanitizePath(title);
     } else {
       folder = getFolder(value);
     }

src/ParentWidget.test.js

@@ -0,0 +1,23 @@
+import { sanitizePath } from './ParentWidget';
+
+describe('sanitizePath', () => {
+  it('should lowercase string', () => {
+    expect(sanitizePath('Who')).toBe('who');
+  });
+
+  it('should replace spaces with dashes', () => {
+    expect(sanitizePath('Who Are We')).toBe('who-are-we');
+  });
+
+  it('should remove trailing replacer', () => {
+    expect(sanitizePath('Who Are We?')).toBe('who-are-we');
+  });
+
+  it('should remove leading replacer', () => {
+    expect(sanitizePath('?Who Are We')).toBe('who-are-we');
+  });
+
+  it('should remove double replacer', () => {
+    expect(sanitizePath('Who   Are    We')).toBe('who-are-we');
+  });
+});