From 4929834a1bbc0b33eca97deb484f840aa0ee5c4c Mon Sep 17 00:00:00 2001
From: Sooraj <soorajshankar@users.noreply.github.com>
Date: Tue, 15 Jun 2021 09:35:49 +0530
Subject: [PATCH] Chore: Fix broken link to widget reference docs (#259)

---
 frontend/src/Editor/Inspector/Inspector.jsx | 4 ++--
 frontend/src/_helpers/utils.js              | 3 +++
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/src/Editor/Inspector/Inspector.jsx b/frontend/src/Editor/Inspector/Inspector.jsx
index b8e807cc72..f949dac530 100644
--- a/frontend/src/Editor/Inspector/Inspector.jsx
+++ b/frontend/src/Editor/Inspector/Inspector.jsx
@@ -7,7 +7,7 @@ import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
 import Popover from 'react-bootstrap/Popover';
 import ReactTooltip from 'react-tooltip';
 import { toast } from 'react-toastify';
-import { validateQueryName } from '@/_helpers/utils';
+import { validateQueryName, convertToKebabCase } from '@/_helpers/utils';
 
 export const Inspector = ({
   selectedComponentId,
@@ -244,7 +244,7 @@ export const Inspector = ({
       </div>
 
       <div className="widget-documentation-link p-2">
-        <a href={`https://docs.tooljet.io/docs/widgets/${componentMeta.name.toLowerCase()}`} target="_blank">
+        <a href={`https://docs.tooljet.io/docs/widgets/${convertToKebabCase(componentMeta?.name ?? '')}`} target="_blank">
           <small>
             {componentMeta.name} documentation
           </small>
diff --git a/frontend/src/_helpers/utils.js b/frontend/src/_helpers/utils.js
index 874250d118..c4c4be7a5f 100644
--- a/frontend/src/_helpers/utils.js
+++ b/frontend/src/_helpers/utils.js
@@ -129,3 +129,6 @@ export function validateQueryName(name){
     const nameRegex = new RegExp('^[A-Za-z0-9_-]*$');
     return nameRegex.test(name);
 };
+
+
+export const convertToKebabCase = string => string.replace(/([a-z])([A-Z])/g, '$1-$2').replace(/\s+/g, '-').toLowerCase()