terry-wallet-login #15

Merged

terry merged 95 commits from terry-wallet-login into terry-staging 2026-06-05 16:32:43 +00:00

Conversation 0 Commits 95 Files Changed 76 +15294 -438

terry commented 2026-06-04 17:10:02 +00:00

Owner

Copy Link

No description provided.

terry added 71 commits 2026-06-04 17:10:03 +00:00

docs: design china-friendly wallet login b265a57541

docs: design user favorites df20005357

feat: add wallet provider foundation 71dac8373e

feat: add wallet login modal 43700d9fdc

feat: add favorites state and buttons 337e8f7e67

feat: build favorites page de93e883c9

feat: add favorites to latest rows 4900256423

fix: close mobile menu before wallet login 05c2252b49

fix: clean up wallet favorites state fc2ca62957

docs: note wallet session tradeoffs 184193e655

fix: encode metamask dapp deep link fb6cb5bc11

fix: batch favorite status checks b9fe7ff168

fix: simplify wallet choices and use bnb chain 0edcc80513

docs: design wallet login + favorites redesign and backend checklist ... f935f122f9

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

feat: redesign wallet login and favorites, fix desktop/mobile bugs ... 7abe4a868c

- Remove forced BNB chain switch on injected login (signature is chain-agnostic)
- Refine isMobileDevice so touch Macs stay on desktop flow
- Wire RainbowKit/WalletConnect as a real MetaMask/imToken QR fallback,
  gated on a valid VITE_WALLETCONNECT_PROJECT_ID
- Rebuild login modal: single desktop primary action, collapsible other
  methods, mobile open-app fallback feedback, brand icons
- Add My Favorites entry points (header, mobile menu, wallet dropdown)
- Favorites page: error retry, mobile filter drawer
- Auto sign-out and re-login prompt on favorites 401
- Full native translations for all wallet strings across 7 locales

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fix: TokenPocket mobile deep-link login, desktop empty-state, toast above modal ... ed04e1fb7e

- Mobile TokenPocket now opens the tpoutside:// sign deep link and returns to
  the original browser to finish login (no wallet in-app browser); desktop
  keeps the QR. Fixes mobile login + logout being trapped in TP's browser.
- Desktop without an injected wallet shows a clear message instead of a dead
  button; TokenPocket login card is always available as a working path.
- Raise toast z-index above the login modal so feedback is visible.
- Add native TokenPocket-login strings across 7 locales.
- Document that the live backend lacks favorites + TokenPocket routes (404),
  the real blocker for those features in production.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fix: reset TokenPocket request state on expired/failed poll ... 8821058c0a

Clear tpRequest when a TokenPocket login expires or fails so the mobile UI
returns to the initial state instead of showing a stuck waiting spinner
alongside the error.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fix: use RainbowKit picker for desktop browser-wallet login ... 11599e54ea

Raw window.ethereum is unreliable when several extensions contend for it, so
desktop now opens the RainbowKit connect modal (EIP-6963 wallet discovery +
WalletConnect QR) when a project id is configured, falling back to the injected
flow otherwise. In-wallet mobile browsers keep the direct injected sign.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

fix: keep desktop browser-wallet on direct injected; add login diagnostics ... e1b24aa0f9

Revert desktop primary back to the direct injected sign (no WalletConnect relay,
which could spin forever) — reliable for a BNB-chain extension. Add console
diagnostics ([wallet-login] ...) and provider enumeration so a stuck/no-popup
flow can be pinpointed. WalletConnect stays as the explicit mobile MetaMask/
imToken option.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

docs: add wallet/favorites UI redesign requirements brief ... 4e33c7deef

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

Merge remote-tracking branch 'origin/main' into terry-wallet-login 0898744deb

fix(wallet): improve mobile login and logout flows f0209eb894

fix(wallet): simplify mobile login choices 243e98b829

refactor(wallet): use unified rainbowkit login 803d3d57c1

fix(wallet): support no-signature wallet connect 4d38c4513d

fix(wallet): handle desktop walletconnect reconnect 850daf3a2a

fix(wallet): reconnect wallet session on reload 8a948e41e0

Merge remote-tracking branch 'origin/main' into terry-wallet-login a8863c5478

fix(wallet): improve imtoken mobile login fallback cd85a4bcfa

Merge branch 'main' of https://repo.skywalker-rs.com/terry/Arkie-Library-Frontend into terry-wallet-login b19486e908

fix(wallet): restore metamask mobile login 6552b92c50

fix(wallet): complete desktop qr login after approval a68dd8f616

ci: add staging deploy workflow for terry-wallet-login ... 966663f3d7

- trigger on push to terry-wallet-login
- deploys to staging server via STAGING_* secrets
- rsync to /var/www/ark-library-staging/, sha256 verify

ci(staging): aggressive disk cleanup to prevent ENOSPC during npm ci ... 42b25b9e09

- wipe all stale act workspaces (keep only current run's dir)
- clear ~/.npm/_cacache and setup-node cache fully
- docker system prune -af --volumes
- apt/yum cache clean, journald vacuum to 100M
- /tmp older than 30min instead of 120min

ci(staging): revert act cache wipe, keep other aggressive cleanup ... 49380dc5ed

Previous attempt deleted the in-flight act workspace and broke
actions/checkout. Restore the safe >60min sweep for ~/.cache/act
while keeping npm/docker/tmp/log cleanup aggressive.

style(home): align popular rank row and recommended card with figma ... a2f6c4fc35

- PopularRankList: switch row to 90px Figma layout (246x90 cover, gap 24/12, pill px-3 py-1, meta color #9FA0A8, object-cover image)
- RecommendedCard: unify card and cover background to #272632

style(home): set recommended card background to #1D1E23 per figma spec 7e4be0a590

style(popular): drop static border on rank row to match figma spec 4f0d8925a4

feat(home): align desktop cards with Figma actions ... be638e32c9

- Update desktop header actions to match Figma: remove the standalone desktop favorites button and style the wallet connect pill with the wallet icon while allowing localized labels to expand.
- Replace favorite action with the Figma bookmark SVG and hover state; replace download cloud with the provided Figma SVG.
- Align official recommendation cards with the Figma card structure, colors, and bottom action row.
- Rework popular rows to the Figma desktop rhythm with 90px rows, wide thumbnails, rank area, and right-side action buttons.
- Add a dedicated desktop LatestUpdateCard for Figma-style latest-update masonry cards with flexible text-driven heights instead of fixed card heights.

fix(home): match Figma media pills for latest cards ... 724bfb8f24

- Align latest-update media size pills to the Figma spec: 72x24 pill, black background, 24px gray icon cell, 10px label, and the exact small Figma cloud-download SVG.
- For non-document latest cards, remove the duplicate footer download action so media cards only show per-media size/download pills plus the bookmark action, matching the Figma non-document card design.
- Keep card heights flexible so content determines the final card height instead of locking to design mock heights.

Merge branch 'main' into terry-wallet-login ... b4ef5ddb61

# Conflicts:
#	src/components/messageStream/MessageStream.tsx

feat(wallet): bypass WalletConnect for TP/imToken on mobile to fix China users ... 6800a8e9b6

The WalletConnect relay (wss://relay.walletconnect.org) is unreliable/blocked
in mainland China. Every wallet flow (desktop QR, mobile deeplink, mobile QR)
depends on it, so Chinese users see the login button hang forever and the
QR code never appears. When RainbowKit's render fails, the whole site goes
white because nothing catches the error.

Changes:
- Add WalletStackErrorBoundary around <RainbowWalletProvider> + modal so
  RainbowKit init failures no longer blank the entire app.
- Hoist <WalletProvider> above the boundary; it only depends on the injected
  provider, so useWallet keeps working for header / favorites / etc. even
  when the WC stack is dead.
- On mobile, the TP/imToken 'Open Wallet App' button now navigates directly
  to tpdapp://open / imtokenv2://navigate/DappView with an ?autoLogin=<kind>
  query, pulling the site into the wallet's in-app browser without ever
  touching the WC relay. MetaMask still uses the WC path (no equivalent
  deeplink).
- Add AutoInjectedLogin: when the page loads with ?autoLogin=<kind>, wait
  up to 8s for window.ethereum, then connectInjectedWallet + completeLogin.
  Strips the param via history.replaceState to avoid re-firing on reload.
- Guard against the in-app-browser disconnect/reconnect case: if
  getInjectedWallet(kind) is already truthy, skip the deeplink and let
  useWalletConnectLogin's deeplink mode take the injected fast path
  (avoids TP trying to open TP recursively).

feat(stream): bubble footer with timestamp and inline favorite/download ... 2ef26390be

Match the Figma 4206-6509 card layout for /browse: every bubble now
renders a bottom row with the publish timestamp on the left and the
action buttons on the right. Image, album, video, text and link cards
show only the FavoriteButton; file-document cards show the
FavoriteButton plus a new BubbleAttachmentDownloadButton sized to
match. Removes the absolute-positioned favorite from the default
variant, drops the right-aligned timestamp block, and strips the inline
per-row download button from FileDocBubble's default variant since the
download now lives in the footer. The 'latest' masonry variant is
untouched so the home page continues to use LatestFileCard's existing
internal footer.

feat(layout): full-screen mobile menu drawer matching Figma 4164-5733 ... 39f9cba8c7

Rebuild the mobile hamburger menu as a full-screen drawer that matches
the Figma design 1:1 — five nav items (全部资料 / 资料分类 / 官方推荐 /
最新更新 / 热门资料), transparent item backgrounds over the ark-bg
drawer, hairline dividers at #2B2B37, gold text on the active route,
and the existing WalletButton compact pill as the bottom CTA. Drop the
chevron-right indicators per the rendered Figma frame and remove the
old 收藏 row since it's not in the design.

Also move the drawer JSX out of <header sticky top-0 z-40> and render
it as a sibling at the layout root. The sticky+z-index header was
creating a stacking context that trapped the drawer's z-50 fixed below
the bottom nav at z-40 global, so the drawer never reached the
foreground.

Add the same iOS-safe body scroll lock used for the search overlay so
the underlying page doesn't drift while the drawer is open.

feat(wallet): swap CTA glyph to Figma 4414-12829 filled wallet icon ... 173c283fb8

The 链接钱包 CTA was using the lucide outline Wallet icon. Replace it
with a local WalletIcon component built from the exact Figma path
(filled body, currentColor fill) so the icon paints in dark on the
yellow CTA, matching Figma's #08070C fill via the button's text-black
utility.

style(layout): apply Figma drawer translucency with backdrop blur ... 57dc25e5eb

Figma 4164-5336 frame 173 specifies the drawer body as #14131A at 90%
opacity with a 24px background blur. Switch bg-ark-bg to bg-ark-bg/90
backdrop-blur-xl so the underlying page bleeds through softly rather
than being fully masked.

fix: require signature for tokenpocket direct login 526facb261

style(layout): align mobile drawer spacing with Figma 4164-5336 ... 8140828c11

Drawer top: drop nav pt-2 so the first menu item sits flush with the
drawer top edge per Figma frame 173 (first item y matches drawer y).

Drawer bottom: raise CTA bottom inset from 20px to 34px so the gap
between the 链接钱包 button and the drawer's bottom edge matches the
Figma measurement (Btn Primary bottom y=25041 vs drawer bottom y=25075).
The safe-area-inset env() still wins on devices with a larger inset.

fix: skip wallet verification gate when logged in 469e53a860

fix: detect imtoken injected provider by browser a1b318016f

fix: remove wallet verification popup 93790cb885

fix: restore imtoken direct login path 53eab4a066

fix: auto login inside imtoken browser f8369b6361

chore: remove wallet code comments 355c920c80

fix: restore staging imtoken login behavior fb904d3a55

feat: simplify wallet login options 65dee3a37e

fix: translate wallet no account error ae64f96bbe

feat: guide desktop wallet connection 0a86619b6c

i18n: translate wallet desktop guidance 90f27b050c

feat: confirm desktop wallet address 4059ec3f20

Merge branch 'main' into terry-wallet-login ... 863a448ec9

# Conflicts:
#	src/App.tsx

fix: restore mobile wallet login feedback 53dc35e7dc

fix: hide imtoken on desktop wallet login fd19ed438e

feat: connect wallet favorites to backend 01eab88c0f

fix: limit visible toasts efaf92c4e4

fix: stabilize favorites page loading 6471559b3b

fix: simplify favorites display 4f6cbbc314

fix: align favorites page with post adapter ec98ff5a03

fix: fall back to original language on post redirect 1fcf2ea46d

fix: dedupe post redirect language fallback 062f630798

Merge branch 'main' into terry-wallet-login e73e25077e

terry added 10 commits 2026-06-05 10:58:18 +00:00

feat(wallet): redesign drawer wallet states to match Figma 4476-15287/15669 ... 292c745549

Disconnected state (Figma 4476-15287): bump the compact CTA to the
spec'd dimensions — h-12 (48px), text-[15px], font-medium — so the
yellow 链接钱包 button matches the Figma pill exactly while leaving
the desktop header pill (compact=false) untouched.

Connected state (Figma 4476-15669/16024): rebuild the compact branch as
the spec'd info card + danger button:
- A transparent 登录地址 label (text-[13px] font-bold #E5E5E5) with an
  8px gap to the full 0x… address, which uses Figma's character-level
  styling: first 5 and last 5 chars rendered bold white, middle 32
  chars rendered #A8A9AE / font-medium, replicating Figma's
  characterStyleOverrides.
- A full-width 48px disconnect pill at bg-[#2A1B20] with #F36161 text
  and the LogOut glyph on the right at 15px font-medium.

Add a new walletLoginAddress i18n key across all 7 locales (en, zh-CN,
ja, ko, vi, id, ms) for the new 登录地址 label.

fix: simplify mobile favorite button state 486c09dd39

fix: refresh favorites after unfavorite a9ec46e008

fix: show download per document attachment 5d550e0342

fix: hide rank badges on favorites 4e459aa4be

fix: adjust mobile popular card layout aae7faf9dd

fix: clarify multi-document downloads 908f89ac24

fix: unify home download button sizing 2d003c6fef

fix: show only selected post from favorites 9f5367ae12

fix: avoid unnecessary favorites reloads abfd92b16a

terry added 2 commits 2026-06-05 11:12:29 +00:00

fix: in-app browser download opens file inline ... 7a33a62c8f

- Detect in-app WebViews (WeChat / TokenPocket / imToken / Telegram / iOS WKWebView, etc.) and show a guide modal asking the user to open the link in their system browser, with a copy-link action.
- For normal browsers, fetch the attachment as a Blob and trigger download from a same-origin object URL so the file always lands in the user's Downloads folder with the original filename, even when the browser would otherwise inline-preview the response.
- Fall back to the anchor download for files larger than 50MB (avoid loading them entirely into memory) or when fetch fails.
- Pass `sizeBytes` from known call sites so the threshold actually applies.
- Add localized strings for the guide modal in all 7 locales.

See .unipi/docs/debug/2026-06-05-in-app-browser-download-debug.md.

fix: use absolute URL in in-app download guide ... 356d8a0207

Production builds the frontend with VITE_API_URL="" so attachmentDownloadUrl() returns a relative path like /apnew/api/.../download. Pasting that into Safari from another origin fails. Convert the URL to an absolute one (window.location.origin + path) before showing it in the in-app browser guide, and update the modal text in all 7 locales to make clear the copied link is the direct file download URL that, when opened in the system browser, triggers the download automatically.

terry added 1 commit 2026-06-05 11:16:32 +00:00

fix: hide download URL in in-app browser guide ... 3275aff121

Stop exposing the internal /apnew/api/.../download URL in the guide. The dialog no longer renders the file URL or copies it to the clipboard; instead the user copies the current page link (window.location.href) and opens it in their system browser, then taps download again — which uses the real fetch+blob path. Updated step copy and intro in all 7 locales to match the new flow.

terry added 1 commit 2026-06-05 11:33:02 +00:00

fix: hide download button on favorites cards ... 69bef7ee6e

Add `showDownload` prop to PopularRankRow (default true to keep Home popular cards unchanged) and pass `showDownload={false}` from the favorites list.

terry added 3 commits 2026-06-05 13:11:30 +00:00

fix: download button on cards opens the post page ... 75ccfd78ed

On compact cards the user cannot see which file is attached, especially for multi-attachment posts. Make the small download button on PopularRankRow, RecommendedCard, and LatestUpdateCard navigate to the post detail page instead of triggering an immediate download, so the user lands in the full post and picks the exact attachment to download.

Revert "fix: download button on cards opens the post page" ... ee3f2c43eb

This reverts commit 75ccfd78ed.

Revert "fix: hide download URL in in-app browser guide" ... 4c684d75a3

This reverts commit 3275aff121.

terry added 1 commit 2026-06-05 13:22:11 +00:00

fix: hide URL preview in in-app download guide ... ec8ef5b774

Drop the visible URL box from the modal — only the Copy link button remains. Copy still writes the absolute file download URL to the clipboard so the user can paste it into Chrome/Safari to trigger the download.

terry added 2 commits 2026-06-05 13:40:45 +00:00

fix: show full language name in the picker ... b38b28f175

The desktop language pill had a fixed width (md:w-36 lg:w-40) that truncated long labels like "Bahasa Indonesia". Drop the fixed width so the button sizes to content, remove the truncate on the label, and let the dropdown menu match parent width with a sensible min-width. Same `truncate` was hiding the full label inside the mobile drawer dropdown — bumped its width to fit too.

fix: stop language picker shrinking in flex header ... e80330b13c

After dropping the fixed width, the language pill still got truncated because its flex parent could shrink it below content size. Add `shrink-0` to the wrapper and switch the trigger button from `w-full` to `w-auto` with `whitespace-nowrap`, so the button always sizes to fit the longest label like "Bahasa Indonesia".

terry added 1 commit 2026-06-05 16:06:26 +00:00

fix: route favorites cards through /resource so they survive language switch ... 37e6e4901f

Favorites are stored regardless of language but the card click was navigating to /browse?post=<id>&single=1 in the current UI language. When the user switched languages (e.g. zh→en) and tapped a zh-only favorite, the /browse stream couldn't find the post in its English view and showed "Couldn't find this post in the current view".

Make Favorites navigate via /resource/<id> instead. PostRedirect already tries the current UI language first, then falls back to the post's source language and shows a toast. Renamed PopularRankRow's seldom-used `singlePostLink` to `linkToResource` to make the intent obvious; Favorites passes the new prop.

terry added 2 commits 2026-06-05 16:25:34 +00:00

fix: favorites click opens isolated single-post view ... fd1a3f4b3e

When `linkToResource` is set, PopularRankRow now navigates to /resource/<id>?single=1 and PostRedirect propagates the `single=1` flag to the /browse?post=... target. MessageStream already supports singlePostMode (no filter bar, no sentinel, only the target post in the list), so favorites cards open the post in isolation instead of dropping the user into the surrounding stream.

fix: add favorites to public navigation bd48fded30

terry added 1 commit 2026-06-05 16:30:41 +00:00

fix: keep popular card hover ring inset ae84e73736

terry merged commit 85a24ef982 into terry-staging 2026-06-05 16:32:43 +00:00

terry referenced this issue from a commit 2026-06-05 16:32:44 +00:00

Merge pull request 'terry-wallet-login' (#15) from terry-wallet-login into terry-staging

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

No items

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

louis terry

No Assignees

1 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: terry/Arkie-Library-Frontend#15