feat(react-native): animated connect loading states

joaquim-verges commented 3 months ago

PR-Codex overview

This PR introduces animated connecting states for React Native in the thirdweb package.

Detailed summary

Added animated connecting states for React Native
Created a function to get auth provider image
Implemented a WalletLoadingThumbnail component with animation
Refactored ExternalWalletsList and InAppWalletUI components to use a connector function instead of connectMutation
Updated SocialLogin and OtpLogin components to use the connector function for connecting wallets

The following files were skipped due to too many changes: packages/thirdweb/src/react/native/ui/connect/ConnectModal.tsx

✨ Ask PR-Codex anything about this PR by commenting with /codex {your question}

vercel[bot] commented 3 months ago

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
thirdweb_playground	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 3, 2024 8:52am
thirdweb-www	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 3, 2024 8:52am
wallet-ui	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Jul 3, 2024 8:52am

changeset-bot[bot] commented 3 months ago

🦋 Changeset detected

Latest commit: cc90c85b38c74b82f7a8bf02ac6e83e85fa27f54

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

| Name | Type | | -------- | ----- | | thirdweb | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

graphite-app[bot] commented 3 months ago

Your org requires the Graphite merge queue for merging into main

Add the label “merge-queue” to the PR and Graphite will automatically add it to the merge queue when it’s ready to merge. Or use the label “hotfix” to add to the merge queue as a hot fix.

You must have a Graphite account and log in to Graphite in order to use the merge queue. Sign up using this link.

joaquim-verges commented 3 months ago

#3583 👈
main

This stack of pull requests is managed by Graphite. Learn more about stacking.

Join @joaquim-verges and the rest of your teammates on Graphite

codspeed-hq[bot] commented 3 months ago

CodSpeed Performance Report

Merging #3583 will not alter performance

_{Comparing joaquim/rn-loading-ui (cc90c85) with main (e739d55)}

Summary

✅ 9 untouched benchmarks

github-actions[bot] commented 3 months ago

size-limit report 📦

Path	Size	Loading time (3g)	Running time (snapdragon)	Total time
thirdweb (esm)	40.54 KB (0%)	811 ms (0%)	1.1 s (+9.54% 🔺)	2 s
thirdweb (cjs)	90 KB (0%)	1.8 s (0%)	1.9 s (+0.16% 🔺)	3.7 s
thirdweb (minimal + tree-shaking)	4.82 KB (0%)	97 ms (0%)	324 ms (+155.55% 🔺)	420 ms
thirdweb/chains (tree-shaking)	433 B (0%)	10 ms (0%)	54 ms (-7.04% 🔽)	64 ms
thirdweb/react (minimal + tree-shaking)	13.56 KB (+0.32% 🔺)	272 ms (+0.32% 🔺)	191 ms (+24.78% 🔺)	463 ms

codecov[bot] commented 3 months ago

Codecov Report

Attention: Patch coverage is 50.00000% with 1 line in your changes missing coverage. Please review.

Project coverage is 62.55%. Comparing base (3c1734f) to head (cc90c85). Report is 3 commits behind head on main.

Additional details and impacted files

```diff @@ Coverage Diff @@ ## main #3583 +/- ## ========================================== - Coverage 62.73% 62.55% -0.18% ========================================== Files 896 897 +1 Lines 68729 69045 +316 Branches 3662 3663 +1 ========================================== + Hits 43115 43190 +75 - Misses 24926 25167 +241 Partials 688 688 ``` | [Flag](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583/flags?src=pr&el=flags&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) | Coverage Δ | | *Carryforward flag | |---|---|---|---| | [legacy_packages](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) | `65.59% <ø> (ø)` | | Carriedforward from [3c1734f](https://app.codecov.io/gh/thirdweb-dev/js/commit/3c1734f63946021ee7be024ebe0f8e380391e204?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) | | [packages](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583/flags?src=pr&el=flag&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) | `61.98% <50.00%> (-0.21%)` | :arrow_down: | | *This pull request uses carry forward flags. [Click here](https://docs.codecov.io/docs/carryforward-flags?utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) to find out more. | [Files](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583?dropdown=coverage&src=pr&el=tree&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev) | Coverage Δ | | |---|---|---| | [...hirdweb/src/react/core/hooks/wallets/useConnect.ts](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583?src=pr&el=tree&filepath=packages%2Fthirdweb%2Fsrc%2Freact%2Fcore%2Fhooks%2Fwallets%2FuseConnect.ts&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev#diff-cGFja2FnZXMvdGhpcmR3ZWIvc3JjL3JlYWN0L2NvcmUvaG9va3Mvd2FsbGV0cy91c2VDb25uZWN0LnRz) | `67.50% <50.00%> (ø)` | | ... and [5 files with indirect coverage changes](https://app.codecov.io/gh/thirdweb-dev/js/pull/3583/indirect-changes?src=pr&el=tree-more&utm_medium=referral&utm_source=github&utm_content=comment&utm_campaign=pr+comments&utm_term=thirdweb-dev)

thirdweb-dev / js