How to open external app file in React Native - react-native

Using the package react-native-receive-sharing-intent, I receive this intent from the Obisidan app when a page is shared:
{
"contentUri": "content://md.obsidian.fileprovider/my_images/Documents/Myoas/Hello%20obsidian.md",
"fileName": "Hello obsidian.md",
"filePath": "/data/user/0/com.xxxxxxx.xxxxxx/cache/Hello obsidian.md",
"mimeType": "text/markdown",
"subject": null,
"text": null,
"weblink": null
}
Now my goal is to open programmatically the Obsidian app showing the same file.
I tried that but it is not working. This opens the web browser and gives an error:
import { Linking } from "react-native";
Linking.openURL("content://md.obsidian.fileprovider/my_images/Documents/Myoas/Hello%20obsidian.md");
I don't want a copy of the file or open the markdown file in my app.
I want to open the original file in the external app.

I find a solution here:
Linking.openUrl("obsidian://action?param1=value&param2=value")

Related

Can't Open My App in Production | DeepLink React Native | React Navigation v5/v6

hope you guys have a great day!
I'm in the middle of learning deeplink in react native, currently I've managed to open my app via cmd using npx uri-scheme open myapp://inv/12321312 --android, and the page I'm going to is also already open along with the :id I included in the link
now i have released my app (not yet uploaded in playstore - but just run npx react-native run-android --variant=release), then why when i access myapp://inv/12321312 link in my browser, my app doesn't open?
i'm using Google Chrome in my android device
please help:(
in app.json add intentFilters for android
if you are using expo
{
"expo": {
"scheme": "myapp",
.....
"android": {
...
"intentFilters": [
{
"action": "VIEW",
"autoVerify": true,
"data": [
{
"scheme": "https",
"host": "myapp.com",
"pathPrefix": "/"
},
{
"scheme": "myapp",
"host": "*",
"pathPrefix": "/"
}
],
"category": [
"BROWSABLE",
"DEFAULT"
]
}
]
...
},
}
}
or if you are using react native CLI
https://developer.android.com/training/app-links/deep-linking#adding-filters
after that generate APK for Android
and send https://myapp.com/ in message whatsapp
click this link from chat
it's work ^^
update : (test)
ios => after build ipa for test ios run this link in your browser phone when app installed : myapp://
android => after build apk for test android send in this link in message (email , whatsapp, ...) and click link for test (after installed app)

Blank screen after relocating the expo entryPoint

I have a react-native project and I'm using expo.
In my project structure I have the sources folder that contain all my sources expect the App.js file.
I would like to have this file in the sources folder as well.
For this I created a app.json file as follow:
{
"expo": {
"entryPoint": "./sources/App.js",
}
}
The issue is that when I do so after running the app with:
expo start --web
The server is launched the app is open in my browser but I have a blank screen.
There is no log, no error.
I can also add that the render method of the App.js isn't called because I put a console.log("Hello") that doesn't appear.
I don't undertstand the behaviour.
Isn't modifying the entryPoint property the way to do it ?
The expo docs state 'Support for custom entry points is in progress and is coming soon.' and suggest doing the following:
Create an index.js/index.ts file in your root folder with this content:
import { registerRootComponent } from 'expo';
import App from './src/App';
registerRootComponent(App);
where from './src/App' represents the entry location. Also delete the line
"main": "node_modules/expo/AppEntry.js",
from your package.json and any entryPoint keys in app.json or app.config.js/app.config.ts
This worked for me.

IOS Universal links using expo is NOT working

I've an EXPO app and i'm trying to get into the app from external links (universal/deep linking), Android is up and running perfectly and IOS is not working.
the app.json file is configured as described here:
"associatedDomains": [
"applinks:*.<DOMAIN_NAME>.com",
"applinks:<SUB_DOMAIN>.<DOMAIN_NAME>.com"
]
And because of my app is using WEBVIEW of my original website, the file /.well-known/apple-app-site-association is located at my client repository under the SRC folder like so:
Content-Type: application/pkcs7-mime
{
"applinks": {
"apps": [],
"details": [{
"appID": "<APP_ID>",
"paths": ["/login/*"]
}]
}
}
Now, AASA validator is OK, but external links still not opening the native app!!!
What to do?!
I found the answer on the expo forums and want to post the solution here because I spent hours/days trying to figure out the answer. And kept running into this question here on SO. And due to only being easily testable on production(vs local or release channel deployments). I want to save other users the pain of releasing their app with broken universal deep links.
Expo's documentation isn't clear here. In the iOS section of Expo's linking guide is fairly vague and some of the language is not explicit or clear enough. To make matters worse everything you find on SO or elsewhere is filled with conflicting and out of date info.
While the OP's question is likely solved solely by the last item in this list, I want to cover a couple of things I also had issues figuring this out for posterity and to clear things up I kept trying to piece together:
appID is basically a combination of the iOS team ID which can be found in the apple developer console under membership. And the bundle id found in app store connect > app > app information (or it should also be in your app.json).
Some of apple's documentation can be confusing and wildcards do match more than one character. So for example a path of "/auth/*" will properly route the a url with the path of "/auth/login".
You do not need to sign your AASA file.
Do not include https or paths in your associatedDomains configured in app.json it should just be the domain (e.g. "applinks:google.com").
The working mime type for your AASA is application/pkcs7-mime and not application/json
you're AASA file can me in your root directory or .well-known [docs], I suggest placing it on both as this will help create some redundancy. You can upload one file and configure your server to resolve the same file.
You need to enable associated domains service for you identifier. Expo states this in their documentation but the navigation to where to do this is out of date. On the developer portal > Certificates, Identifiers & Profiles > identifiers > click on the identifier that maches your app's bundle ID > capabilities > Check "Associated Domains" It will tell you that this will invalidate your signing profile and you'll need a new one to deploy your app. So long as you are in a managed expo app, expo will handle this for you when you create a new build.
The main problem you're facing is that the AASA file or apple-app-site-association has gone through 3 different iterations with different schemas. Each schema is fairly different and you need to combine all 3 schemas to support all current + older versions of iOS. The schema in the OPs question is used by ios 11 & 12 and not supported by iOS 13+ (which came out 2019). Expo's documentation is unclear about this and makes it sound like the displayed version will work with all versions and you can use the new schema if you want the added features, however the new schema is absolutely necessary to work with newer iphones. The expo documentation has the new schema minified so you don't even realize it exists if you're not paying attention.
Another user explained this solution in depth on the expo forums - I won't go into as much depth but will include his combinations of the different schemas that did work for me so that it's easier to find. (although the new schema is probably sufficient if you don't plan on supporting anything lower than iOS 13. as 15 is the current version as of this writing)
Example of all the schemas combined.
{
"applinks": {
"apps": [],
"details": [
{
"appIDs": [ "TEAMID.bundleidentifier", "ABCDE12345.com.example.app2" ],
"components": [
{
"#": "no_universal_links",
"exclude": true,
"comment": "Matches any URL whose fragment equals no_universal_links and instructs the system not to open it as a universal link"
},
{
"/": "/buy/*",
"comment": "Matches any URL whose path starts with /buy/"
},
{
"/": "/help/website/*",
"exclude": true,
"comment": "Matches any URL whose path starts with /help/website/ and instructs the system not to open it as a universal link"
},
{
"/": "/help/*",
"?": { "articleNumber": "????" },
"comment": "Matches any URL whose path starts with /help/ and which has a query item with name 'articleNumber' and a value of exactly 4 characters"
}
]
},
{
"appID": "TEAMID.bundleidentifier",
"paths": [ "/buy/*", "/help/website/*", "/help/*" ]
},
{
"appID": "OTHTEAMID.otherbundleidentifier",
"paths": [ "/blog", "/blog/post/*" ]
},
{
"appID": "YAOTHTEAMID.yetanotherbundleidentifier",
"paths": [ "*" ]
}
]
},
"activitycontinuation": {
"apps": [
"TEAMID.bundleidentifier",
"OTHTEAMID.otherbundleidentifier"
]
}
Example of the new schema if you don't need to support older versions of iOS
{
"applinks": {
"apps": [],
"details": [
{
"appIDs": ["ABCDE12345.com.example.app", "ABCDE12345.com.example.app2"],
"components": [
{
"#": "no_universal_links",
"exclude": true,
"comment": "Matches any URL whose fragment equals no_universal_links and instructs the system not to open it as a universal link"
},
{
"/": "/buy/*",
"comment": "Matches any URL whose path starts with /buy/"
},
{
"/": "/help/website/*",
"exclude": true,
"comment": "Matches any URL whose path starts with /help/website/ and instructs the system not to open it as a universal link"
},
{
"/": "/help/*",
"?": { "articleNumber": "????" },
"comment": "Matches any URL whose path starts with /help/ and which has a query item with name 'articleNumber' and a value of exactly 4 characters"
}
]
}
]
}

Typescript annotation error for default React Native app?

When creating a fresh React Native project and opening the default app.js file in VSCode, this line;
const App: () => React$Node = () => {
returns
Type annotations can only be used in TypeScript files.
as a VSCode problem.
Am I suppose to have typescript installed with React Native, or is this some kind of other issue with VSCode or something? Surely React Native isn't releasing their default app.js file with an error.
Here's the contents of the problem.
{
"resource": "/d:/App/sw_lbi_app/App.js",
"owner": "typescript",
"code": "8010",
"severity": 8,
"message": "Type annotations can only be used in TypeScript files.",
"source": "ts",
"startLineNumber": 27,
"startColumn": 12,
"endLineNumber": 27,
"endColumn": 28
}
const App: () => React$Node = () => {
Type annotations can only be used in TypeScript files.
In case you want to leave this line of Facebook's code to stay peacefully in Microsoft's VS Code, there is a Setting switch to turn off the TypeScript-style validation in a .js file.
Open Preferences => Settings, search javascript.validate, and locate
Uncheck it, and re-open App.js file. The validation will be gone.
PS: There is an option to make this setting change in User scope or Workspace scope.
That's Flow, not TypeScript. Simply remove the types and your code will run without problem.
It is Flow not TypeScript as mentioned Yanick.
VSC doesn't support it by default, so if you want to keep it the way it is, you can just install
Flow Language Support extension in your IDE.

Connecting to s3 bucket with Media Library Strapi

I've used Strapi for a while as a headless cms and, in their most recent update, they changed the File Upload plugin to Media Library. You used to be able to connect an s3 bucket to your app via File Upload's settings- does anyone have any idea how you do the same thing now that Media Library has replaced it?
If you are using strapi version 3.0.0-beta.20.x
What you have to do is to create a settings.json file with below config
./extensions/upload/config/settings.json
{
"provider": "aws-s3",
"providerOptions": {
"accessKeyId": "dev-key",
"secretAccessKey": "dev-secret",
"region": "aws-region",
"params": {
"Bucket": "my-bucket"
}
}
}
You can check out the plugin for more details