Difference in work with images on google drive in AI and common modules

[user19]

Problem is:
I made a AI custom image collection. all work fine for about hour, and then it stop show images, that stored on google drive.
Same time in other modules it continue to show.
It was doesn’t matter is it mobile or desktop. on same screen in AI - not show and in common - show.

why so? how to fix it? what prompt need to use in AI custom module?

[ThinhDinh]

Images in Glide | Glide Docs

If you can, please upload those images to Glide.

[user19]

Yes. I know it very well and use for about 2 years or more.

Images stored in Google Drive, they in public folder and each image is shared.

in same app that images showed in any modules but not showen in AI Custom module.

in case of forced migration from Classic App, I try to rebuild Card Collection with Favourites icon. I did it, but it show only images that stored in Glide. So, instruction about “public” and “share” - don’t work.

same time i can’t use workflow for automate upload to Glide - it’s out of fund.
hundred images in present base, and about 95% of updates came through make.com

i try different promt, but didn’t get success.

[ThinhDinh]

I would check the difference of how images are displayed in the underlying HTML. Possibly the Cloudinary layer Glide is applying on top of Drive images is helping it out a bit, I’m not sure.

The AI component is almost surely taking the raw image link.

[user19]

true.

i check html cod.

in Glide base and in url AI module this:
https://drive.google.com/file/d/1fhhGz-C8b-cejdpWpwDPN5TzDlzjiFvc (it’s not show in app)

but in other module in http page same image have this url:

https: //lh3.googleusercontent.com/ d/ 1fhhGz-C8b-cejdpWpwDPN5TzDlzjiFvc =w295?authuser=0 (i put some space in url, for not convert it)

![1fhhGz-C8b-cejdpWpwDPN5TzDlzjiFvc=w295](upload://sxMcAqzxto7PgCK6Jdva4n1amLn.jpeg)

will be a good idea make an alternative column with same jell but “googleusercontent.com” as domain name to avoid this problem?

[user19]

some more strange behaviour:

column where stored links to image (uploaded to glide or link to images in google drive) used to show in different module.

if i make a new row with image url to “googleusercontent.com” - it’s show in any modules, include AI (it possible celebrate in main question)

but all old row where was a link to drive.google - continue show or not show (in case of module AI or all other) even if i change this link or delete it.
there blank cell but app continue show it after 25 minutes and in browser that didn’t use before.
where from and why app take old information?

[user19]

2 hours left.
cell - empty (no link to image)
image still show in app

[Eric_Penn]

What does the AI component do? Do you have a screenshot? I believe it might be possible to build this without it.

[user19]

any, that show image from column with url to google drive. i try even without any addition feature.

if you need more things what AI Custom do:
it’s show square picture
in left upper corner show white text in blue nontransparent ellipse (from variable)
in right upper corner show “heart” that connected to switch and when it’s FALSE - it’s grey, when it’s TRUE - it’s blue colour
click on heart change state of variable switch and do not any other things. click outside of heart - show detail screen of row.

i even try just show image without all other - same behaviour

upper - is common image module
below - is AI Custom module
url - the same

[Eric_Penn]

I could explain more later but here is the idea.

Custom Collection + Rich Text + JavaScript

JavaScript

if (!p1) return '';
let parsed = typeof p1 === 'string' ? JSON.parse(p1) : p1;
const dataArr = Array.isArray(parsed) ? parsed : [parsed];
const parts = [];
dataArr.forEach(o => {
  const name = o.name || '';
  const image = o.image || '';
  const favorite = !!o.favorite;
  parts.push('<div style="position:relative;display:inline-block;margin:8px 8px 8px 0;width:100%;height:100%;">');
  parts.push(`<img src="${image}" style="width:100%;height:100%;object-fit:cover;object-position:center center;border-radius:4px;">`);
  parts.push(`<div style="position:absolute;top:8px;left:8px;background:#395FE1;color:#fff;padding:4px 8px;font-size:14px;border-radius:999px;">${name}</div>`);
  parts.push(`<div style="position:absolute;top:8px;right:8px;width:32px;height:32px;background:#eee;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;color:${favorite?'#007bff':'#ccc'};">♥</div>`);
  parts.push('</div>');
});
return parts.join('');