Fix badge url issue (#608)

Closes #603

Signed-off-by: Cintia Sanchez Garcia <[email protected]>

ui/webapp/src/layout/common/itemModal/BadgeModal.tsx

@@ -1,5 +1,6 @@
 import { BASE_PATH, FOUNDATION } from '../../../data';
 import { SVGIconKind } from '../../../types';
+import formatShieldsBadgeContent from '../../../utils/formatShieldsBadgeContent';
 import CodeBlock from '../CodeBlock';
 import Modal from '../Modal';
 import SVGIcon from '../SVGIcon';
@@ -16,7 +17,7 @@ const BadgeModal = (props: Props) => {
   const openStatus = () => props.openStatus;
   const origin = window.location.origin;
   const foundation = FOUNDATION;
-  const badgeImage = `https://img.shields.io/badge/${foundation}%20Landscape-5699C6`;
+  const badgeImage = `https://img.shields.io/badge/${formatShieldsBadgeContent(foundation)}%20Landscape-5699C6`;
   const markdownLink = () => `[![${foundation} Landscape](${badgeImage})](${origin}${BASE_PATH}/?item=${itemId()})`;
   const asciiLink = () => `${origin}${BASE_PATH}/?item=${itemId()}[image:${badgeImage}[${foundation} LANDSCAPE]]`;
 

ui/webapp/src/utils/formatShieldsBadgeContent.ts

@@ -0,0 +1,10 @@
+import { REGEX_DASH } from '../data';
+
+// `badgeContent` message needs double dash instead of single dash,
+// due to single dash being used as a separator by shields.io
+// https://shields.io/badges/static-badge
+const formatShieldsBadgeContent = (n: string): string => {
+  return n.replace(REGEX_DASH, '--');
+};
+
+export default formatShieldsBadgeContent;