feat(settings): block interactions while animation is happening

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

@@ -9,6 +9,7 @@ const { assets } = useAssets();
 const { onRender } = useScreen();
 
 const handleActivateB = () => {
+  if (isAnimating.value) return;
   confirmationModal.open({
     text: $t("settings.options.2048.quitConfirmation"),
     onConfirm: () => {},
@@ -22,6 +23,7 @@ const handleActivateB = () => {
 };
 
 const handleActivateA = () => {
+  if (isAnimating.value) return;
   if (isDead()) {
     resetBoard();
     return;
@@ -70,6 +72,8 @@ const SLIDE_DURATION = 0.25;
 const SCORE_OFFSET = -20;
 const SCORE_DURATION = 0.15;
 
+const isAnimating = ref(true);
+
 const intro = reactive({
   frameOffsetY: SLIDE_OFFSET,
   frameOpacity: 0,
@@ -137,6 +141,7 @@ const animateSpawnAll = () => {
 };
 
 const animateIntro = async () => {
+  isAnimating.value = true;
   buildTilesFromBoard();
 
   await gsap
@@ -156,9 +161,11 @@ const animateIntro = async () => {
       { scoreOffsetY: 0, duration: SCORE_DURATION, ease: "none" },
       SLIDE_DURATION,
     );
+  isAnimating.value = false;
 };
 
 const animateOutro = async () => {
+  isAnimating.value = true;
   await gsap
     .timeline()
     .to(
@@ -530,6 +537,7 @@ const slide = (rowDir: number, colDir: number) => {
 };
 
 useKeyDown((key) => {
+  if (isAnimating.value) return;
   switch (key) {
     // TODO: remove this, testing only
     case "n":