fix: [UIE-10152] - Fix html injection vuln in open Supprt Ticket and Quotas Increase Form.

Author: tanushree-akamai

packages/manager/src/features/Account/Quotas/QuotasIncreaseForm.tsx

@@ -14,6 +14,7 @@ import * as React from 'react';
 import { Controller, FormProvider, useForm } from 'react-hook-form';
 
 import { Markdown } from 'src/components/Markdown/Markdown';
+import { sanitizeHTML } from 'src/utilities/sanitizeHTML';
 
 import { getQuotaIncreaseFormSchema, getQuotaIncreaseMessage } from './utils';
 
@@ -77,14 +78,34 @@ export const QuotasIncreaseForm = (props: QuotasIncreaseFormProps) => {
     selectedService,
   }).description;
 
+  /**
+   * Sanitizes user input to prevent HTML injection attacks
+   */
+  const sanitizeInput = (input: string): string => {
+    if (!input) return '';
+    return sanitizeHTML({
+      sanitizingTier: 'strict',
+      text: input,
+      sanitizeOptions: {
+        ALLOWED_TAGS: [],
+        ALLOWED_ATTR: [],
+        KEEP_CONTENT: true,
+      },
+    });
+  };
+
   const handleSubmit = form.handleSubmit(async (values) => {
     const { onSuccess } = props;
 
     setSubmitting(true);
 
+    // Sanitize user inputs to prevent HTML injection
+    const sanitizedSummary = sanitizeInput(values.summary);
+    const sanitizedNotes = sanitizeInput(values.notes);
+
     const payload: TicketRequest = {
-      description: `${quotaIncreaseDescription}\n\n${values.notes}`,
-      summary: values.summary,
+      description: `${quotaIncreaseDescription}\n\n${sanitizedNotes}`,
+      summary: sanitizedSummary,
     };
 
     createSupportTicket(payload)
@@ -254,7 +275,7 @@ export const QuotasIncreaseForm = (props: QuotasIncreaseFormProps) => {
                 {summary}
               </Typography>
               <Markdown textOrMarkdown={quotaIncreaseDescription} />{' '}
-              <Markdown textOrMarkdown={notes ?? ''} />
+              <Markdown textOrMarkdown={sanitizeInput(notes ?? '')} />
             </Stack>
           </Accordion>
           <ActionsPanel

packages/manager/src/features/Support/SupportTickets/SupportTicketDialog.tsx

@@ -20,6 +20,7 @@ import { debounce } from 'throttle-debounce';
 
 import { sendSupportTicketExitEvent } from 'src/utilities/analytics/customEventAnalytics';
 import { getErrorStringOrDefault } from 'src/utilities/errorUtils';
+import { sanitizeHTML } from 'src/utilities/sanitizeHTML';
 import { storage, supportTicketStorageDefaults } from 'src/utilities/storage';
 
 import { AttachFileForm } from '../AttachFileForm';
@@ -139,6 +140,30 @@ export const getInitialValue = (
   return fromProps ?? fromStorage ?? '';
 };
 
+/**
+ * Sanitizes user input to prevent HTML injection attacks
+ * Uses the centralized sanitizeHTML utility with strict settings
+ *
+ * @param input - The user input string to sanitize
+ * @returns Sanitized plain text string with all HTML removed
+ */
+const sanitizeInput = (input: string): string => {
+  if (!input) return '';
+
+  // Use strict sanitization: no HTML tags allowed
+  const sanitized = sanitizeHTML({
+    sanitizingTier: 'strict',
+    text: input,
+    sanitizeOptions: {
+      ALLOWED_TAGS: [], // Strip all HTML tags
+      ALLOWED_ATTR: [], // Strip all attributes
+      KEEP_CONTENT: true, // Keep text content
+    },
+  });
+
+  return sanitized;
+};
+
 export const SupportTicketDialog = (props: SupportTicketDialogProps) => {
   const {
     open,
@@ -349,13 +374,22 @@ export const SupportTicketDialog = (props: SupportTicketDialogProps) => {
   const handleSubmit = form.handleSubmit(async (values) => {
     const { onSuccess } = props;
 
-    const _description = formatDescription(values, ticketType);
+    // Sanitize all string fields to prevent HTML injection
+    const sanitizedValues = Object.fromEntries(
+      Object.entries(values).map(([key, value]) => [
+        key,
+        typeof value === 'string' ? sanitizeInput(value) : value,
+      ])
+    ) as typeof values;
+
+    const _description = formatDescription(sanitizedValues, ticketType);
 
     // If this is an account limit ticket, we needed the entity type but won't actually send a valid entity selection.
     // Reset the entity type and id back to defaults.
     const _entityType =
-      ticketType === 'accountLimit' ? 'general' : values.entityType;
-    const _entityId = ticketType === 'accountLimit' ? '' : values.entityId;
+      ticketType === 'accountLimit' ? 'general' : sanitizedValues.entityType;
+    const _entityId =
+      ticketType === 'accountLimit' ? '' : sanitizedValues.entityId;
 
     if (!['general', 'none'].includes(_entityType) && !_entityId) {
       form.setError('entityId', {
@@ -369,12 +403,12 @@ export const SupportTicketDialog = (props: SupportTicketDialogProps) => {
     const baseRequestPayload = {
       description: _description,
       severity: selectedSeverity,
-      summary,
+      summary: sanitizedValues.summary,
     };
 
     let requestPayload;
     if (entityType === 'bucket') {
-      const bucketLabel = values.entityInputValue;
+      const bucketLabel = sanitizedValues.entityInputValue;
       requestPayload = {
         bucket: bucketLabel,
         region: _entityId,