diff --git a/App.tsx b/App.tsx index 700966f1..99efc135 100644 --- a/App.tsx +++ b/App.tsx @@ -12,6 +12,7 @@ import { clientPersister } from './constants/storage'; import { queryClient } from './constants/query-client'; import { CacheManager } from '@georstat/react-native-image-cache'; import { Dirs } from "react-native-file-access"; +import { EventProvider } from "react-native-outside-press"; CacheManager.config = { baseDir: `${Dirs.CacheDir}/images_cache/`, @@ -39,7 +40,9 @@ export default function App(): React.JSX.Element { swipeDirection='down' native={false} > - + + + diff --git a/components/Global/components/track.tsx b/components/Global/components/track.tsx index 8a3ad271..eeb1b5fd 100644 --- a/components/Global/components/track.tsx +++ b/components/Global/components/track.tsx @@ -12,6 +12,7 @@ import { queryConfig } from "@/api/queries/query.config"; import { useSafeAreaFrame } from "react-native-safe-area-context"; import Icon from "../helpers/icon"; import Popover from "../helpers/popover"; +import OutsidePressHandler from "react-native-outside-press"; interface TrackProps { track: BaseItemDto; @@ -48,7 +49,7 @@ export default function Track({ const [popoverOpen, setPopoverOpen] = useState(false); return ( - + setPopoverOpen(false)}> { setPopoverOpen(true) @@ -157,6 +159,6 @@ export default function Track({
{ track.Name ?? "Untitled Track" }
-
+ ) } \ No newline at end of file diff --git a/components/Global/helpers/popover.tsx b/components/Global/helpers/popover.tsx index 35dff9cb..39e04a08 100644 --- a/components/Global/helpers/popover.tsx +++ b/components/Global/helpers/popover.tsx @@ -1,3 +1,4 @@ +import { Colors } from "@/enums/colors"; import React from "react" import { trigger } from "react-native-haptic-feedback"; import { Popover as TamaguiPopover, View } from "tamagui" @@ -23,7 +24,12 @@ export default function Popover(props: PopoverProps) : React.JSX.Element { - { props.children } + + { props.children } + ) diff --git a/package-lock.json b/package-lock.json index b459d30f..1b6b028d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "jellify", - "version": "0.0.1", + "version": "0.1.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "jellify", - "version": "0.0.1", + "version": "0.1.0", "dependencies": { "@animatereactnative/marquee": "^0.2.0", "@gcores/react-native-carplay": "^1.1.12", @@ -39,6 +39,7 @@ "react-native-gesture-handler": "^2.20.0", "react-native-haptic-feedback": "^2.3.3", "react-native-mmkv": "2.12.2", + "react-native-outside-press": "^1.2.2", "react-native-reanimated": "^3.16.3", "react-native-safe-area-context": "^4.11.1", "react-native-screens": "^3.34.0", @@ -20470,6 +20471,16 @@ "react-native": ">=0.71.0" } }, + "node_modules/react-native-outside-press": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/react-native-outside-press/-/react-native-outside-press-1.2.2.tgz", + "integrity": "sha512-TkLB6KefjSXAPMHl2CQBpGnLQHT1wJp455k3vdhTRiT72llIyXrDDLp/gDhgQNNJAd3+XUEO5F+TZr882t8sYw==", + "license": "MIT", + "peerDependencies": { + "react": "*", + "react-native": "*" + } + }, "node_modules/react-native-reanimated": { "version": "3.16.3", "resolved": "https://registry.npmjs.org/react-native-reanimated/-/react-native-reanimated-3.16.3.tgz", diff --git a/package.json b/package.json index 9157df9c..c4a13210 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "react-native-gesture-handler": "^2.20.0", "react-native-haptic-feedback": "^2.3.3", "react-native-mmkv": "2.12.2", + "react-native-outside-press": "^1.2.2", "react-native-reanimated": "^3.16.3", "react-native-safe-area-context": "^4.11.1", "react-native-screens": "^3.34.0",