Is there a way to attach console.log to firebase analytics event? - react-native

I am setting up firebase analytics for my React Native app. Is it possible to attach a console.log that fires each time firebase.analytics().logEvent() is called? I want to be able to see the event name and params in the console.log. I know I can check in the DebugView in Firebase, but just having it logged to the console seems a bit faster. Appreciate any input.

Per the comment, it would be more economical to create a global method that sends the data to Analytics and console together.
You can read about Global Helpers HERE.
module.exports = function(payload) {
firebase.analytics().logEvent()
console.log(payload);
}
_.Log(payload);
This allows you to also introduce filters and edge-case scenarios within your app as needed including debug mode and alerts from within your app.

Related

Would FirebaseAuth return my current user for Widget and IntentExtension while having the main project as React native?

I am currently creating a WidgetKit for my React Native application. However, I need to create a post request to retrieve my current logined user information. I was wondering if importing FirebaseAuth in my WidgetKit would return the correct current user in my widget project?
import FirebaseAuth
func getUser(){
FIRAuth.auth().currentUser?.uid
}
I wouldn't recommend requiring actual Firebase functionality in a WidgetExtension unless your Widget requires data that may change. If it really does, you should just be including your Firebase code in the build for the Widget, you don't want to duplicate the code you've written for interacting with Firebase.
If you don't need live data, just save the Object your widget needs access to into the UserDefaults. You can do this easily so long as the object in question conforms to Codable. I'm assuming you're suggesting using FirebaseAuth because the Object you want to construct relies on your Firebase data in some way, but there's no need to actually interact with Firebase in a Widget. The log in status of your user can't change if they aren't in your app, so it's not particularly unsafe to save the data directly. If they sign out you can just clear the UserDefaults value.

Cannot register device with TalkJs for push notifications

I am working on a React Native app that uses TalkJS. We want users to get a push notification for every message they receive. The messages are going through but we aren't getting notifications. We have uploaded our .p12 to the TalkJS dashboard and followed the docs for setting up a React Native project. Below is the relevant code we're injecting to the TalkUI loadScript. We followed https://talkjs.com/docs/Features/Notifications/Mobile_Push_Notifications.html
const res = await window.talkSession.registerDevice({ platform: "ios", pushRegistrationId: "${deviceToken}"});
alert("registering deviceToken ${deviceToken} response: " + res)
We are getting the alert with the correct deviceToken but this method does not return anything. We tried .then and an error first callback but nothing is coming back from this method.
Edit: this method is not designed to return anything, so the response is expected to be empty.
The Promise was designed to not return anything as Kapobajza mentioned.
From their support chat: "We have an issue regarding push notifications on iOS when using React Native."
Edit: this issue has been resolved. In addition to work that needed to be done by the TalkJS team, push notifications require a user to have a 'role', as is very loosely implied in the Overview for Push Notifications

React Native - console.log and network commands are not working

I've a strange problem in app I'm currently coding.
Here is the story of the app :
I've used React Native's ScrollView as a horizontal slider,
I display maximum 5~6 slides so I don't need to use FlatList for this.
Slides are actually records coming from the database so actually they are some dynamic components
and slider works as expected.
In every slide, there are also are some option buttons (Touchables) to send data to the server.
When the user presses a button app is opening a modal window to confirm and then sending some data to server.
Until now all is okay.
The Problem :
But in some slides of the slider I'm having a strange problem :
"console.log" commands and also network commands to send data to server is not working.
On the screen, I see Buttons(Touchables) are working and also the modal I've coded is also appearing & disappearing according to the state variables. But somehow console.log commands and also network commands are not even executed. Since I can't log anything it's also hard to understand the problem.
Is there anyone had a similar problem ?
Thanks
I've finally solved this problem, wanted to share my experience here.
In the app I was making post requests to the backend with Axios,
but I wasn't interested in the result of this post requests,
they were just log records so the result of backend calls weren't important.
So I didn't use any "await" command or didn't code anything like Promise.then / catch,
just posted with Axios and scrolled to another slide in my app without waiting for the backend.
After the 8th Axios post, app started not to work.
It seems like working .. touchable effects , modals even navigation works
but nothing else was working. Event console.log commands weren't working.
It's an interesting behavior of React Native , but I've understood the situation after reading the blog below :
https://medium.com/#rotemmiz/react-native-internals-a-wider-picture-part-1-messagequeue-js-thread-7894a7cba868#
Basic reason was that in the backend (NodeJS) I didn't return any response,
there wasn't any command like res.send("success") .. so frontend React Native app was waiting for the response.. event if I didn't use any await or Promise it was still trying to get the response and after the 7-8 call it was blocking the main thread.
If there is a way to configure Axios not to wait for the backend to answer for the post request, please write here.

Creating a Playlist for an Apple Music User

I've created an app in React Native which allows a user to search for songs, which uses the Apple Music API. So far, so good.
For the next step. What I want to do is use the songs the user has searched for, and let them save them as a playlist in their Apple Music account (assuming they are a subscriber, etc.).
However, there seems to be a lack of documentation and examples on how to do this (at least compared to Spotify - I'm recreating a Spotify App I made in the past).
I'll need to get authorisation from the user, and then use this endpoint: https://developer.apple.com/documentation/applemusicapi/create_a_new_library_playlist, but I can't find out how exactly to do this. Other parts of the API documentation seem to simply state "With proper authorization from the user, you can also create or modify playlists and apply ratings to the user's content." but never actually explain or link to how to get this authorization.
Can anyone point me in the right direction? And let me know if what I'm trying to do is actually possible with Apple Music - it seems like it is, but the way I'm going around in circles, I'm not so sure anymore. Thank you
I don't know if this will help or not (I'm an iOS dev, not a React dev), but here's the call to save a playlist to a user's Music library, in Swift. Maybe it'll help point you in the right direction(?)
If you'd rather not have Swift code polluting your thread, let me know and I'll remove it.
import StoreKit
// ...
// request user token
if let devToken = UserDefaults.standard.string(forKey: "devToken") {
SKCloudServiceController().requestUserToken(forDeveloperToken: devToken, completionHandler: { userToken, _ in
guard let _ = userToken else { return }
self.addPlaylist()
})
}
// add playlist
func addPlaylist() {
MPMediaLibrary.default().addItem(withProductID: "pl.u-065LACYzL34", completionHandler: { _, error in
guard error == nil else {
print("add playlist sad")
return
}
// success
})
}
I've been looking at trying to do this for a while now.
MusicKit JS works in the browser, but since there is no browser in iOS, that's a no-go: there is no Window.musicKit.getInstance(). And I've yet to find any other way to authorize MusicKit, using JavaScript, except for MusicKit JS.
You can access the Apple music Catalog via the API with only a developer token. You can even access (read only) a user's playlist, if it's public and you know the global id, but that's not what we're after here. We want access to a user's Library so that we can do stuff (except delete, because you can't delete stuff through the Apple Music API).
To authorize access to a user's Library in iOS, you need to use StoreKit, per this, and in order to do that with React Native, you need to use Native Modules per this.
The problem about that second bit, is that I got no idea how to do this. I've read a few things, but I'm not connecting the dot's yet.
If you (or anyone) has figured this out, dropping a note with a how-to here would be awesome. If I do figure it out, I'll come back here and post.
Update: I found this article, which comes close to explaining it really well.
The issues I'm having here are that in the Add a React Native iOS Project section, there's an unfinished sentence ("Here we create..."), and I can't seem to find React.xcodeproj when I run through the steps the author has provided.
Additional remarks: you can run Javascript on a Page in Shortcuts but only when you run shortcuts from sharesheet from Safari.
Also, contrary to what you may seen in many tutorials keep in mind that for POST requests a header Music-User-Token has a value without word "Bearer". In GET request using "Bearer" word will also work. I've built webpage to get music-user-token to clipboard and save it to use it in Shortcuts.

How can a react-native app save a variable after the app is turned off?

I want to make an app remember some data that a user puts in even after he turns off the phone (like auto-login). How can this be done in React Native? Or which libraries/components should I research?
If you want to do something like auto-login you should probably be using react-native-keychain so that you can store user credentials in the keychain on the device in a more secure way.
If you are looking to store a particular application state or other non sensitive data you could use react-native-simple-store which provides a really simple wrapper around AsyncStorage and takes care of the boilerplate JSON.stringify/JSON.parse that you need to do for objects and arrays.
Hope that helps!
you can use flux stores, async store to store the current state in store, and re-route based on the store
can use componentWillMount mixing for setting up state before rendering view. for e.g.:
componentWillMount() {
LocalStorage.bootstrap(() => this.setState({bootstrapped: true}));
},
you can refer https://github.com/brentvatne/flux-util/blob/master/lib/flux-util.js for example.
You can use AsyncStorage bundled with react-native. It creates key value pairs
AsyncStorage.setItem("key", "value").done() // both key and value have to be strings
AsyncStorage.getItem("key").then((value) =>{}).done()
You can check the documentation for more options
https://facebook.github.io/react-native/docs/asyncstorage.html#content