feat: Remove ionicons v2 dependency on widget (#3402)

app/javascript/widget/components/ChatAttachment.vue

@@ -4,10 +4,10 @@
     accept="image/*, application/pdf, audio/mpeg, video/mp4, audio/ogg, text/csv"
     @input-file="onFileUpload"
   >
-    <span class="attachment-button">
-      <i v-if="!isUploading.image" class="ion-android-attach" />
+    <button class="icon-button flex items-center justify-center">
+      <fluent-icon v-if="!isUploading.image" icon="attach" />
       <spinner v-if="isUploading" size="small" />
-    </span>
+    </button>
   </file-upload>
 </template>
 
@@ -17,9 +17,9 @@ import Spinner from 'shared/components/Spinner.vue';
 import { checkFileSizeLimit } from 'shared/helpers/FileHelper';
 import { MAXIMUM_FILE_UPLOAD_SIZE } from 'shared/constants/messages';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
-
+import FluentIcon from 'shared/components/FluentIcon/Index.vue';
 export default {
-  components: { FileUpload, Spinner },
+  components: { FluentIcon, FileUpload, Spinner },
   props: {
     onAttach: {
       type: Function,
@@ -66,28 +66,6 @@ export default {
   },
 };
 </script>
-<style scoped lang="scss">
-@import '~widget/assets/scss/variables.scss';
-@import '~widget/assets/scss/mixins.scss';
-
-.attachment-button {
-  @include button-size;
-
-  background: transparent;
-  border: 0;
-  cursor: pointer;
-  position: relative;
-  width: 20px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  i {
-    font-size: $font-size-large;
-    color: $color-gray;
-  }
-}
-</style>
 <style lang="scss">
 .file-uploads .attachment-button + label {
   cursor: pointer;