INFRA-2867 | make options sorted

src/Pages/Dashboard/partials/CreateIncident.module.scss

@@ -155,7 +155,7 @@
   }
 }
 .create-incident-single-selector {
-  width: 321px !important;
+  width: 319px !important;
   min-height: unset;
 }
 .create-incident-single-selector + div {

src/Pages/Dashboard/partials/CreateIncidentForm.tsx

@@ -184,7 +184,7 @@ const CreateIncidentForm: React.FC<CreateIncidentFormProps> = ({
         <div className={styles['Team-wrapper']}>
           <div className={styles['name-wrapper']}>Product</div>
           <ProductSelector
-            options={state.teams}
+            options={state?.teams}
             handleSelectionChange={handleTeamChange}
             selected={state.selectedTeam}
           />

src/Pages/Dashboard/partials/IncidentSingleSelector.tsx

@@ -15,12 +15,15 @@ const IncidentSingleSelector: React.FC<IncidentSingleSelectorProps> = (
   props: IncidentSingleSelectorProps,
 ) => {
   const { options, handleSelectionChange, selected, disabled = false } = props;
+  const sortedOptions = options
+    ?.slice()
+    .sort?.((a, b) => a?.label?.localeCompare(b?.label));
   const handleClearCallback = (): void => {
     handleSelectionChange('');
   };
   return (
     <SingleSelectAutoComplete
-      options={options}
+      options={sortedOptions}
       selectedOption={selected}
       updateSelectedOptions={handleSelectionChange}
       updateClearAllCallback={handleClearCallback}

src/Pages/Dashboard/partials/SearchResultsTable.tsx

@@ -89,7 +89,6 @@ const SearchResultsTable: FC<SearchResultTableProps> = ({
     if (!products || products.length === 0) return '';
     const productNames = products
       ?.map((product: Team) => product.label)
-      ?.sort((a, b) => a.length - b.length)
       ?.join(', ');
     if (productNames.length <= MAX_LENGTH) return productNames;
 

src/Pages/Incidents/Dropdowns/index.tsx

@@ -71,8 +71,9 @@ const Dropdowns: FC = () => {
 
   const updatedSeverities = generateOptions(headerData?.severities);
   const updatedStatuses = generateOptions(headerData?.incidentStatuses);
-  const updatedTeams = useSelector(selectAssignerResponderData)?.assignerTeam
-    ?.teams;
+  const updatedTeams = useSelector(selectAssignerResponderData)
+    ?.assignerTeam?.teams?.slice()
+    ?.sort?.((a, b) => a?.label?.localeCompare(b?.label));
   const initialSeverity = {
     label: incidentData?.severityName,
     value: incidentData?.severityId,