chore: loading code moved to common util

Author: shivani170

src/Shared/Components/SelectPicker/SelectPicker.component.tsx

@@ -33,6 +33,7 @@ import { SelectPickerOptionType, SelectPickerProps, SelectPickerVariantType } fr
 import FormFieldWrapper from '../FormFieldWrapper/FormFieldWrapper'
 import { getFormFieldAriaAttributes } from '../FormFieldWrapper'
 import {
+    renderLoadingMessage,
     SelectPickerClearIndicator,
     SelectPickerControl,
     SelectPickerDropdownIndicator,
@@ -180,6 +181,7 @@ import { GenericSectionErrorState } from '../GenericSectionErrorState'
  * />
  * ```
  */
+
 const SelectPicker = <OptionValue, IsMulti extends boolean>({
     error,
     icon,
@@ -332,8 +334,6 @@ const SelectPicker = <OptionValue, IsMulti extends boolean>({
         return null
     }
 
-    const renderLoadingMessage = () => <p className="m-0 cn-7 fs-13 fw-4 lh-20 py-6 px-8 dc__loading-dots">Loading</p>
-
     const renderDisabledTippy = (children: ReactElement) => (
         <Tippy content={disabledTippyContent} placement="top" className="default-tt" arrow={false}>
             {children}

src/Shared/Components/SelectPicker/common.tsx

@@ -425,3 +425,7 @@ export const SelectPickerGroupHeading = <OptionValue,>({
         </components.GroupHeading>
     )
 }
+
+export const renderLoadingMessage = () => (
+    <p className="m-0 cn-7 fs-13 fw-4 lh-20 py-6 px-8 dc__loading-dots">Loading</p>
+)