Would FirebaseAuth return my current user for Widget and IntentExtension while having the main project as React native? - 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.

Related

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

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.

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.

Geofencing in React Native

At the time of this post I believe that there are no geofencing modules available for react native so I would like to implement an alternative poor man's strategy. I discovered react native's geolocation module however the official doc is not clear:
1) Does the Geolocation module run in the background and get the current user coordinates automatically (even if the app is in the background)? If yes, are these stored in a variable or a state?
2) If (1) is true, how can I detect a change in state? Because once I detect a change in state (i.e. user's location) I would like to push this new location to a remote server and store it in a database. On the other hand I do not want to store each and every inch the user is moving!
Does this strategy make sense at all? My concerns are battery consumption as well of course..
1) You need to enable this feature in xcode Then save the location you get from the 'navigator.geolocation.getCurrentPosition' callback somewhere in you app e.g. in your AsyncStorage
2) The callback is only getting called if the location is changed. So you don't need explicitly detect any location change.

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

Trigger.io Urlhandler - Deep Linking with Facebook

Deep linking for Android apps on Facebook allows apps to be opened directly upon clicking a open graph story or other link on FB.
The required settings for this are:
Package Name
Class Name ("The Class Name of the activity you want Facebook to launch")
The package name is user-configurable in the Trigger web interface and I have that correct, however I have no idea what the Class Name is, because handler classes are not directly written.
I've tried "urlhandler", "ForgeActivity", and my custom urlhandler scheme ('fb[APP_ID]' as per FB documentation).
In all cases Facebook launches the Play store instead of the app which is already installed and authorised. This is the expected fallback behaviour if the Package Name is correct but class name is not.
What is the class name I can use for Trigger to handle launching from Facebook?
The class name for the main activity in Trigger is io.trigger.forge.android.core.ForgeActivity.
I've not tested it but I believe with that setting deep linking will open your app, but it doesn't use the urlhandler so unfortunately there will be no way for you to receive and handle the deep link url.