Philip Cesar Garay
91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
import React, { useState } from "react";
|
||
import Page from "../../layouts/Page";
|
||
import { background, icons } from "../../assets";
|
||
import MusicLandHeader from "../../components/MusicLandHeader";
|
||
import { goBack, navigate } from "../../navigation/NavigationService";
|
||
import Slider from "../../components/Slider";
|
||
import { Image, Pressable, View } from "react-native";
|
||
import CreateLyricsHeader from "../Writing/components/CreateLyricsHeader";
|
||
import { BlurView } from "expo-blur";
|
||
import { Style } from "../../styles";
|
||
import { responsiveWidth } from "react-native-responsive-dimensions";
|
||
import { gutters, size } from "../../styles/Style";
|
||
import BorderGradientButton from "../../components/BorderGradientButton";
|
||
import GradientButton from "../../components/GradientButton";
|
||
import { Routes } from "../../navigation";
|
||
import ValidateModal from "../../components/modal/ValidateModal";
|
||
|
||
const SongReady = () => {
|
||
const [showValidateModal, setShowValidateModal] = useState(false);
|
||
|
||
return (
|
||
<Page headerType="NONE" backgroundImg={background.studioBG2}>
|
||
<MusicLandHeader onPressBack={goBack} progress={63} />
|
||
<View style={{ flex: 1, marginTop: 16 }}>
|
||
<CreateLyricsHeader
|
||
title="Ta chanson est prête !"
|
||
subTitle="Qu’en penses-tu ?"
|
||
/>
|
||
<View
|
||
style={{
|
||
...size({ size: responsiveWidth(80) }),
|
||
alignSelf: "center",
|
||
borderRadius: 1000,
|
||
overflow: "hidden",
|
||
marginTop: 16,
|
||
}}
|
||
>
|
||
<BlurView
|
||
intensity={40}
|
||
tint="dark"
|
||
style={{ ...Style.containerCenter, flex: 1 }}
|
||
>
|
||
<Image source={icons.disk} />
|
||
</BlurView>
|
||
</View>
|
||
<View style={{ marginTop: 49 }}>
|
||
<Slider value="0" maxValue="2:11" />
|
||
<Pressable
|
||
style={{
|
||
alignSelf: "center",
|
||
...size({ size: 48 }),
|
||
...Style.containerCenter,
|
||
}}
|
||
>
|
||
<Image source={icons.play} />
|
||
</Pressable>
|
||
</View>
|
||
</View>
|
||
<View
|
||
style={{
|
||
paddingBottom: gutters * 2,
|
||
width: "80%",
|
||
alignSelf: "center",
|
||
gap: 12,
|
||
}}
|
||
>
|
||
<BorderGradientButton
|
||
title="Regénérer"
|
||
icon={icons.stars}
|
||
onPress={() =>
|
||
navigate(Routes.Regenerate, {
|
||
progress: 63,
|
||
})
|
||
}
|
||
/>
|
||
<GradientButton
|
||
title="Valider"
|
||
onPress={() => setShowValidateModal(true)}
|
||
/>
|
||
</View>
|
||
<ValidateModal
|
||
visible={showValidateModal}
|
||
onClose={() => setShowValidateModal(false)}
|
||
onPressValidate={() => navigate(Routes.PouchReady)}
|
||
/>
|
||
</Page>
|
||
);
|
||
};
|
||
|
||
export default SongReady;
|