[MHV-55186] Update all V1 components to V3 web components on SM MHV

src/applications/mhv/secure-messaging/components/Alerts/CernerTransitioningFacilityAlert.jsx

@@ -73,7 +73,7 @@ const CernerTransitioningFacilityAlert = () => {
     () => {
       return (
         isTranstioningFacility && (
-          <va-alert status="warning" class="vads-u-margin-y--2">
+          <va-alert status="warning" class="vads-u-margin-y--2" uswds>
             <h1 slot="headline">
               Your health facility is moving to My VA Health
             </h1>
@@ -105,7 +105,7 @@ const CernerTransitioningFacilityAlert = () => {
     () => {
       return (
         isTranstioningFacility && (
-          <va-alert status="warning" class="vads-u-margin-y--2">
+          <va-alert status="warning" class="vads-u-margin-y--2" uswds>
             <h1 slot="headline">
               You can’t send messages to some of your care teams right now
             </h1>

src/applications/mhv/secure-messaging/components/AttachmentsList.jsx

@@ -123,6 +123,9 @@ const AttachmentsList = props => {
       {attachFileSuccess &&
         attachments.length > 0 && (
           <VaAlert
+            uswds
+            closeable
+            closeBtnAriaLabel="Close notification"
             aria-live="polite"
             aria-label="file successfully attached"
             ref={attachFileAlertRef}
@@ -133,28 +136,12 @@ const AttachmentsList = props => {
             full-width="false"
             show-icon
             status="success"
-            onCloseEvent={handleSuccessAlertClose}
+            onCloseEvent={() => {
+              setAttachFileSuccess(false);
+              handleSuccessAlertClose();
+            }}
           >
-            <p className="vads-u-margin-bottom--0">File attached</p>
-            <button
-              className="close-success-alert-button vads-u-padding--0p5"
-              id="close-success-alert-button"
-              data-testid="close-success-alert-button"
-              aria-label="Close notification"
-              type="button"
-              onClick={() => {
-                setAttachFileSuccess(false);
-                handleSuccessAlertClose();
-              }}
-            >
-              <i
-                className="fas fa-times-circle vads-u-color--black"
-                style={{ fontSize: '2.4rem' }}
-                alt="Close notification icon"
-                aria-hidden="true"
-                role="presentation"
-              />
-            </button>
+            <p className="vads-u-margin-y--0">File attached</p>
           </VaAlert>
         )}
 

src/applications/mhv/secure-messaging/components/BeforeMessageAddlInfo.jsx

@@ -3,6 +3,7 @@ import { VaAdditionalInfo } from '@department-of-veterans-affairs/component-libr
 
 const BeforeMessageAddlInfo = () => (
   <VaAdditionalInfo
+    uswds
     trigger="Before you send a message"
     disable-analytics={false}
     disable-border={false}

src/applications/mhv/secure-messaging/components/ComposeForm/CategoryInput.jsx

@@ -28,6 +28,7 @@ const CategoryInput = props => {
 
       {categories?.length > 0 && (
         <VaRadio
+          uswds
           required
           enable-analytics
           data-testid="compose-message-categories"
@@ -38,10 +39,10 @@ const CategoryInput = props => {
         >
           {categories?.map((item, i) => (
             <VaRadioOption
+              uswds
               data-dd-privacy="mask"
               data-testid="compose-category-radio-button"
               data-dd-action-name="Compose Category Radio Button"
-              style={{ display: 'flex' }}
               key={i}
               label={
                 RadioCategories[item]