Mobile: Resolves #8639: implement callback url

[tiberiusteng]

Resolves #8639, #9204

• Added "Copy external link" menu items to note, folder and tag view of mobile app.
• Implement callback url handling in mobile app

This can be used to create QR code stickers / NFC tags with joplin links, opening corresponding note/tag/folder when scanning them with an android device installed Joplin and containing that note/tag/folder.

Invalid IDs are not specially handled for now, and will open into an empty page (in my opinion this behavior is better than keep displaying an irrevalent item, but it's certainly better to implement a 'not found' page later, this is currently out of my React ability so it could need others help to implement this)

Build, run in Android/iOS, create some notes, folders, tags and then run following command on dev machine (get those URLs from the new "Copy external link" menu items of the app):

> npx uri-scheme open "joplin://x-callback-url/openNote?id=c800f58c4e374c8da1970bacf498325a" --android
> npx uri-scheme open "joplin://x-callback-url/openFolder?id=7628016b49054dcaa5338c79fcb20ea1" --android
> npx uri-scheme open "joplin://x-callback-url/openTag?id=06bfddc7b63e4432baa1f94076257645" --android

You can also use some QR code generator to generate tags containing those URLs (some generators in URL mode will complain these URLs as invalid, in such case please try free text mode), then use Camera/barcode scanner app to scan it, and then touch the scanned URL or tap 'open in browser' button, it should bring up Joplin and directly go to corresponding item.

Tested on Pixel 7 Pro (Android 14), iPad mini 5 (iOS 16.6).

[github-actions]

CLA Assistant Lite bot All contributors have signed the CLA ✍️ ✅

[tiberiusteng]

I have read the CLA Document and I hereby sign the CLA

[tiberiusteng]

the CI job "Build macOS M1 / Main (pull_request)" seems timed out on downloading yarn cache, please re-run it for me since I don't have permission, thanks

[personalizedrefrigerator]

We're getting close to the feature freeze, so, for now, I'm marking this as targeting version 2.15. (Though, arguably, this feature doesn't impact existing functionality. As such, it could also make sense to target 2.14, at least the internal/non-GUI part.)

Thank you for implementing this!

[laurent22]

For consistency with the existing UI, this menu option should appear when long pressing a folder in the sidebar.

Same for the tags, although currently we don't have a menu there.

[tiberiusteng]

Do you mean this dialog? Add a new "Copy external link" button?

[tiberiusteng]

When using the mobile app, I never thought to long press on the item in the sidebar, or to long press the tag in the list when I want to look for the "Copy external link" function.

I used "Copy markdown link" function before, it's in the right-top menu button, so I looked there and add the function there. Folder/tag node list didn't have that menu button before but I think it's natural to look for the function at the same place. Mental model ls like "copy the link to current screen".

[laurent22]

That makes sense, but the problem is that we'd now have similar functionalities in two different places. Either we move all the long press features to the kebab menu, or we move that copy external link item to the long press one.

[tiberiusteng]

this menu option should appear when long pressing a folder in the sidebar.

I need clarification on this, since in the mobile app what I found while long pressing a folder in the sidebar is the alert dialog I took screenshot above.

Tags doesn't show in the sidebar, but in a tag list on the right side (I'm not sure what that part called). Long-pressing a tag currently shows nothing.

Long-pressing a note will change the title bar to 'Move to notebook ...' dropdown, select all button, delete button, copy button; there's no space for additional buttons or existing menu to add new action to.

I can't think a way to put 'Copy external link' into these places that feels 'consistent'. What should it 'consistent' with?

Right-click menus appear in Desktop application but mobile app doesn't have it. Desktop app already have 'Copy external link' there.

[tiberiusteng]

Actually I've tried to implement that but my knowledge/ability on React-Native isn't good enough to finish it (yet) ... so it probably need to be implemented later by somebody else.

Personally I still think putting the "Copy external link" option on the top-right dotted menu is the most intuitive place, because they appear at the same place for note, (note list of) tag, (note list of) notebook, and serve the idea of "Copy link to current screen", instead of scattering across:

• For note, top-right dotted menu
• For notebook, long-press notebook name in sidebar menu (it looks like menu in iOS but a strange dialog in Android, should be fixed anyway)
• For tag, long-press tag name in tag list (which don't do anything right now)

Anyway the core part is handling external links on mobile, the menus are nice to have but perhaps I've done a little too much. If it's not desired I can add a new commit to remove them, or just don't merge Note.tsx and Notes.tsx.

[laurent22]

Ok I think it's reasonable too to have this context menu as you suggest. But in that case would you be able to remove the long-press menu and move the options over to that kebab menu?

[tiberiusteng]

OK I'll try it.

[laurent22]

Thanks @tiberiusteng. It looks like you made further changes and added the kebab menu, but the long press menu is still there? If could remove it now that you moved the functionalities that would great.

[tiberiusteng]

I was thinking that removing existing interface will cause confusion to users used that function before (but I don't think of a good way to direct users from original position to the new position, maybe just let them co-exist a few versions). But if you are OK to remove it now it's great too. I will wait for further discussion or final confirmation.