Philip Cesar Garay
50 lines
1.3 KiB
JavaScript
50 lines
1.3 KiB
JavaScript
import { View, Text, Image, Pressable } from "react-native";
|
|
import React from "react";
|
|
import { icons } from "../assets";
|
|
import { Palette, Style } from "../styles";
|
|
import ProgressBar from "./ProgressBar";
|
|
import { FONT_FAMILY } from "../styles/Fonts";
|
|
|
|
const MusicLandHeader = ({
|
|
onPressBack,
|
|
onPressSkip,
|
|
showSkip = false,
|
|
progress = 1,
|
|
}) => {
|
|
return (
|
|
<View style={{ alignItems: "center", gap: 16 }}>
|
|
<Image source={icons.musicLandLogo} />
|
|
<View style={{ width: "100%", ...Style.containerRow, gap: 16 }}>
|
|
<Pressable
|
|
style={{ width: 24, height: 24, ...Style.containerCenter }}
|
|
onPress={onPressBack}
|
|
>
|
|
<Image
|
|
source={icons.chevronDown}
|
|
style={{ width: 15, height: 15, transform: [{ rotate: "90deg" }] }}
|
|
resizeMode="contain"
|
|
/>
|
|
</Pressable>
|
|
<View style={{ flex: 1 }}>
|
|
<ProgressBar progress={progress} />
|
|
</View>
|
|
{showSkip && (
|
|
<Pressable onPress={onPressSkip}>
|
|
<Text
|
|
style={{
|
|
fontSize: 14,
|
|
color: Palette.white,
|
|
fontFamily: FONT_FAMILY.InterRegular,
|
|
}}
|
|
>
|
|
Passer
|
|
</Text>
|
|
</Pressable>
|
|
)}
|
|
</View>
|
|
</View>
|
|
);
|
|
};
|
|
|
|
export default MusicLandHeader;
|