Skip to content

feat(contacts): contact list redesign [PERA-3929] [PERA-4123]#374

Merged
yasin-ce merged 6 commits intocontacts/03-shared-domainfrom
contacts/04-list
Apr 25, 2026
Merged

feat(contacts): contact list redesign [PERA-3929] [PERA-4123]#374
yasin-ce merged 6 commits intocontacts/03-shared-domainfrom
contacts/04-list

Conversation

@yasin-ce
Copy link
Copy Markdown
Collaborator

@yasin-ce yasin-ce commented Apr 24, 2026

Description

  • `ContactListScreen` redesigned: FlatList, per-row QR button, plus-icon header action (via `useNavigationHeader`), populated / empty / no-match / search states.
  • New `ContactQRBottomSheet` shared sheet with copy + share actions and an accessibility label on the QR wrapper.

Related Issues

Checklist

  • Have you tested your changes locally?
  • Have you reviewed the code for any potential issues?
  • Have you documented any necessary changes in the project's documentation?
  • Have you added any necessary tests for your changes?
  • Have you updated any relevant dependencies?

Additional Notes

Stacked on #373. `ContactListScreen.spec.tsx` updated for the redesign; `ContactQRBottomSheet.spec.tsx` added.

- Redesigned ContactListScreen: empty-state CTA, populated list with
  name + truncated address, per-row QR button, search with no-match
  state. Plus icon lives in the navigation header via
  useNavigationHeader (only when contacts exist).
- ContactQRBottomSheet (new): QR code scaled with screen width,
  truncated + full address, copy/share actions. Accessible label on the
  QR wrapper.
- Removed ContactListHeaderButtons — inlined via useNavigationHeader.
- Route no longer binds headerRight to the deleted component.
- vitest: mock react-native-share so the QR sheet's shareText util
  can be exercised in tests.
- i18n: contacts.list.qr_sheet_copy, qr_sheet_share,
  qr_accessibility_label.
@yasin-ce yasin-ce requested review from fmsouza and wjbeau and removed request for wjbeau April 24, 2026 02:59
@yasin-ce yasin-ce self-assigned this Apr 24, 2026
@yasin-ce
Copy link
Copy Markdown
Collaborator Author

Screenshot_20260424_040843

@yasin-ce yasin-ce marked this pull request as ready for review April 24, 2026 03:05
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
Comment thread apps/mobile/src/modules/contacts/screens/ContactListScreen/ContactListScreen.tsx Outdated
…mitives per review

- Extract ContactListScreen logic into a colocated useContactListScreen
  hook with an explicit result type (search state, QR state, memoized
  filter, navigation callbacks).
- Replace the bespoke empty state with EmptyView.
- Swap raw FlatList for PWFlatList.
- Use EmptyView for the no-match state inside ListEmptyComponent.
- useCallback renderItem / keyExtractor / row handlers so they stay
  stable across renders.
- useCallback handleCopy and handleShare in ContactQRBottomSheet.
@yasin-ce yasin-ce requested a review from wjbeau April 25, 2026 01:57
<PWText variant='h3'>{title}</PWText>
<PWText style={styles.message}>{message}</PWText>
<PWText
variant='body'
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

technically unnecessary - body is the default

@yasin-ce yasin-ce merged commit 40594d7 into contacts/03-shared-domain Apr 25, 2026
3 of 6 checks passed
@yasin-ce yasin-ce deleted the contacts/04-list branch April 25, 2026 22:51
yasin-ce added a commit that referenced this pull request Apr 27, 2026
- EditContactScreen.tsx: collapse merge artifact (duplicate useStyles
  imports, duplicate selectedContact/save declarations, stray useEffect
  referencing undefined symbols) into the clean useEditContactForm-based
  version.
- ContactListScreen.tsx: drop c.id ?? c.address (Contact no longer has
  an id field after the address-as-PK refactor); use c.address directly.
- ContactQRBottomSheet.spec.tsx: drop id from the test fixture.
- PWInput: expose rightIconContainerStyle, autoComplete, selectTextOnFocus,
  and align onFocus/onBlur with RNEInputProps so SearchInput can pass them
  through without a TS suppression.
- SearchInput: type SearchInputProps from PWInputProps instead of the
  wider InputProps so the {...props} spread is type-compatible.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants