fix(settings): synchronize button animation with arrows of number input

app/components/Settings/BottomScreen/Menus/Options/Language.vue

@@ -28,6 +28,9 @@ const BUTTON_POSITIONS = [
 
 const isAnimating = ref(true);
 
+const bLabel = ref($t("common.goBack"));
+const aLabel = ref($t("common.select"));
+
 const { selected, selectorPosition } = useButtonNavigation({
   buttons: {
     english: [10, 27, 106, 41],
@@ -95,7 +98,11 @@ const animation = reactive({
 
 const animateIntro = async () => {
   isAnimating.value = true;
-  const timeline = gsap.timeline();
+  const timeline = gsap.timeline({
+    onComplete: () => {
+      isAnimating.value = false;
+    },
+  });
   for (let i = 0; i < ROW_COUNT; i++) {
     timeline
       .to(
@@ -109,13 +116,24 @@ const animateIntro = async () => {
         i * ROW_STAGGER,
       );
   }
+  timeline.call(
+    () => {
+      bLabel.value = $t("common.cancel");
+      aLabel.value = $t("common.confirm");
+    },
+    [],
+    SUBMENU_LABEL_CHANGE_DELAY,
+  );
   await timeline;
-  isAnimating.value = false;
 };
 
 const animateOutro = async () => {
   isAnimating.value = true;
-  const timeline = gsap.timeline();
+  const timeline = gsap.timeline({
+    onComplete: () => {
+      isAnimating.value = false;
+    },
+  });
   for (let i = 0; i < ROW_COUNT; i++) {
     timeline
       .to(
@@ -205,8 +223,8 @@ defineOptions({
 <template>
   <CommonButtons
     :y-offset="confirmationModal.buttonsYOffset + store.submenuButtonsOffsetY"
-    :b-label="$t('common.cancel')"
-    :a-label="$t('common.confirm')"
+    :b-label="bLabel"
+    :a-label="aLabel"
     @activate-b="handleActivateB"
   />