[@nativescript/imagepicker] Returns `ImageAsset` with `content://` scheme that can't be loaded with `ImageSource.fromAsset`

Versions

@nativescript/core: 7.3.0
@nativescript/android: 7.0.1
@nativescript/imagepicker: 1.0.5

Problem

Using @nativescript/imagepicker in Android 10, the returned selected image has the following form when logged to console:

{
  "_observers": {},
   "_options": {
     "keepAspectRatio": true,
     "autoScaleFactor": true
 },
"_android": "content://com.android.providers.media.documents/document/image%3A29"

When trying to load this ImageAsset into an ImageSource with ImageSource.fromAsset I get an Asset 'content://com.android.providers.media.documents/document/image%3A29' cannot be found. error.

Example code

let context = imagepicker.create({
      mode: "single",
      mediaType: ImagePickerMediaType.Image,
    });

    context
      .authorize()
      .then(() => {
        return context.present();
      })
      .then((selection) => {        
        if (selection.length > 0) {
          ImageSource.fromAsset(selection[0])
            .then((imageSource) => {
              console.log("ImageSource loaded:", imageSource);
            })
            .catch((err) => console.error("Error loading ImageSource:", err));
        }
      });

Is this a bug, or is there another way to get an ImageSource from the result of the imagepicker selection?

[jamescodesthings]

As a heads up the issue looks to be this line: https://github.com/NativeScript/plugins/blob/master/packages/imagepicker/index.android.ts#L198

I’m getting these Uris returned on API Level 30 devices which suggests this line is causing the problem. Manually setting this to true fixed the issue for API Level 30 devices but I can’t be sure of the impact.

To workaround the problem in my project I’ve:

1. copied UriHelper into my own code as an exported class.
2. Wrapped my old ImageSource.fromAsset in a try catch
3. In the catch, if android, call UriHelper._calculateFileUri and try again.

Looks something like this:

      await picker.authorize();
      const result = await picker.present();

      // No images selected then return null
      // Should return here
      if (!result?.length) return null;

      const path = ImagePaths.rawImagePath();
      const asset: ImageAsset = result[0];
      try {
        const image = await ImageSource.fromAsset(asset);
        image.saveToFile(path, IMAGE_FORMAT);
        return path;
      } catch (error) {
        // This the new bit while waiting on #145
        if (isAndroid) {
          const url = asset?.android;
          if (!url) throw error;
          const uri = android.net.Uri.parse(url);

          const rawUrl = UriHelper._calculateFileUri(uri);
          if (!rawUrl) throw error;

          const newAsset = new ImageAsset(rawUrl);
          const image = await ImageSource.fromAsset(newAsset);
          image.saveToFile(path, IMAGE_FORMAT);
          return path;
        }
        throw error;
      }

[soscler]

Same here. I am using @jamescodesthings hack while waiting for a fix