Ionic Firebase analytics custom parameters - firebase

In my ionic5 app I am sending events like so
export class Logger extends FirebaseAnalytics{
...
aFunction(tapTarget: string){
const logData = {target: tapTarget};
this.log(EventType.TAP, logData);
}
Based on this
but I do not see the event parameters in my firebase console? I see the events but not the payload that the app is sending... ?
Is there a magic setting on firebase console to see those values?
Or is the code above not working?

You are not supposed to extend FirebaseAnalytics.
You must inject it in your constructor.
import { FirebaseAnalytics } from '#ionic-native/firebase-analytics/ngx';
constructor(private firebaseAnalytics: FirebaseAnalytics) {}
this.firebaseAnalytics.logEvent('event_name', {param: 'value'})
.then((res: any) => console.log(res))
.catch((error: any) => console.error(error));
Make sure the Ionic Native wrapper is installed alongside the Cordova plugin itself.
ionic cordova plugin add cordova-plugin-firebase-analytics
npm install #ionic-native/firebase-analytics

Related

Vue 3 + Firebase onAuthStateChanged mount

I am following a tutorial for Vue that uses the following code:
let app
auth.onAuthStateChanged(() => {
if (!app) {
app = new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
}
})
This is supposed to make sure that Firebase loads the authState before mounting the app, if a user reloads the page.
However, I am using Vue 3 and the thus I can't initialize via new Vue() anymore, as you have to use createApp now.
I'm initializing & mounting my app the following way:
createApp(App).use(store).use(router).mount('#app')
Unfortunately, I am lost on how I can make sure that the DB still initializes the same way, and I was unable to find a proper solution (spent the last hour on google & SO).
Any help is highly appreciated, maybe I am just missing a simple concept for promises or something similar.
Thank you very much, stay healthy!
The Vue 3's createApp is same as Vue 2's new Vue(), returning Vue app instance:
let app;
auth.onAuthStateChanged(() => {
if (!app) {
app = createApp(App).use(store).use(router).mount('#app')
}
})

#react-native-firebase/messaging how to customize notification?

According to the documentation: https://rnfirebase.io/messaging/usage I want to display the background notification from firebase but with custom configuration, like a custom icon, custom data, and custom function on tapping on a notification.
// index.js
import { AppRegistry } from 'react-native';
import messaging from '#react-native-firebase/messaging';
import App from './App';
// Register background handler
messaging().setBackgroundMessageHandler(async remoteMessage => {
console.log('Message handled in the background!', remoteMessage);
});
AppRegistry.registerComponent('app', () => App);
How to customize this?
https://github.com/invertase/react-native-firebase/issues/3826#issuecomment-648903659
As per this statement and also referring the doc, react native firebase version 6+ messaging only supports cloud integration and simple notification display.
If you need extra configuration while displaying a notification, you should use any other local notification library like "Notifee"

Custom notification on React Native using react-native-firebase

I am implementing push notifications in my application using the react-native-firebase library, but I have a question. I need to mount custom notifications in my app, and assemble them from React without the server sending me Title / Body, I need these notifications with the app in the background and fully closed.
I made the following attempt, but to no avail.
In my index I registered my class
AppRegistry.registerHeadlessTask(
"RNFirebaseBackgroundMessage",
() => bgMessaging
);
In my JS class, I treat the following way
import firebase from "react-native-firebase";
import type { NotificationOpen } from "react-native-firebase";
export default async (notificationOpen: NotificationOpen) => {
if (notificationOpen) {
const notification = new firebase.notifications.Notification()
.setTitle("Android Notification Actions")
.setBody("Action Body")
.setNotificationId("notification-action")
.setSound("default")
.android.setChannelId("notification-action")
.android.setPriority(firebase.notifications.Android.Priority.Max);
// Build an action
const action = new firebase.notifications.Android.Action(
"snooze",
"ic_launcher",
"My Test Action"
);
// This is the important line
action.setShowUserInterface(false);
// Add the action to the notification
notification.android.addAction(action);
// Display the notification
firebase.notifications().displayNotification(notification);
}
return Promise.resolve();
};
But I was not successful. Push notifications sent from firebase with fixed title and body work normally.
Thanks and sorry for my english.
Hi Please try with below,
Change .setNotificationId("notification-action") to .setNotificationId(notificationOpen.notification.notificationId)
Change .android.setChannelId("notification-action") to .android.setChannelId(notificationOpen.notification.android.channelId)

Next.js Amplify Serverless AppSync graphql (Amplify error)

I'm trying to create an App that uses Amplify and AppSync with Next.js.
I was able to deploy the application successfully but when I'm trying to access the application (trying to fetch data from AppSync) It is failing.
I'm kinda lost what needs to be looked at, the application seems to be working fine locally but when I'm publishing it on AWS it is failing.
I'm getting error: TypeError: Cannot read property 'getName' of undefined
//quotes.js
import { Connect } from 'aws-amplify-react';
........
<Connect
query={graphqlOperation(queries.getName)}
subscription={graphqlOperation(subscriptions.onCreateName)}
onSubscriptionMsg={(prev, { onCreateName }) => ({
...prev,
getName: {
...prev.getName,
items: [
...prev.getName.items,
onCreateName,
],
},
})}
>
Has anybody come across such an issue or any idea to resolve the issue? Thanks in advance.
Running the subscription when doing SSR is not needed / useful and requires a WebSocket client in the server, you can try Dynamic Imports with no SSR to have the subscription only happen on the client. (using { ssr: false })
import dynamic from 'next/dynamic';
const DynamicComponentWithNoSSR = dynamic(() => import('../components/hello3'), { ssr: false });
function Home() {
return (
<div>
<Header />
<DynamicComponentWithNoSSR />
<p>HOME PAGE is here!</p>
</div>
);
}
export default Home;

Can't access Meteor.user() property

I've installed a Meteor phone authentication package mys:accounts-phone, which should add a phone.number subfield into users collection. I try to access this field as follows:
Meteor.user().phone.number
but typescript shows error
Property 'phone' does not exist on type 'User'.
On the other hand, I have custom props in users.profile, and can easily access them in this way.
Insecure is not yet removed. Autopublish is ON.
this happens sometime when our angular component is initialized but our meteor data is not reached from server.
try to use user injection in place of Meteor.user()
import {Component} from "#angular/core";
import { InjectUser } from 'angular2-meteor-accounts-ui';//<--**** import this****
#Component({
selector: "login-buttons",
template
})
#InjectUser('user') //<--*** add this***
export class LoginButtonsComponent {
user: Meteor.User; //<--*** add this ***
constructor(private router: Router) {}
}
now in user variable you will have all values of Meteor.User
if you want to print in html part use this
<div *ngIf="user">
{{user.phone.number}}
</div>
don't forget to install
meteor add accounts-password
meteor npm install --save angular2-meteor-accounts-ui
and in app.module.ts file
import { AccountsModule } from 'angular2-meteor-accounts-ui';
#NgModule({
imports: [
... other modules here
AccountsModule
],
hope this will work. if this not work let me know i will tell you one other solution
Got probable answer from Meteor docs.
It explains why username property appears. By default, Meteor publish only a number of fields considered to be public. To exposure any additional fields they must be published explicitly.
Not yet have time to test, but think it should work.
The other reason, with the same sympthoms, when publication code do not executed at server side. Try to put
Meteor.startup(() => {
// code to run on server at startup
Meteor.publish('userData', function() {
if(!this.userId) return null;
return Meteor.users.find(this.userId
//, {fields: {lastname: 1,}}
);
});
});
in a file within /server folder of your application.

Resources