AbhaySakariya
AbhaySakariya

Reputation: 44

IOS notification controls not working in Preview Build RNTP React Native Expo

Facing an Issue in IOS preview build App

im using expo with react native to build an audio player app for android and ios

while developing and testing using expo development build all the functionality of RNTP works fine including notification controls like play pause next previous and progress bar,

then i build an app for ios and andorid using eas build -p ios||android --profile preview2

after building preview app i install it in actual device for android directly install the app and all the functionality and app works super fine but in case of ios i distribute my app through testFlight and install it in actual device, all the things works perfectly except notification controls like play pause next previous and progress bar, does not works here

i have checked so many stacks and git issue but not excatly identify what is the issue

help me solve this issue, pls

this is my dependencies

"dependencies": {
    "@gorhom/bottom-sheet": "^4.6.3",
    "@react-native-community/datetimepicker": "8.0.1",
    "@react-native-community/slider": "4.5.2",
    "@react-native-firebase/analytics": "^17.4.2",
    "@react-native-firebase/app": "^17.4.2",
    "@react-native-firebase/auth": "^17.4.2",
    "@react-native-firebase/messaging": "^17.4.2",
    "@react-native-menu/menu": "^1.2.0",
    "@react-navigation/material-bottom-tabs": "^6.2.28",
    "@react-navigation/material-top-tabs": "^6.6.13",
    "@react-navigation/native": "^6.1.17",
    "@react-navigation/native-stack": "^6.9.26",
    "axios": "^1.6.8",
    "expo": "~51.0.39",
    "expo-av": "~14.0.7",
    "expo-calendar": "~13.0.5",
    "expo-contacts": "~13.0.5",
    "expo-dev-client": "~4.0.29",
    "expo-file-system": "^17.0.1",
    "expo-font": "~12.0.10",
    "expo-haptics": "~13.0.1",
    "expo-image-picker": "~15.1.0",
    "expo-linear-gradient": "^13.0.2",
    "expo-linking": "^6.3.1",
    "expo-media-library": "~16.0.5",
    "expo-network": "^6.0.1",
    "expo-notifications": "~0.28.19",
    "expo-status-bar": "~1.12.1",
    "expo-updates": "~0.25.28",
    "react": "18.2.0",
    "react-native": "0.74.5",
    "react-native-branch": "^6.2.2",
    "react-native-country-codes-picker": "^2.3.5",
    "react-native-gesture-handler": "~2.16.1",
    "react-native-hyperlink": "^0.0.22",
    "react-native-linear-gradient": "^2.8.3",
    "react-native-masonry-list": "^2.16.2",
    "react-native-mmkv": "^2.12.2",
    "react-native-pager-view": "6.3.0",
    "react-native-paper": "^5.12.3",
    "react-native-reanimated": "~3.10.1",
    "react-native-render-html": "^6.3.4",
    "react-native-safe-area-context": "4.10.5",
    "react-native-screens": "3.31.1",
    "react-native-svg": "15.2.0",
    "react-native-svg-transformer": "^1.5.0",
    "react-native-tab-view": "^3.5.2",
    "react-native-track-player": "^4.1.1",
    "react-native-vector-icons": "^10.1.0",
    "react-native-webview": "13.8.6",
    "react-native-youtube-iframe": "^2.3.0",
    "react-redux": "^9.1.2",
    "redux": "^5.0.1",
    "redux-thunk": "^3.1.0"
  },

This is the trackplayer service file code

const playBackService = async () => {
  // Add more event listeners as needed
  TrackPlayer.addEventListener("remote-play", () => {
    TrackPlayer.play();
  })
  TrackPlayer.addEventListener("remote-pause", () => {
    TrackPlayer.pause();
  })
  TrackPlayer.addEventListener("remote-stop", () => {
    TrackPlayer.stop();
  })
  TrackPlayer.addEventListener("remote-previous", () => {
    TrackPlayer.skipToPrevious();
  })
  TrackPlayer.addEventListener("remote-next", () => {
    TrackPlayer.skipToNext();
  })
  TrackPlayer.addEventListener("remote-seek", (e) => {
    TrackPlayer.seekTo(e.position)
  });
  TrackPlayer.addEventListener("playback-error", (e) => {
    console.log("Playback error trackplayerservice: ",e)
  })
}

and i add playbackservice file to AppEntry.js file, which is the entry point for the expo app

this is my AppEntry.js file code

import registerRootComponent from 'expo/build/launch/registerRootComponent';

import App from '../../App';
import TrackPlayer from 'react-native-track-player';
import { playBackService } from '../../trackPlayerService';

registerRootComponent(App);

try {
    TrackPlayer.registerPlaybackService(() => playBackService);
} catch (error) {
    console.log('error From App entry : ', error.message)
}

if any other details required, ill provide

react native track player to work notification controls in ios

Upvotes: -1

Views: 21

Answers (0)

Related Questions