logos

src/assets/index.js

@@ -71,7 +71,12 @@ import heart from "./icons/heart.png";
 import heartOutline from "./icons/heartOutline.png";
 import hitParadeLogo from "./icons/hitParadeLogo.png";
 import more from "./icons/more.png";
+import musicLandAccueil from "./icons/musicLandAccueil.png";
 import musicLandLogo from "./icons/musicLandLogo.png";
+import musicLandProduction from "./icons/musicLandProduction.png";
+import musicLandStudio from "./icons/musicLandStudio.png";
+import musicLandVideo from "./icons/musicLandVideo.png";
+import musicLandWriting from "./icons/musicLandWriting.png";
 import pause from "./icons/pause.png";
 import play from "./icons/play.png";
 import share from "./icons/share.png";
@@ -179,6 +184,11 @@ export const icons = {
   disk,
   stars,
   musicLandLogo,
+  musicLandWriting,
+  musicLandProduction,
+  musicLandStudio,
+  musicLandVideo,
+  musicLandAccueil,
   close,
   heart,
   heartOutline,

src/components/MusicLandHeader.js

@@ -10,11 +10,12 @@ const MusicLandHeader = ({
   onPressSkip,
   showSkip = false,
   progress = 1,
+  logo = null,
 }) => {
   return (
     <View style={{ alignItems: "center", gap: 16 }}>
       <Image
-        source={icons.musicLandLogo}
+        source={logo || icons.musicLandLogo}
         style={{ alignSelf: "center", height: 150, resizeMode: "contain" }}
       />
       <View style={{ width: "100%", ...Style.containerRow, gap: 16 }}>

src/screens/Studio/Compose.js

@@ -1,20 +1,24 @@
-import { View, StyleSheet, Image } from "react-native";
 import React, { useState } from "react";
-import { ai, background } from "../../assets";
+import { Image, StyleSheet, View } from "react-native";
-import Page from "../../layouts/Page";
+import { ai, background, icons } from "../../assets";
-import { goBack, navigate } from "../../navigation/NavigationService";
-import MusicLandHeader from "../../components/MusicLandHeader";
-import { Routes } from "../../navigation";
-import GradientButton from "../../components/GradientButton";
-import { gutters } from "../../styles";
 import FullscreenIntroVideo from "../../components/FullscreenIntroVideo";
+import GradientButton from "../../components/GradientButton";
+import MusicLandHeader from "../../components/MusicLandHeader";
+import Page from "../../layouts/Page";
+import { Routes } from "../../navigation";
+import { goBack, navigate } from "../../navigation/NavigationService";
+import { gutters } from "../../styles";
 
 const Compose = () => {
   const [showIntro, setShowIntro] = useState(true);
   return (
     <Page backgroundImg={background.studioBG2} headerType="NONE">
       <Image source={ai.theo} style={styles.img} resizeMode="contain" />
-      <MusicLandHeader onPressBack={goBack} progress={9} />
+      <MusicLandHeader
+        onPressBack={goBack}
+        progress={9}
+        logo={icons.musicLandStudio}
+      />
       <View
         style={{ flex: 1, position: "relative", justifyContent: "flex-end" }}
       >

src/screens/Studio/ComposeSong.js

@@ -1,7 +1,7 @@
 import React, { useMemo, useRef, useState } from "react";
 import { Dimensions, View } from "react-native";
 import SwiperFlatList from "react-native-swiper-flatlist";
-import { background } from "../../assets";
+import { background, icons } from "../../assets";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import firebase from "../../config/firebase";
@@ -128,7 +128,11 @@ const ComposeSong = () => {
 
   return (
     <Page backgroundImg={background.studioBG2} headerType="NONE">
-      <MusicLandHeader onPressBack={onPressBack} progress={progress} />
+      <MusicLandHeader
+        onPressBack={onPressBack}
+        progress={progress}
+        logo={icons.musicLandStudio}
+      />
       <View style={{ flex: 1, paddingBottom: gutters, gap: 48 }}>
         <View
           style={{ flex: 1 }}

src/screens/Studio/ComposeSong.web.js

@@ -6,7 +6,7 @@ import React, {
   useState,
 } from "react";
 import { Dimensions, FlatList, View } from "react-native";
-import { background } from "../../assets";
+import { background, icons } from "../../assets";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import firebase from "../../config/firebase";
@@ -172,7 +172,11 @@ const ComposeSong = () => {
 
   return (
     <Page backgroundImg={background.studioBG2} headerType="NONE">
-      <MusicLandHeader onPressBack={onPressBack} progress={progress} />
+      <MusicLandHeader
+        onPressBack={onPressBack}
+        progress={progress}
+        logo={icons.musicLandStudio}
+      />
       <View style={{ flex: 1, paddingBottom: gutters, gap: 48 }}>
         <View
           style={{ flex: 1 }}

src/screens/Studio/GeneratingSong.js

@@ -5,7 +5,7 @@ import React, { useEffect, useMemo, useRef, useState } from "react";
 import { Image, Platform, Text, View } from "react-native";
 import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
 import { responsiveHeight } from "react-native-responsive-dimensions";
-import { ai, background } from "../../assets";
+import { ai, background, icons } from "../../assets";
 import AppAlert from "../../components/Alert";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
@@ -208,6 +208,7 @@ const GeneratingSong = () => {
       <MusicLandHeader
         onPressBack={() => navigate(Routes.Home)}
         progress={63}
+        logo={icons.musicLandStudio}
       />
       <View style={{ flex: 1, marginTop: 16 }}>
         <CreateLyricsHeader

src/screens/Writing/CreateLyricsWithAi.js

@@ -2,7 +2,7 @@ import React, { useMemo, useRef, useState } from "react";
 import { Dimensions, Platform, View } from "react-native";
 import { responsiveHeight } from "react-native-responsive-dimensions";
 import { SwiperFlatList } from "react-native-swiper-flatlist";
-import { background } from "../../assets";
+import { background, icons } from "../../assets";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import { OTHER_OBJECTIVE_OPTION, OTHER_STYLE_OPTION } from "../../data/data";
@@ -336,7 +336,11 @@ const CreateLyricsWithAi = () => {
       keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 100}
       backgroundImg={background.writingBG}
     >
-      <MusicLandHeader onPressBack={onPressBack} progress={progress} />
+      <MusicLandHeader
+        onPressBack={onPressBack}
+        progress={progress}
+        logo={icons.musicLandWriting}
+      />
       <View
         style={{
           flex: 1,

src/screens/Writing/CreateLyricsWithAi.web.js

@@ -1,7 +1,7 @@
 import React, { useMemo, useRef, useState } from "react";
 import { Dimensions, FlatList, Platform, View } from "react-native";
 import { responsiveHeight } from "react-native-responsive-dimensions";
-import { background } from "../../assets";
+import { background, icons } from "../../assets";
 import GradientButton from "../../components/GradientButton";
 import MusicLandHeader from "../../components/MusicLandHeader";
 import { OTHER_OBJECTIVE_OPTION, OTHER_STYLE_OPTION } from "../../data/data";
@@ -416,7 +416,7 @@ const CreateLyricsWithAi = () => {
       offset: containerWidth * index,
       index,
     }),
-    [containerWidth],
+    [containerWidth]
   );
 
   // Sync scroll position and progress with selectedIndex
@@ -440,7 +440,11 @@ const CreateLyricsWithAi = () => {
       keyboardVerticalOffset={Platform.OS === "ios" ? 64 : 100}
       backgroundImg={background.writingBgWeb}
     >
-      <MusicLandHeader onPressBack={onPressBack} progress={progress} />
+      <MusicLandHeader
+        onPressBack={onPressBack}
+        progress={progress}
+        logo={icons.musicLandWriting}
+      />
       <View
         style={{
           flex: 1,

src/screens/Writing/Lyrics.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useMemo, useRef, useState } from "react";
 import { ScrollView, StyleSheet, Text, View } from "react-native";
 import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
-import { background } from "../../assets";
+import { background, icons } from "../../assets";
 import alert from "../../components/Alert";
 import BorderGradientButton from "../../components/BorderGradientButton";
 import GradientButton from "../../components/GradientButton";
@@ -272,6 +272,7 @@ const Lyrics = ({ navigation }) => {
       <MusicLandHeader
         onPressBack={() => navigate(Routes.Home)}
         progress={95}
+        logo={icons.musicLandWriting}
       />
       <View
         style={{

src/screens/Writing/WritingLyrics.js

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { Image, StyleSheet, View } from "react-native";
 import useMinuit from "react-native-minuit/src/hooks/useMinuit.js";
-import { ai, background } from "../../assets";
+import { ai, background, icons } from "../../assets";
 import BorderGradientButton from "../../components/BorderGradientButton";
 import FullscreenIntroVideo from "../../components/FullscreenIntroVideo";
 import GradientButton from "../../components/GradientButton";
@@ -48,7 +48,11 @@ const WritingLyrics = () => {
       headerType="NONE"
     >
       <Image source={ai.nathalie} style={styles.img} resizeMode="contain" />
-      <MusicLandHeader onPressBack={goBack} progress={9} />
+      <MusicLandHeader
+        onPressBack={goBack}
+        progress={9}
+        logo={icons.musicLandWriting}
+      />
       <View
         style={{ flex: 1, position: "relative", justifyContent: "flex-end" }}
       >