Consistently slugify company URLs

Author: Greenheart

components/ComparisonTable.tsx

@@ -219,11 +219,9 @@ function ComparisonTable<T extends object>({
         return
       }
 
-      const companyRoute = getCompanyURL(lowerCaseName, wikiId)
-      window.location.href = companyRoute
+      window.location.assign(getCompanyURL(lowerCaseName, wikiId))
     } else {
-      const municipalityrRoute = `/kommun/${lowerCaseName}`
-      router.push(municipalityrRoute)
+      router.push(`/kommun/${lowerCaseName}`)
     }
   }
 

package-lock.json

@@ -34,6 +34,7 @@
     "react-mailchimp-subscribe": "^2.1.3",
     "react-markdown": "^9.0.1",
     "rehype-external-links": "^3.0.0",
+    "slugify": "^1.6.6",
     "styled-components": "^6.1.8",
     "vite": "^5.2.11"
   },

package.json

@@ -1,3 +1,5 @@
+import { slugifyURL } from './slugifyURL'
+
 export const normalizeString = (input: string) => input.replace('ä', 'a').replace('ö', 'o').replace('å', 'a').toLowerCase()
 
 export const toTitleCase = (str: string) => str.replace(
@@ -7,8 +9,8 @@ export const toTitleCase = (str: string) => str.replace(
 
 export const ONE_WEEK_MS = 60 * 60 * 24 * 7
 
-export const getCompanyURL = (companyName: string, wikiId: string) => {
-  const baseURL = process.env.NODE_ENV === 'production' ? 'https://beta.klimatkollen.se' : 'http://localhost:4321'
-  const dashName = companyName.toLowerCase().replaceAll(' ', '-')
-  return `${baseURL}/foretag/${dashName}-${wikiId}`
-}
+const baseURL = process.env.NODE_ENV === 'development' ? 'http://localhost:4321' : 'https://beta.klimatkollen.se'
+
+export const getCompanyURL = (companyName: string, wikiId: string) => (
+  `${baseURL}/foretag/${slugifyURL(companyName)}-${wikiId}`
+)

utils/shared.ts

@@ -0,0 +1,12 @@
+import slugify from 'slugify'
+
+export const slugifyURL = (url: string, locale = 'sv') => (
+  slugify(url, {
+    replacement: '-', // replace spaces with replacement character
+    remove: undefined, // remove characters that match regex
+    lower: true, // convert to lower case
+    strict: true, // strip special characters except replacement
+    locale, // locale identifier used to create locale-aware slugs
+    trim: true, // trim leading and trailing replacement chars
+  })
+)