feat: tickets

src/providers/PlayerProvider.js

@@ -42,6 +42,7 @@ const HIDDEN_ROUTE_NAMES = new Set([
   Routes.PlaybackExample,
   Routes.PlaybackOnboarding,
   Routes.Playback,
+  Routes.PlaybackGuide,
   Routes.RecordPlayback,
   Routes.RecordedPlayback,
   Routes.ChooseDecor,

src/screens/cover/PouchReady.js

@@ -1,6 +1,12 @@
 import { BlurView } from "expo-blur";
 import { Image as ExpoImage } from "expo-image";
-import React, { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import React, {
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
 import {
   ActivityIndicator,
   Image,
@@ -9,6 +15,8 @@ import {
   Text,
   TextInput,
   View,
+  KeyboardAvoidingView,
+  Platform,
 } from "react-native";
 import { background, icons } from "../../assets";
 import alert from "../../components/Alert";
@@ -220,10 +228,7 @@ const PouchReady = () => {
       const start = coverProgressStartRef.current;
       if (!start) return;
       const elapsed = Date.now() - start.getTime();
-      const ratio = Math.max(
-        0,
-        Math.min(1, elapsed / COVER_FAKE_DURATION_MS),
-      );
+      const ratio = Math.max(0, Math.min(1, elapsed / COVER_FAKE_DURATION_MS));
       const next = COVER_PROGRESS_MAX * ratio;
       setCoverProgress((prev) => {
         if (prev >= COVER_PROGRESS_MAX) return COVER_PROGRESS_MAX;
@@ -310,6 +315,10 @@ const PouchReady = () => {
   return (
     <Page backgroundImg={background.studioBG2} headerType="NONE">
       <MusicLandHeader onPressBack={goBack} progress={72} />
+      <KeyboardAvoidingView
+        behavior={Platform.OS === "ios" ? "padding" : "height"}
+        style={{ flex: 1 }}
+      >
         <View style={{ flex: 1, marginTop: 0 }}>
           <CreateLyricsHeader
             title={
@@ -319,7 +328,7 @@ const PouchReady = () => {
             }
           />
           <View style={{ flex: 1, ...Style.containerCenter }}>
-          <View style={{ width: isWeb ? "80%" : "100%", gap: 24 }}>
+            <View style={{ width: isWeb ? "80%" : "80%", gap: 24 }}>
               <View
                 style={{
                   width: "100%",
@@ -489,7 +498,9 @@ const PouchReady = () => {
                       <View style={styles.dropdownArea}>
                         <Pressable
                           style={styles.dropdownTrigger}
-                        onPress={() => setIsPresetDropdownOpen((prev) => !prev)}
+                          onPress={() =>
+                            setIsPresetDropdownOpen((prev) => !prev)
+                          }
                         >
                           <Text
                             style={styles.dropdownTriggerLabel}
@@ -519,8 +530,12 @@ const PouchReady = () => {
                                   key={styleOption}
                                   style={[
                                     styles.dropdownOption,
-                                  !isLast ? styles.dropdownOptionDivider : null,
-                                  isActive ? styles.dropdownOptionActive : null,
+                                    !isLast
+                                      ? styles.dropdownOptionDivider
+                                      : null,
+                                    isActive
+                                      ? styles.dropdownOptionActive
+                                      : null,
                                   ]}
                                   onPress={() => {
                                     setSelectedPresetStyle(styleOption);
@@ -616,6 +631,7 @@ const PouchReady = () => {
             />
           )}
         </View>
+      </KeyboardAvoidingView>
     </Page>
   );
 };