feat: tickets

src/screens/Playback/RecordPlayback.web.js

@@ -669,9 +669,10 @@ const RecordPlayback = ({ route }) => {
   return (
     <Page
       style={{ flex: 1 }}
-      containerStyle={{ backgroundColor: Palette.tran }}
+      // containerStyle={{ backgroundColor: Palette.gray }}
       headerType="NONE"
-      backgroundImg={background.playbackBG2}
+      backgroundColor={Palette.grayMid}
+    // backgroundImg={background.playbackBG2}
     >
       <MusicLandHeader progress={9} onPressBack={goBack} />
 
@@ -909,7 +910,7 @@ const RecordPlayback = ({ route }) => {
               position: "absolute",
               left: 0,
               right: 0,
-              bottom: bottom + 130,
+              bottom: bottom + 180,
               paddingHorizontal: gutters,
             }}
           >

src/screens/Playback/RecordedPlayback.js

@@ -11,7 +11,7 @@ import ProgressSlider from "../../components/player/ProgressSlider";
 import Page from "../../layouts/Page";
 import { Routes } from "../../navigation";
 import { goBack, navigate } from "../../navigation/NavigationService";
-import { gutters } from "../../styles";
+import { gutters, Palette } from "../../styles";
 const RecordedPlayback = ({ route }) => {
   const { videoUri, project } = route.params || {};
   const songUrl = project?.songUrl || null;
@@ -163,7 +163,7 @@ const RecordedPlayback = ({ route }) => {
   };
 
   return (
-    <Page backgroundImg={background.playbackBG2} headerType="NONE">
+    <Page backgroundColor={Palette.grayMid} headerType="NONE">
       <MusicLandHeader progress={19} onPressBack={goBack} />
       <View
         style={{ flex: 1, paddingTop: 12, gap: 14, paddingBottom: gutters * 2 }}

src/screens/Playback/RecordedPlayback.web.js

@@ -262,7 +262,7 @@ const RecordedPlayback = ({ route }) => {
       containerStyle={{
         alignItems: "none",
       }}
-      backgroundImg={background.playbackBG2}
+      backgroundColor={Palette.grayMid}
       headerType="NONE"
     >
       <MusicLandHeader

src/screens/Production/PlaybackDownload.js

@@ -399,11 +399,12 @@ const PlaybackDownload = ({ route }) => {
   return (
     <>
       <Page
-        backgroundImg={
-          action === "playback"
-            ? background.playbackBG2
-            : background.productionBG2
-        }
+        // backgroundImg={
+        //   action === "playback"
+        //     ? background.playbackBG2
+        //     : background.productionBG2
+        // }
+        backgroundColor={Palette.grayMid}
         headerType="NONE"
       >
         <MusicLandHeader onPressBack={goBack} progress={50} />

src/screens/Studio/GeneratingSong.js

@@ -1,4 +1,4 @@
-import { useIsFocused } from "@react-navigation/native";
+import { useIsFocused, useNavigation, StackActions } from "@react-navigation/native";
 import { BlurView } from "expo-blur";
 import moment from "moment";
 import React, { useEffect, useMemo, useRef, useState } from "react";
@@ -21,6 +21,7 @@ import { FONT_FAMILY } from "../../styles/Fonts";
 import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
 
 const GeneratingSong = () => {
+  const navigation = useNavigation();
   const { selectedProjectId, selectedProject } = useUser();
   const [progress, setProgress] = useState(0);
   const { setIsLoading } = useMinuit();
@@ -117,9 +118,9 @@ const GeneratingSong = () => {
     if (!selectedProjectId) return;
     if (selectedProject?.musicStatus === "GENERATED" && !navigatedRef.current) {
       navigatedRef.current = true;
-      navigate(Routes.SongReady);
+      navigation.dispatch(StackActions.replace(Routes.SongReady));
     }
-  }, [selectedProject?.musicStatus, selectedProjectId]);
+  }, [selectedProject?.musicStatus, selectedProjectId, navigation]);
 
   const effectiveConfig = useMemo(() => {
     // Use selectedProject.musicConfig only

src/styles/Palette.js

@@ -38,6 +38,7 @@ const Palette = {
   glass: "#73737324",
   grayMid: "#8C8C8C",
   gray: "#E5E5E5",
+
 };
 
 export default Palette;