I want to use Jitsi-meet in react native for video conferencing what is the best method for implementation.
Currently I am following this link https://jitsi.github.io/handbook/docs/intro
But in this they have used native code for android and iOS
Can someone please suggest me how should I proceed further.
The link you provided is the documentation of the jitsi native SDK. If you want to implement this SDK in a react-native project, you should have a look at react-native-jitsi-meet plugin.
As you can read in the documentation of the plugin, just install the plugin, and you will be able to initiate calls with your room url :
componentDidMount() {
setTimeout(() => {
const url = 'https://your.jitsi.server/roomName'; // can also be only room name and will connect to jitsi meet servers
const userInfo = { displayName: 'User', email: 'user#example.com', avatar: 'https:/gravatar.com/avatar/abc123' };
JitsiMeet.call(url, userInfo);
/* You can also use JitsiMeet.audioCall(url) for audio only call */
/* You can programmatically end the call with JitsiMeet.endCall() */
}, 1000);
}
Related
I'm having a hard time getting WalletConnect 1.7.7 to work on React Native. I want to integrate in a crypto Wallet to handle dapps requests. Their documentation is...lacking. I'm following the "quickstart" in their docs, but listeners never gets fired.
import WalletConnect from "#walletconnect/client";
// Create connector
const connector = new WalletConnect(
{
// Required
uri: "wc:8a5e5bdc-a0e4-47...TJRNmhWJmoxdFo6UDk2WlhaOyQ5N0U=",
// Required
clientMeta: {
description: "WalletConnect Developer App",
url: "https://walletconnect.org",
icons: ["https://walletconnect.org/walletconnect-logo.png"],
name: "WalletConnect",
},
});
connector.on("session_request", (error, payload) => {
if (error) {
throw error;
}
// Handle Session Request
});
But session_request or any other event never get's fired. As per their documents that's all I need. Is there anything else I'm missing or perhaps it's not documented?
The documentation for Wallet Connect is very incomplete and there is very little information on the web. Are you using React Native with Expo? Because there the implementation changes. I don't see any flaws in your code. Test your integration from this website https://example.walletconnect.org/.
Using connect event instead of session_request on walllet connect works for me in react native.
connector.on('connect',(error,payload)=>{
console.log('eventtt',payload)
// Alert.alert('Connected')
})
Im using react-native-firebase and firebase cloud messaging for remote notifications (v5.6.0), and I have my firebase cloud function's notification payload set. Im trying to set the notification sound for iOS/android. what I have currently is:
exports.sendChatNotification = functions.firestore.document('messages/{document}').onCreate((event) => {
const writeData = event.data();
const { receiverToken, senderName, content } = writeData;
const payload = {
notification: {
title: 'Chat Message',
body: senderName + ' has sent you a message',
sound: 'Complete'
}
};
return admin.messaging().sendToDevice(receiverToken, payload).then((msgDevicesResponse) => {
console.log(JSON.stringify(msgDevicesResponse));
});
});
Currently experiencing this notification sound playing the default for iOS, and am unable to per-select an existing iOS tone, such as "Complete". I understand from reading firebase docs that the 'sound' property of the notification payload only works for the android platform.
Since im using react-native-firebase, I looked at their documentation for Cloud Messaging, and found this Notification object that has iOS and android properties: https://rnfirebase.io/reference/messaging/notification
both platform properties have a sub-property sound, but Im unsure of how to integrate this, considering my notifications are being set in a firebase cloud function, which uses firebase.admin
My goal is to set the iOS notification sound from the os's list of tones. How can this be done?
I have updated my app on app and play store and I want to force my app users to update the new version of app in App store and playstore.
You can check for the App Store / Play Store version of your app by using this library
react-native-appstore-version-checker.
In expo app you can get the current bundle version using Constants.nativeAppVersion. docs.
Now in your root react native component, you can add an event listener to detect app state change. Every time the app transitions from background to foreground, you can run your logic to determine the current version and the latest version and prompt the user to update the app.
import { AppState } from 'react-native';
class Root extends Component {
componentDidMount() {
AppState.addEventListener('change', this._handleAppStateChange);
}
_handleAppStateChange = (nextState) => {
if (nextState === 'active') {
/**
Add code to check for the remote app version.
Compare it with the local version. If they differ, i.e.,
(remote version) !== (local version), then you can show a screen,
with some UI asking for the user to update. (You can probably show
a button, which on press takes the user directly to the store)
*/
}
}
componentWillUnmount() {
AppState.removeEventListener('change', this._handleAppStateChange);
}
}
import VersionCheck from 'react-native-version-check';
i have used version check lib for this purpose and approach i used is below. if version is lower i'm opening a modal on which an update button appears, and that button redirects to app store/google play
componentDidMount() {
this.checkAppUpdate();
}
checkAppUpdate() {
VersionCheck.needUpdate().then(res => {
if (res.isNeeded) {
setTimeout(() => {
this.setState({openModal: true});
});
}
});
}
updateApp = () => {
VersionCheck.getStoreUrl({
appID: 'com.showassist.showassist',
appName,
})
.then(url => {
Linking.canOpenURL(url)
.then(supported => {
if (!supported) {
} else {
return Linking.openURL(url);
}
})
.catch(err => console.error('An error occurred', err));
})
.catch(err => {
console.log(`error is: ${err}`);
});
};
For future readers.
If you are using Expo managed workflow, install this package react-native-version-check-expo using yarn add react-native-version-check-expo or npm install react-native-version-check-expo.
Consult the package documentation on Github for usage guidelines.
I'm using react-native-version-check-expo library to achieve this. Working fine for me.
if you are looking for an easy to integrate built in solution. You can use App Upgrade https://appupgrade.dev/ service to force update your mobile apps.
Create new version entry for your app version that you want to update in the app upgrade service and select whether you want to force it or just want to let users know that new version is available.
Integrate your app with App Upgrade using available SDK. Official SDK are available for React Native, Flutter, Expo, Android and iOS(Swift).
The SDK will take care of the rest.
Whenever you want to force upgrade a version just create a version entry in app upgrade dashboard.
You can also integrate using API. Just call the appupgrade api from your app with the required details such as your app version, platform, environment and app name.
The API will return you the details.. that this app needs to be updated or not.
Based on the response you can show popup in your app.You can call this API when app starts or periodically to check for the update. You can even provide a custom message.
API response:
See the response has force update true. So handle in the app by showing popup.
You can find the complete user documentation here. https://appupgrade.dev/docs
Thanks.
I'm trying to create a react native app that allows the user to click a button and a call to their phone will be placed using the TWILIO API. I have it working from terminal by typing node make_call.js(name of file) but i want the user to be able to make the call when they want to by inputing their phone number and clicking a call button. Heres my code. the credentials are fake. Is this possible??
var accountSid = 'AC76d99966f35141f7c8585e31ed740480'
var authToken = '6470ce0905736f0f9da91456f088e97cc2'
var client = require('twilio')(accountSid, authToken);
client.calls.create({
url: 'https://demo.twilio.com/welcome/voice/',
to: '7781234564',
from: '6042322056',
}, function(err, call) {
if(err) {
console.log(err);
} else {
console.log(call.sid);
}
})
Twilio developer evangelist here.
You can actually build phone calling directly into your application using the Twilio Voice SDK.
There is already available to, built by the community, a React Native wrapper for the Twilio Voice SDK.
Let me know if that helps at all.
How do you open a Bitcoin URL in a react native app? I am using React Native Linking to detect if there are any apps on the phone that can open a Bitcoin URL formatted according to BIP21. I have 3 apps installed that should handle it:
1) Coinbase
2) Breadwallet
3) Blockchain.info wallet
But it's not opening. Here's the code:
async _openWallet() {
const coinURL = 'bitcoin:15bMc6sQTiQ5jSqoRX3JzatAbQqJaffqup';
try {
const supported = await Linking.canOpenURL(coinURL);
if (supported) {
Linking.openURL(coinURL);
} else {
console.log('Could not find a compatible wallet on this device.');
}
} catch (error) {
console.log(error);
}
}
supported keeps returning false, which causes "Could not find a compatible wallet..." to execute. The weird thing is if I click on a Bitcoin URL on any random website via the Chrome / Safari browser, I get a popup that asks me if I want to open the URL in one of the above apps. So only URLs on websites are opening, but not URLs from inside react native code.
Any ideas?
Looks like every URI scheme you want to use at runtime must be defined up-front in Info.plist. Found the answer here: React Native: Linking API not discovering Uber app