Image from local storage are not reading , surface view coming black.

[ajitdas123]

I am trying to load the image picked by the camera into Gl editor but its showing black. Here is example of my code

const t = {uri:"content://media/external/images/media/148757"}; // Local storage file path from the camera

  <Surface style={{width: 250, height: 250}}>
        <Node
             shader={shaders.sharpen}
             uniforms={{
              factor,
              resolution: [250, 250],
               t,
            }}
         />
  </Surface>

shaders Config:

const shaders = Shaders.create({
    sharpen: {
        frag: GLSL`
      precision highp float;
      varying vec2 uv;
      uniform sampler2D t;
      uniform float factor;
      uniform vec2 resolution; 

      void main() {
        float test = factor;
        vec2 step = 1.0 / resolution;

        vec3 texA = texture2D( t, uv + vec2(-step.x, -step.y) * 1.5 ).rgb;
        vec3 texB = texture2D( t, uv + vec2( step.x, -step.y) * 1.5 ).rgb;
        vec3 texC = texture2D( t, uv + vec2(-step.x,  step.y) * 1.5 ).rgb;
        vec3 texD = texture2D( t, uv + vec2( step.x,  step.y) * 1.5 ).rgb;
        
        vec3 around = 0.25 * (texA + texB + texC + texD);
        vec3 center = texture2D( t, uv ).rgb;
        vec3 col = center + (center - around) * factor;

        gl_FragColor = vec4(col, 1.0);
      }
    `
    }
});

This doesn't work, but if I change the URL to some website image URL for example

const t = {uri: "https://cdn.pixabay.com/photo/2014/02/27/16/10/flowers-276014__340.jpg"}

Expected behavior

It was expected to render the image as it renders for an external URL

Actual behavior

But it just shows a black screen

Environments

• react-native: 0.69.3
• gl-react: 5.2.0
• gl-react-native: "5.2.1
• expo": 46.0.0
• expo-gl: 11.4.0
• Device: Android

Screenshot