Wallet logos not showing up?

[ChrisK1994]

Got this error, I think we should be able fo configure logos.

Not allowed to load local resource: file:///C:/Users/user/Desktop/project/client/node_modules/@mindsorg/web3modal-ts/dist/providers/logos/metamask.svg

[ChrisK1994]

Could you change logo: URL(...)

[Yetispapa]

Got the same error. Any update on this?

[Nach0Git]

@Yetispapa @ChrisK1994
The issue is on the library web3modal-ts. They fixed the issue in this commit and then updated the version to 1.3. This repository is using v1.2.2. projects/webmodal/package.json
I just created a pull request updating the version to 1.3 and plus updating the angular version to 13, I hope they review it soon.

[ottman]

We will check it out this week. Sent from ProtonMail mobile

…

-------- Original Message --------

On Feb 5, 2022, 5:59 PM, Nach0Git wrote: ***@***.***(https://github.com/Yetispapa) ***@***.***(https://github.com/ChrisK1994) The issue is on the library web3modal-ts. They fixed the issue in [this commit](https://gitlab.com/minds/web3modal-ts/-/commit/1cf71232b99dc1c8af688f179c7458a215e62087) and then updated the version to 1.3. This repository is using v1.2.2. projects/webmodal/package.json I just created a pull request updating the version to 1.3 and plus updating the angular version to 13, I hope they review it soon. — Reply to this email directly, [view it on GitHub](#4 (comment)), or [unsubscribe](https://github.com/notifications/unsubscribe-auth/AAOVPSBM3JJPGERIO2B3V53UZWTWZANCNFSM5LZZITNA). Triage notifications on the go with GitHub Mobile for [iOS](https://apps.apple.com/app/apple-store/id1477376905?ct=notification-email&mt=8&pt=524675) or [Android](https://play.google.com/store/apps/details?id=com.github.android&referrer=utm_campaign%3Dnotification-email%26utm_medium%3Demail%26utm_source%3Dgithub). You are receiving this because you are subscribed to this thread.Message ID: ***@***.***>

[Yetispapa]

Great! Looking forward for the solution 👍

[Nach0Git]

@Yetispapa @ChrisK1994
I found this to be a problem only for angular 13. With the following package (using latest angular 12) everything seems to work nicely

    "@angular/animations": "~12.2.0",
    "@angular/common": "~12.2.0",
    "@angular/compiler": "~12.2.0",
    "@angular/core": "~12.2.0",
    "@angular/forms": "~12.2.0",
    "@angular/platform-browser": "~12.2.0",
    "@angular/platform-browser-dynamic": "~12.2.0",
    "@angular/router": "~12.2.0",
    "@mindsorg/web3modal-angular": "^1.6.1",
    "@walletconnect/web3-provider": "^1.7.1",

I think for angular 13 the web3modal-ts dependency should be bumped to v1.3 to fix the issue.

[bhayward93]

Hey, is this fix applied to the branch you are currently using?

https://gitlab.com/minds/web3modal-angular/-/merge_requests/6/diffs

[bhayward93]

It may be a separate issue, as the linked one above is with a Metamask logo outside of the base web3-modal package.

[Nach0Git]

@bhayward93 Is a different issue. This affects to every provider icon when using angular 13.
In web3modal-ts v1.3 there's a change to load the icons through URL(...).
I think bumping the version to 1.3 would fix this. Here's the pr

[bhayward93]

I see, thanks for this - we're currently in the progress of upgrading to Angular 13 ourselves so will be able to test the PR fully as we upgrade - quite likely by the sounds of it we would have ran into the same issue.

Would you be able to give the CLA here a read and signature? https://developers.minds.com/docs/contributing/contributing/

[Yetispapa]

Hi @bhayward93,

great! Looking forward to the update

[bhayward93]

@Nach0Git did you test this PR via npm link? I'm still seeing the same behavior now I've upgraded our main stack to Angular 13 locally. I'm tempted to try upgrading the whole package to Angular 13 while I'm in here.

[bhayward93]

Also note the package-lock's haven't been pushed but can add that in as a commit myself

[Nach0Git]

@bhayward93 I might have had the local env in a wrong state when I tested this the first time (I was trying a couple approaches to upgrade the packaging to angular 13). I just started over on a fresh branch and I do see the same error on the icons. If I have some time during the week I'll review this again, for my personal project I opted for using the library with angular 12.

[bhayward93]

I think the issue may be this angular/angular-cli#22351 - would need to test but it fits the issue quite well. Just considering what the best path forward is currently.

[Nach0Git]

@bhayward93 Thanks for the heads up!
Browsing on the libraries issues it seems like they have fixed it in Webpack webpack/webpack#14809
And there's an open feature request to fix this in the angular side angular/angular-cli#22510

[bhayward93]

Thanks for sharing - as It's potentially another 30 days away from being considered though, we may have to look for another solution rather than hold up our own core-sites Angular 13 upgrade. I'm currently playing with thing to see if I can make it work - one option also being considered is merging the web3modal-angular and web3modal-ts packages, which could potentially simplify the problem space.

[bhayward93]

A candidate for release is up here https://gitlab.com/minds/web3modal-angular/-/merge_requests/8/diffs

We opted to merge the two projects and replace the logo URLs with static URLs served from our CDN - we also added an option so you can override if you like to use your own CDN to retain control over the assets/change logos as you wish.

[bhayward93]

We're pushing another upgrade, to move the Angular version to Angular 13 because compilation fails in our app when using 1.7.0 direct from npm, which was not apparent during development and testing.

I have created a mirror card here for our own internal tracking https://gitlab.com/minds/web3modal-angular/-/issues/7