feat: multiple UX improvements to labels (#7358)

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: Nithin David Thomas <1277421+nithindavid@users.noreply.github.com>

app/javascript/shared/helpers/sanitizeData.js

@@ -0,0 +1,22 @@
+export const labelSanitizePattern = /[^a-zA-Z0-9_-]/g;
+export const spacesPattern = /\s+/g;
+
+/**
+ * Sanitizes a label by removing unwanted characters and replacing spaces with hyphens.
+ *
+ * @param {string | undefined | null} label - The label to sanitize.
+ * @returns {string} The sanitized label.
+ *
+ * @example
+ * const label = 'My Label 123';
+ * const sanitizedLabel = sanitizeLabel(label); // 'my-label-123'
+ */
+export const sanitizeLabel = (label = '') => {
+  if (!label) return '';
+
+  return label
+    .trim()
+    .toLowerCase()
+    .replace(spacesPattern, '-')
+    .replace(labelSanitizePattern, '');
+};