diff --git a/package-lock.json b/package-lock.json index 0be036b..283aa7a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -45,7 +45,7 @@ "react-native-shadow-2": "^6.0.5", "react-native-svg": "^12.3.0", "react-native-svg-transformer": "^1.0.0", - "react-native-track-player": "^2.1.3", + "react-native-track-player": "^2.2.0-rc3", "react-native-webview": "^11.18.2", "react-redux": "^8.0.1", "redux": "^4.2.0", @@ -14268,9 +14268,9 @@ } }, "node_modules/react-native-track-player": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.1.3.tgz", - "integrity": "sha512-JWKFRu+hr1ECN339RH+c+XDM7HfwvdvS4H1p4cJbhg/9b1CQGPJSrYXEhYkngN0msoxBxAjFyFIhjT2fWDCltA==", + "version": "2.2.0-rc3", + "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.2.0-rc3.tgz", + "integrity": "sha512-Pvmum3MQ5PE8/yOIIPsk00zZk3EzdocUuVUwuBKSCmdKK/3O9YhnZRC3EuT59XCDm23pZZJZDSR44VeXN6Gamg==", "peerDependencies": { "react": ">=16.8.6", "react-native": ">=0.60.0-rc.2", @@ -28569,9 +28569,9 @@ } }, "react-native-track-player": { - "version": "2.1.3", - "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.1.3.tgz", - "integrity": "sha512-JWKFRu+hr1ECN339RH+c+XDM7HfwvdvS4H1p4cJbhg/9b1CQGPJSrYXEhYkngN0msoxBxAjFyFIhjT2fWDCltA==", + "version": "2.2.0-rc3", + "resolved": "https://registry.npmjs.org/react-native-track-player/-/react-native-track-player-2.2.0-rc3.tgz", + "integrity": "sha512-Pvmum3MQ5PE8/yOIIPsk00zZk3EzdocUuVUwuBKSCmdKK/3O9YhnZRC3EuT59XCDm23pZZJZDSR44VeXN6Gamg==", "requires": {} }, "react-native-webview": { diff --git a/package.json b/package.json index 944d7a0..f94bfed 100644 --- a/package.json +++ b/package.json @@ -49,7 +49,7 @@ "react-native-shadow-2": "^6.0.5", "react-native-svg": "^12.3.0", "react-native-svg-transformer": "^1.0.0", - "react-native-track-player": "^2.1.3", + "react-native-track-player": "^2.2.0-rc3", "react-native-webview": "^11.18.2", "react-redux": "^8.0.1", "redux": "^4.2.0", diff --git a/src/assets/icons/xmark.svg b/src/assets/icons/xmark.svg new file mode 100644 index 0000000..407343d --- /dev/null +++ b/src/assets/icons/xmark.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Colors.tsx b/src/components/Colors.tsx index 40ec14b..48e4b19 100644 --- a/src/components/Colors.tsx +++ b/src/components/Colors.tsx @@ -2,7 +2,7 @@ import { BlurView, BlurViewProperties } from '@react-native-community/blur'; import { THEME_COLOR } from 'CONSTANTS'; import React, { PropsWithChildren } from 'react'; import { useContext } from 'react'; -import { ColorSchemeName, Platform, StyleSheet, useColorScheme } from 'react-native'; +import { ColorSchemeName, Platform, StyleSheet, useColorScheme, View } from 'react-native'; const majorPlatformVersion = typeof Platform.Version === 'string' ? parseInt(Platform.Version, 10) : Platform.Version; @@ -100,12 +100,16 @@ export function DefaultStylesProvider(props: DefaultStylesProviderProps) { export function ColoredBlurView(props: PropsWithChildren) { const scheme = useColorScheme(); - return ( + return Platform.OS === 'ios' ? ( = 13 ? 'material' : scheme === 'dark' ? 'extraDark' : 'xlight' } /> + ) : ( + ); } \ No newline at end of file diff --git a/src/screens/modals/Player/components/Backbutton.tsx b/src/screens/modals/Player/components/Backbutton.tsx new file mode 100644 index 0000000..6694906 --- /dev/null +++ b/src/screens/modals/Player/components/Backbutton.tsx @@ -0,0 +1,28 @@ +import React, { useCallback } from 'react'; +import { useNavigation } from '@react-navigation/native'; +import XmarkIcon from 'assets/icons/xmark.svg'; +import { TouchableOpacity } from 'react-native'; +import styled from 'styled-components/native'; + +const Container = styled.View` + padding: 6px 12px; +`; + +function BackButton() { + const navigation = useNavigation(); + + const handlePress = useCallback(() => { + console.log(navigation.canGoBack()); + navigation.goBack(); + }, [navigation]); + + return ( + + + + + + ); +} + +export default BackButton; \ No newline at end of file diff --git a/src/screens/modals/Player/index.tsx b/src/screens/modals/Player/index.tsx index e54ef4c..d940854 100644 --- a/src/screens/modals/Player/index.tsx +++ b/src/screens/modals/Player/index.tsx @@ -6,10 +6,13 @@ import Queue from './components/Queue'; import ConnectionNotice from './components/ConnectionNotice'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; import StreamStatus from './components/StreamStatus'; +import { Platform } from 'react-native'; +import BackButton from './components/Backbutton'; export default function Player() { return ( + {Platform.OS === 'android' && ()}