Fix ID sanitisation

stashapp · Dec 2, 2024 · eb653b9 · eb653b9
1 parent 1e6ad46
commit eb653b9
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 10 deletions.
diff --git a/ui/v2.5/src/components/Shared/CustomFields.tsx b/ui/v2.5/src/components/Shared/CustomFields.tsx
@@ -39,7 +39,7 @@ const CustomField: React.FC<{ field: string; value: unknown }> = ({
   const valueStr = convertValue(value);
 
   // replace spaces with hyphen characters for css id
-  const id = field.toLowerCase().replace(" ", "-");
+  const id = field.toLowerCase().replace(/ /g, "-");
 
   return (
     <DetailItem

diff --git a/ui/v2.5/src/components/Shared/DetailItem.tsx b/ui/v2.5/src/components/Shared/DetailItem.tsx
@@ -26,20 +26,16 @@ export const DetailItem: React.FC<IDetailItem> = ({
 
   const message = label ?? <FormattedMessage id={id} />;
 
+  // according to linter rule CSS classes shouldn't use underscores
+  const sanitisedID = id.replace(/_/g, "-");
+
   return (
-    // according to linter rule CSS classes shouldn't use underscores
     <div className={`detail-item ${id}`}>
-      <span
-        className={`detail-item-title ${id.replace("_", "-")}`}
-        title={labelTitle}
-      >
+      <span className={`detail-item-title ${sanitisedID}`} title={labelTitle}>
         {message}
         {fullWidth ? ":" : ""}
       </span>
-      <span
-        className={`detail-item-value ${id.replace("_", "-")}`}
-        title={title}
-      >
+      <span className={`detail-item-value ${sanitisedID}`} title={title}>
         {value}
       </span>
     </div>