I have this run-of-the-mill image component. The source is a URL.
My use case is the following: I want to generate a QR code (sorted), display it in an image (sorted), and then have some app-based way (no screenshot or right-click/save) to copy the image to the clipboard and/or trigger a download (preferably with a file name that I, developer, can control) so that I then may use a Whatsapp API link to open WhatsApp, and easily incorporate said QR code into the message.
I suspect (not checked yet) that I can use utils.openUrl in the mobile app so the WhatsApp part of this business is probably sorted. But the part that isn't, is the download/clipboard thing.
As a JS high-functioning disaster (I survived so far by being good at other languages and figuring things out with duct tape and chewing gum), I am in need of a tutorial for dummies on how to do this download/clipboard thing. I've seen there is some sort of discussion around happening with utils.downloadFile and some base-64 business, but I'm totally out of my depth with this for now and I cannot even say if it is relevant to my scenario.
I would rather avoid the utils.openUrl -> URL of the QR image in mobile browser -> hold click to download or copy image as this goes against the smooth user experience I want to give. I wish to be able to do it all in a single click: clipboard/download, open whatsapp with a pre-drafted message where I just need to plop the image before hitting Send.
You should be able to configure a solution using utils.downloadFile without much JavaScript. If you make a REST query you can dynamically pass it your image URL. Depending on how the image is hosted, it's possible that you'll get different responses, but as long as the response is consistent you should be able to grab a base64 string from it that you can pass to the downloadFile util:
The above uses https://www.qrstuff.com/images/default_qrcode.png as an example URL. If you're having trouble getting the base64 data it might be helpful if you can share one of the image URLs you're using.
When using the downloadFile util the person using the mobile app can be prompted with how they want to deal with the file and can choose WhatsApp themselves. Could that flow work for you?
I replicated exactly what you have displayed there, and I do get a nice base64 string out of it in the output section of the RESTQuery panel so I am confident this part is sorted.
First I tried it in the regular web-app retool environment, before moving on to Mobile. I had to modify the download script to the following:
specifying the data is base64 as otherwise the image downloaded onto my computer was not readable (it had a .png extension, but the contents according to notepadd++ were just the base64 string, not an actual image). After this fix, I was downloading a correct, readable png of my image.
Moving on to the Mobile environment, the same script causes no noticeable outcome. Debugger says it is running, but I get no download notification/prompt of any kind. So it seems to be specific to the Mobile version. Tested both on my desktop in the mobile dev, and directly in the Mobile app (Android, Galaxy S10e, retool app is up to date).
I tested this both with my own image (generated by api.qrserver.com) and with the QRStuff that you used in your example. Same outcome, so we can probably narrow it down to an issue with utils.downloadFile for mobile.
Hey @DocShades! The mobile environment can differ a bit from the desktop environment when interacting with file storage. What were you seeing when you tried the utils.downloadFile util on mobile without the { base64Binary: ... } wrapper?
Edit: There is an internal ticket for improving the behavior of utils.downloadFile in the web editor, which we can report back here on.
I've just run it again, with and without wrapper, and I still see no noticeable outcome. The RESTQuery is running (at least in mobile develop environment as inspecting the query data in the State panel does show a base64 data string.
But still no prompts regarding a download transaction happening, on mobile nor in the develop environment.
Should you wish to have a look for yourself, feel free to DM me and I can share my account name/org so you can go and duplicate the app I've built - or have someone who has adequate clearance do it if you haven't
The utils.downloadFile behavior should be fixed, where it should now show a share modal when accessing on Android, which wasn't happening before. Let us know if you're seeing otherwise!
