chore: replace v3button with formbutton

app/javascript/dashboard/routes/dashboard/settings/personal/AccessToken.vue

@@ -10,7 +10,7 @@
       :has-error="false"
       :error-message="$t('REGISTER.FULL_NAME.ERROR')"
     />
-    <v3-button
+    <form-button
       type="submit"
       size="large"
       icon="text-copy"
@@ -19,12 +19,12 @@
       @click="onClick"
     >
       {{ $t('PROFILE_SETTINGS.FORM.ACCESS_TOKEN.COPY') }}
-    </v3-button>
+    </form-button>
   </div>
 </template>
 <script setup>
 import FormInput from 'v3/components/Form/Input.vue';
-import V3Button from 'v3/components/Form/Button.vue';
+import FormButton from 'v3/components/Form/Button.vue';
 import { copyTextToClipboard } from 'shared/helpers/clipboard';
 
 const props = defineProps({

app/javascript/dashboard/routes/dashboard/settings/personal/Index.vue

@@ -110,10 +110,11 @@ import alertMixin from 'shared/mixins/alertMixin';
 import { mapGetters } from 'vuex';
 import { clearCookiesOnLogout } from '../../../../store/utils/api';
 import { hasValidAvatarUrl } from 'dashboard/helper/URLHelper';
-import NotificationPreferences from './NotificationPreferences.vue';
-import AudioNotifications from './AudioNotifications.vue';
+
 import UserProfilePicture from './UserProfilePicture.vue';
 import UserBasicDetails from './UserBasicDetails.vue';
+import NotificationPreferences from './NotificationPreferences.vue';
+import AudioNotifications from './AudioNotifications.vue';
 import MessageSignature from './MessageSignature.vue';
 import ProfileWrapper from './ProfileWrapper.vue';
 import HotKeyCard from './HotKeyCard.vue';
@@ -140,7 +141,6 @@ export default {
       name: '',
       displayName: '',
       email: '',
-      isProfileUpdating: false,
       errorMessage: '',
       hotKeys: [
         {
@@ -198,7 +198,6 @@ export default {
     isEditorHotKeyEnabled,
     async updateUser(user) {
       const { name, email, displayName } = user;
-      this.isProfileUpdating = true;
       const hasEmailChanged = this.currentUser.email !== email;
       try {
         await this.$store.dispatch('updateProfile', {
@@ -207,7 +206,6 @@ export default {
           avatar: this.avatarFile,
           displayName: displayName,
         });
-        this.isProfileUpdating = false;
         if (hasEmailChanged) {
           clearCookiesOnLogout();
           this.errorMessage = this.$t('PROFILE_SETTINGS.AFTER_EMAIL_CHANGED');
@@ -219,7 +217,6 @@ export default {
           this.errorMessage = error.response.data.error;
         }
       } finally {
-        this.isProfileUpdating = false;
         this.showAlert(this.errorMessage);
       }
     },

app/javascript/dashboard/routes/dashboard/settings/personal/MessageSignature.vue

@@ -10,7 +10,7 @@
       :enable-suggestions="false"
       :show-image-resize-toolbar="true"
     />
-    <v3-button
+    <form-button
       type="submit"
       color-scheme="primary"
       variant="solid"
@@ -18,7 +18,7 @@
       @click.prevent="updateSignature"
     >
       {{ $t('PROFILE_SETTINGS.FORM.MESSAGE_SIGNATURE_SECTION.BTN_TEXT') }}
-    </v3-button>
+    </form-button>
   </div>
 </template>
 
@@ -28,12 +28,12 @@ import { mapGetters } from 'vuex';
 import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
 import alertMixin from 'shared/mixins/alertMixin';
 import { MESSAGE_SIGNATURE_EDITOR_MENU_OPTIONS } from 'dashboard/constants/editor';
-import V3Button from 'v3/components/Form/Button.vue';
+import FormButton from 'v3/components/Form/Button.vue';
 
 export default {
   components: {
     WootMessageEditor,
-    V3Button,
+    FormButton,
   },
   mixins: [alertMixin],
   data() {

app/javascript/dashboard/routes/dashboard/settings/personal/UserBasicDetails.vue

@@ -34,24 +34,24 @@
       :error-message="$t('PROFILE_SETTINGS.FORM.EMAIL.ERROR')"
       @blur="$v.userEmail.$touch"
     />
-    <v3-button
+    <form-button
       type="submit"
       color-scheme="primary"
       variant="solid"
       size="large"
     >
       {{ $t('PROFILE_SETTINGS.BTN_TEXT') }}
-    </v3-button>
+    </form-button>
   </form>
 </template>
 <script>
-import V3Button from 'v3/components/Form/Button.vue';
+import FormButton from 'v3/components/Form/Button.vue';
 import FormInput from 'v3/components/Form/Input.vue';
 import { required, minLength, email } from 'vuelidate/lib/validators';
 import alertMixin from 'shared/mixins/alertMixin';
 export default {
   components: {
-    V3Button,
+    FormButton,
     FormInput,
   },
   mixins: [alertMixin],

app/javascript/dashboard/routes/dashboard/settings/personal/UserProfilePicture.vue

@@ -31,7 +31,7 @@
         />
         <button
           v-if="src && shouldShowUploadIcon"
-          class="absolute z-10 flex items-center justify-center w-6 h-6 p-1 border border-white rounded-full select-none reset-base -top-2 -right-2 dark:border-white bg-slate-200 dark:bg-slate-700"
+          class="absolute z-10 flex items-center justify-center w-6 h-6 p-1 border border-white rounded-full select-none reset-base -top-2 -right-2 bg-ash-300"
           @click="onAvatarDelete"
         >
           <fluent-icon