Redesign contact page with activity stream, avatar picker, and layout fixes#20
Merged
bashar-qassis merged 5 commits intomainfrom Apr 4, 2026
Merged
Conversation
- Fix edit page save crash: use :contact_updated atom instead of invalid "Contact updated" string for audit log event - Replace photo upload redirect with inline upload form in timeline modal using LiveView file uploads - Add full CRUD to RemindersComponent with inline form for creating and deleting reminders from the sidebar - Add AboutComponent with inline editing for description and "how we met" fields, including searchable contact picker with avatars - Fix dialyzer opaque type warning in photos_only? helper - Add automated tests for edit save, birthday badge, reminders, and photo upload modal
- Add ActivityStream context for unified timeline queries across notes, calls, life events, activities, tasks, gifts, conversations, and photos - Add UI component helpers (simple_form, badge, button, empty_state) - Redesign ContactFieldsComponent with compact sidebar styling - Redesign RelationshipsComponent with searchable contact picker - Add ActivityStream context tests
Incorporate phone_format support from PR #18 (monica-api-import) into the redesigned contact page layout. Keep redesigned UI as the canonical version, add phone_format prop to ContactFieldsComponent in both desktop and mobile views.
- Remove +1 country code assumption for bare 10-digit phone numbers - Widen desktop sidebar (300→340px) to reduce empty space - Fix mobile timeline/contact-info alignment with overflow control - Add gap and truncation to sidebar label/value rows - Add clickable avatar overlay with upload and photo picker popover
bashar-qassis
changed the title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Redesigns the contact detail page with a modern layout and fixes several UX issues:
lgbreakpointWhat changed
New features
ActivityStreamcontext with unified timeline queries across 8 entry types (notes, calls, life events, activities, tasks, gifts, conversations, photos)ActivityStreamComponent— timeline UI with filtering, quick-add buttons, overflow menu, and modal forms for creating/editing entriesAboutComponent— inline editing for description + "How We Met" fields with searchable contact pickerRemindersComponent— full CRUD with inline sidebar form (create + delete)Layout & UX fixes
gap-4,text-end,truncate)Bug fixes
Modified files
contacts/phone_formatter.ex,contacts/activity_stream.excontact_live/show.ex,show.html.heex,edit.exActivityStreamComponent,AboutComponent,RemindersComponent,ContactFieldsComponent,RelationshipsComponentui.ex— new helpers (simple_form, badge, button, empty_state)phone_formatter_test.exs,edit_test.exs, show page tests, activity stream testsTest plan
mix test— 1041 tests, 0 failuresmix compile --warnings-as-errors— cleanmix format— clean