Using react native with Optimizely - react-native

I try to follow documentation in Optimizely to get my react native app (#22.2) working but getting such bug.
MainActivity.java:24: error: cannot find symbol
Optimizely.startOptimizelyWithApiToken("xxxxxx", getApplication());
^
symbol: method startOptimizelyWithApiToken(String,Application)
location: class Optimizely
1 error
:app:compileDebugJavaWithJavac
What is wrong and how can I debug . I try
adb logcat ReactNative:V ReactNativeJS:V
but it's not giving me any information

I an on the engineering team at Optimizely and we've released a brand new product called FullStack that is more geared towards developers. As part of the product we now offer a JavaScript SDK for running experiments in all JavaScript clients, including React Native.
To use you would install our SDK:
npm install optimizely-client-sdk
And then you can split traffic using our activate and track methods.
Here is an example:
var optimizely = require('optimizely-client-sdk');
// Initialize an Optimizely client
var optimizelyClientInstance = optimizely.createInstance({ datafile: datafile });
// ALTERNATIVELY, if you don't use CommonJS or npm, you can install the minified snippet and use the globally exported varible as follows:
var optimizelyClientInstance = window.optimizelyClient.createInstance({ datafile: datafile });
// Activate user in an experiment
var variation = optimizelyClientInstance.activate("my_experiment", userId);
if (variation === 'control') {
// Execute code for variation A
} else if (variation === 'treatment') {
// Execute code for variation B
} else {
// Execute default code
}
// Track conversion event
optimizelyClientInstance.track("my_conversion", userId);
For more information please checkout our developer docs: https://developers.optimizely.com/x/solutions/sdks/introduction/index.html?language=javascript

i sorted problem is more about reading docs and using legacy:
compile ('com.optimizely:optimizely-legacy:+#aar') {
transitive = true
}
and then:
Optimizely.startOptimizely("xxxx", getApplication());

Related

VueJS and ElectronJS | VueJS stops rendering completely when I import ipcRenderer in a component

So I am coding a VueJS and ElectronJS template which can be found here: https://github.com/dev-aethex/electronjstemplate
My code works something like this,
Inside of my Vue component I access a global pre constructed class called MainProcessInterface and when it's constructed it first checks if vue is compiled for running in a development server. If it's in a dev server it will connect to the dev socket which electrons main process will host if electron is in dev mode and not compiled. This method seems to be working great, I had to use a socket because vue dev server is being loaded into electron via loadURL and so vue has no clue what ipcRenderer is. Inside the main process interface, if vue is compiled it will instead use the ipcRenderer.send() method. This is were the problem was born.
As soon as Vue runs thought the TS code, it sees ipcRenderer.send and freaks out while printing an error to the electron window console saying fs.existsSync does not exist or is defined.
I can't find a way around this. I though maybe i'll split MainProcessInterface into 2 peices, one for ipc and the other for websockets. Although it isn't a very good way, so before implementing it, I would like to know if there is a better more proper way of doing such.
I had a similar issue with React. Are you importing the ipcRenderer object somewhere in your build process? You might want to make sure it references the correct variable. I tried to drop this in as a comment but it wouldn't fit:
//index.html (index.ejs) for me... This is in the main HTML entry point
var IPC = null;
try {
IPC = require('electron').ipcRenderer;
console.log('IPC IS: ' + IPC)
} catch (err) {
console.log('CRICITCAL ERROR: IPC NOT ENABLED')
console.log(err)
IPC = null;
}
Then I initialize off that context in React with a startup here:
setTimeout(()=>{
console.log('----------------HACK FIRED POST REHYDRATE')
window.REDUX_STORE.dispatch(
(dispatch, getState) => {
const _state = getState()
if(window.IPC) {
if(_state.osc && _state.osc.on) {
dispatch( reconnectToEos() )
} else {
dispatch( updateStatus('[OSC Startup: DISCONNECTED]', ))
}
console.log('\t------------ELECTRON')
} else {
//Shut off OSC
dispatch( updateOscKey('on', false) )
dispatch( updateStatus('[WebApp, OSC disabled]', ))
console.log('\t------------WEB')
}
}
)
}, 1000)
Basically I'm using a global variable (window.IPC) to initialize my app so I don't import a bad variable in my build process. I have a fair number of Electron APIs where this alleviates the issues with building via Webpack.
I hope this helps!

How can i check app installed in react native code

i tried to check other app install in my react native project, I'm used module like: https://www.npmjs.com/package/react-native-check-app-install
But always got this error:
Cannot read property 'pkgName' of undefined
Here is my code:
AppInstalledChecker
.isAppInstalledAndroid('com.skype.raider')
.then((isInstalled) => {
// isInstalled is true if the app is installed or false if not
console.log('App Skype status: ', isInstalled);
});
Anyone can suggest me one way so check app install in react native (both: iOS/android)
install this
https://github.com/KjellConnelly/react-native-shared-group-preferences
and
async check() {
try {
await SharedGroupPreferences.isAppInstalledAndroid("com.farsitel.bazaar")
// IF IS INSTALL
} catch (e) {
// IF IS NOT INSTALL
}
}
Google Play considers the list of installed apps to be personal and sensitive user data.
As we are using
AppInstalledChecker
.isAppInstalledAndroid()
method for checking app installed check, for that we have to white-list the queries in manifest.xml
Reference : https://developer.android.com/training/package-visibility
<queries>
<package android:name="com.instagram.android"/>
…
</queries>
For adding Queries need to upgrade build gradle version:
new default settings and features for package visibility in Android 11 that need to add  you must update your android gradle plugin version
Reference: How to fix "unexpected element <queries> found in <manifest>" error?
I have updated from 3.5.2 to 4.0.2
Now react-native-check-app-install module working as expected
Hope this is resolved!
Android
I. For app's which has deep links like 'waze://', 'mapsme://' you can use:
import { Linking } from 'react-native'
...
Linking.canOpenURL('waze://ul?ll=${latitude},${longitude}&navigate=yes')
OR
II. You can use for absolutely all apps (for example with deep links like "https://...")
https://github.com/KjellConnelly/react-native-shared-group-preferences
iOS
import { Linking } from 'react-native'
...
Linking.canOpenURL(iOS_app_URL_Scheme)
...
where iOS_app_URL_Scheme you can find via Google for each separate app. Like "waze://", "comgooglemaps://", "osmandmaps://" etc

How do I share an action using react-native-fbsdk?

We're doing this in the web version of our react application and our native Android app so our setup and everything is working fine. I'm trying to implement sharing an action in react-native using react-native-fbsdk. I'm following the Android code because it looks the closest to the react-native-fbsdk code.
Should I be using ShareApi.share or something else?
I tried creating an instance of ShareOpenGraphContent to use with ShareApi.share, but there's no constructor.
I wish they would provide more thorough documentation :s
Based on the code my colleague used for the ShareApi on Android it seems like react-native-fbsdk is missing a few things related to sharing actions.
ShareOpenGraphContent isn't directly exported from react-native-fbsdk so this
import { ShareOpenGraphContent } from 'react-native-fbsdk';
Actually doesn't work. There must be some way to use the ShareApi in react-native-fbsdk to share an action...I'm just missing something.
Someone help...please.
Thanks!!
I figured it out! I had to manually create an instance of the ShareOpenGraphContent object which has 3 mandatory properties: contentType, action and previewPropertyName. The react-native-fbsdk doesn't currently have a constructor for this object type.
ShareApi.canShare isn't mandatory, but it checks to ensure you have the correct permissions before trying to share. This would allow you to get the user logged in before trying in case their token expired, or the user hasn't agreed to the needed permissions yet.
const ogAction = new ShareOpenGraphAction('<your_facebook_namespace>' + ':' + '<your_facebook_action>');
ogAction.putString('song', 'https://<url_to_your_song_app_etc>');
ogAction.putString('place', '<fbPlacePageID>'');
ogAction.putNumber('fb:explicitly_shared', 1); // Normally this is a boolean, but putNumber with a value of 1 works
// Manually create an instance of ShareOpenGraphContent (no constructor in the API)
const ogContent = {
contentType: 'open-graph',
action: ogAction,
previewPropertyName: 'song',
};
ShareApi.canShare(ogContent).then((canShare) => {
if (canShare)
return ShareApi.share(ogContent, '/me');
}).then(
function(result) {
// Shared successfully
},
function(error) {
// Failed to share
}
);

LockModule.init undefined error in auth0 react-android getting started

I'm following the instructions to get auth0 running in react-native android https://auth0.com/docs/quickstart/native/react-native-android
And I am getting the following error
undefined is not an object (evaluating 'LockModule.init') show auth0-lock.js:33
The error implies that the LockModule variable is undefined; by checking the code for auth0-lock.js we can see that the variable is being initialized by the following logic:
var { NativeModules, Platform } = require('react-native');
var LockModule = NativeModules.Auth0LockModule;
According to react-native documentation in order to use a module implemented as a native module you need to register it.
The package needs to be provided in the getPackages method of the MainApplication.java file. This file exists under the android folder in your react-native application directory.
You should have something similar to:
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new LockReactPackage()
);
}
If this is not the root cause of the issue you'll need to update your question with more details.
I ran into this issue while trying to get Auth0 working on iOS. Our fix is here (react-native run-ios to see more detailed messages for the issue; correct header search paths; update podfile with OneSignal; add OneSignal library)
https://github.com/auth0/react-native-lock/issues/133

Strophe js in Titanium Appcelerator?

I want to create a chat application in Titanium appcelerator using Strophe.js library. I have gone through strophe js libraries and their documents as well. I believe we can use strophe.js to build xmpp based chat app in web.
Thanks in advance, Can anyone please clarify the following doubts,
Is it possible to use strophe js inside our Titanium Appcelerator,If yes please suggest me how to use it. I tried to include the strophe js inside the titanium it shows can't find module error
Here's the code i tried with.
Ti.include("includes/strophe.js");
Ti.include("includes/strophe.register.js");
connection.register.connect("localhost:5280", callback, wait, hold);
var callback = function (status) {
if (status === Strophe.Status.REGISTER) {
connection.register.fields.username = "newuser";
connection.register.fields.password = "123456";
connection.register.submit();
} else if (status === Strophe.Status.REGISTERED) {
console.log("registered!");
connection.authenticate();
} else if (status === Strophe.Status.CONNECTED) {
console.log("logged in!");
} else {
// every other status a connection.connect would receive
}
};
$.index.open();
Can you please suggest to use any other libraries that can be used inside the Titanium Appceleartor to build chat application using XMPP
Looks like Strophe is created to be used inside browser and modifying it to work inside Titanium is rather risky.
The only XMPP module for Titanium, which I could find is titanium-xmpp on GitHub.