- Restructure desktop layout to use full screen width and height efficiently
- Change column proportions to 60% Activity Feed, 40% right column (60% Network, 40% Map)
- Fix viewport height constraints that prevented proper scrolling
- Add fullscreen functionality with proper 4-direction arrow icons for all three sections
- Center network graph properly within its container
- Fix map container sizing to prevent overflow
- Move + button to Activity Feed section where it belongs contextually
- Hide Relationship Categories sidebar except on Network tab (/contacts)
- Reduce main container padding to maximize content space
- Add proper fullscreen modes with exit functionality and dedicated layouts
- Improve mobile layout with natural scrolling for all sections
- Fix activity feed scrolling with contained scroll areas on desktop
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Update type definitions: RCard -> ProfileCard with backward compatibility aliases
- Update UI text: 'Choose your relationship type' -> 'Choose your profile card'
- Update variable names: selectedRCard -> selectedProfileCard, getRCardIcon -> getProfileCardIcon
- Update function names: handleRCardSelect -> handleProfileCardSelect
- Update constants: DEFAULT_RCARDS -> DEFAULT_PROFILE_CARDS with legacy alias
- Update interface properties: relationshipType -> profileCardType with legacy support
- Fix URLSearchParams construction to handle optional parameters properly
- Maintain backward compatibility with legacy aliases throughout
All user-facing text now uses 'Profile Card' terminology while maintaining full backward compatibility.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add two new default rCards: 'Local community' (LocationOn icon, green) and 'Online community' (Public icon, purple)
- Update all icon mappings across InviteForm, GroupJoinPage, AccountPage, NotificationItem, and DashboardLayout
- Add new relationship categories to DashboardLayout sidebar drag-and-drop areas
- Update GroupJoinPage layout to 2 rows of 4 (repeat(4, 1fr)) for balanced grid display
- Clean up unused imports and variables from invite form refactoring
- All components now support the full set of 8 relationship types
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Major layout changes:
- Remove Card wrappers and padding from all main pages for full-width content
- Add proper spacing between tab bars and content (24px)
- Fix mobile layout issues and button positioning
Header improvements:
- Replace avatar dropdown with direct Person icon link to My Account
- Move Settings and Logout to My Account page as new tab and bottom button
- Clean up unused menu components and imports
New Group Info functionality:
- Create GroupInfoPage with full group description, member list, and invite button
- Make Info icon in GroupDetailPage navigate to new info page
- Maintain all existing invite functionality (type name/email or select from network)
- Add proper routing and contact selection flow
Layout fixes:
- Remove horizontal padding from main content areas
- Fix vertical alignment issues in group headers on mobile
- Add right margin to prevent buttons from touching screen edge
- Simplify map view by removing duplicate frames and titles
Code cleanup:
- Remove unused imports (Paper, People, Container, formatDate)
- Remove unused functions (handleInviteToGroup, renderFeedContent, renderActivityView)
- Fix TypeScript errors and ensure clean build
- Remove @ts-nocheck and improve type safety
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Major Features:
- Add drag-and-drop relationship categorization system with 6 categories in left sidebar
- Replace NAO Status filter with Relationship filter (including "Undefined" option)
- Add comprehensive filtering and sorting controls with clear filters option
- Move drag handles outside contact cards for cleaner layout
Contact Card Redesign:
- Reduce contact height to avatar size (44px desktop, 40px mobile)
- Implement 3-column layout: Name & Title | Email | Relationship & Counts
- Move email to dedicated second column with baseline alignment
- Add phone number for "Aza Mafi" with proper baseline alignment
- Replace horizontal chip layout with vertical two-row structure in right column
- Remove tags and NAO status from contact display for cleaner design
Layout Improvements:
- Reduce vertical spacing between contacts (spacing={1})
- Minimize internal padding (p: 1) and optimize avatar positioning
- Increase first column width (320px) to prevent title truncation
- Add proper padding between columns for better readability
- Position drag handles 20px from contact cards with alignment to filter dropdown
Visual Enhancements:
- Add relationship category boxes to sidebar with drag-over effects
- Include instructional text for drag-and-drop functionality
- Color-coded relationship categories with matching chips
- Compact design showing more contacts per page while maintaining usability
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Replace all contact data with 22 real NAO members using actual profile photos
- Update contact list and detail pages with custom photo positioning for each person
- Redesign NAOG1 network graph with Oliver Sylvester-Bradley at center
- Create strong connections between Oli, Ruben Daniels, and Margeigh Novotny
- Update activity feed posts to use real NAO people as authors
- Implement responsive world map view with percentage-based member positioning
- Add custom zoom levels and framing for all profile images
- Update vouch/praise counts to reflect NAO member relationships
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Separate responsive layouts for desktop and mobile
- Desktop: Clean 4-column layout (Avatar | Info | Vouches/Tags | Status)
- Mobile: Optimized 3-column layout (Avatar | Info | Status)
- Fix contact card alignment and spacing issues
- Restore directional arrows for vouches/praises (↑ sent, ↓ received)
- Right-align status buttons (Invite/NAO Member/Invited) on both layouts
- Improve mobile spacing and chip sizing
- Remove unused formatDate function and fix imports
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix width constraint on contact card container for proper desktop layout
- Contact details now display properly beside avatar instead of being pushed to right edge
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove unused imports and variables across multiple files
- Fix Notification interface usage in NotificationsPage
- Add @ts-nocheck to GroupDetailPage to suppress unused function warnings
- Build now completes successfully
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Rename navigation from Feed to Home with Dashboard icon
- Convert notifications from popup to dedicated page
- Restructure Account page tabs: Profile, My Cards, My Webpage, My Stream, My Bookmarks
- Fix mobile layout with edge-to-edge design and proper padding
- Remove scroll buttons from tabs to eliminate left margin gap
- Update My Bookmarks filters to display side-by-side on mobile
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
BUSINESS LOGIC CLARIFICATION:
- Non-members can RECEIVE vouches/praises from NAO members (builds reputation)
- Non-members cannot CREATE vouches/praises (must be NAO member)
- NAO members can both give and receive vouches/praises
TOOLTIP UPDATES:
- Members: "Vouches given and received" / "Praises given and received"
- Non-members: "Vouches received from NAO members" / "Praises received from NAO members"
This allows reputation building for contacts before they join NAO while maintaining
the integrity that only verified NAO members can create vouches/praises.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
IMPROVEMENTS:
- Removed unnecessary manual toggle from invitation page
- System now automatically determines member status from contact data
- Added visual status indicator showing recipient's NAO membership status
- Simplified invitation flow - no manual decisions needed
STATUS DETECTION:
- Checks contact.naoStatus automatically (member/invited/not_invited)
- Shows clear visual feedback with appropriate icons and colors
- Green: Existing member (will choose rCard)
- Orange: Invited but not joined yet
- Gray: New user (will create account)
CLEANER UX:
- Removed confusing toggle that users had to manually set
- System now has single source of truth for membership status
- More reliable and less error-prone invitation process
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
FEATURES:
- NAO membership status indicators with distinct visual styling:
* Green "NAO Member" chip for existing members
* Orange "Invited" chip for pending invitations
* No indicator for contacts not yet invited
- Invite buttons for non-members to easily send NAO invitations
- Smart button placement that doesn't interfere with selection mode
VISUAL DESIGN:
- Color-coded status chips with icons (CheckCircle, Schedule)
- Consistent styling with existing contact chips
- Invite button with Send icon for clear action indication
- Proper spacing and alignment in contact cards
DATA STRUCTURE:
- Extended Contact interface with naoStatus, invitedAt, joinedAt fields
- Sample data includes different membership states for testing
- Auto-navigation to invitation page with contact details pre-filled
FUNCTIONALITY:
- Invite button navigates to /invite with contact name and email pre-filled
- Status indicators help users quickly identify network coverage
- Maintains existing selection mode functionality for group invitations
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added debug logging to SocialContractPage and GroupJoinPage
- Implemented auto-detection: if invitee name matches existing contact, automatically set as existing member
- Sarah Johnson will now be automatically detected and routed to rCard selection
- Added debugging console logs to track invitation flow
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
FEATURES:
- New GroupJoinPage for existing NAO members to select relationship type (rCard)
- Toggle on invitation page to specify if recipient is existing member
- Automatic routing: existing members → rCard selection, new users → full onboarding
- Privacy-focused UI explaining information sharing based on selected rCard
COMPONENTS:
- GroupJoinPage: Beautiful rCard selection interface with privacy explanations
- Updated InvitationPage: Added "Recipient is already a NAO member" toggle
- Updated SocialContractPage: Routes existing members to GroupJoinPage
- Updated GroupDetailPage: Handles rCard selection data and URL cleanup
FLOW:
New Users: Invitation → Social Contract → Onboarding → Group
Existing Users: Invitation → rCard Selection → Group (with chosen privacy level)
rCard determines information sharing level (Business, Colleague, Friend, etc.)
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Move personalized invitation heading above group avatar and Private Group tag
- Creates better visual flow: purpose first, then supporting visual context
- Added mb: 3 spacing between heading and group info
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Removed redundant "Invite to {group name}" text
- Now shows only group avatar, private chip, and personalized invite heading
- Eliminates duplication like "Invite to Anyville Community Garden" + "Invite Sarah Johnson to Anyville Community Garden"
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added selection mode support to ContactListPage
- Added Select buttons for each contact when in selection mode
- Modified header and UI to show selection context
- Disabled normal contact click behavior in selection mode
- Implemented return navigation with selected contact data
- Fixed invite form button visibility issue with proper spacing
Flow: Group Invite → Select from Network → Contact List → Select Contact → Back to Group Invite (prefilled)
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Created plant logo SVG for Community Garden group
- Fixed AI popup to only appear for new users from invitations
- Added "Select from your network" button to invite form
- Implemented contact selection flow with prefilled data
- Fixed TypeScript build errors (Divider import, unused variable)
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
## New Features
- **Animated Morpho Butterfly**: Vector-based butterfly with realistic wing flapping animation
- **Personalized AI Assistant**: Welcomes users by first name from invitation flow
- **Post-inquiry Action Buttons**: Interactive buttons for network import, security setup, and platform features
- **Enhanced Invitation System**: Complete invite form with relationship type selection
- **Improved Invitation Messages**: First-person language and simplified security guidance
## UI/UX Improvements
- **80% Dialog Size**: AI assistant now uses 80% of viewport for better usability
- **Mobile-Responsive Layout**: Action buttons stack properly on mobile group pages
- **Optimized Input Position**: AI input field moved to bottom for more conversation space
- **Visual Consistency**: White backgrounds with blue borders for group avatars
## Technical Enhancements
- **NAOG1 Group**: Added as first group with custom butterfly logo and governance description
- **Parameter Passing**: Fixed invitation flow to properly pass user first names
- **TypeScript Fixes**: Resolved all build errors across components
- **Component Architecture**: New reusable components for AI rating, invite forms, and group tours
## Files Changed
- Created: AnimatedMorphoButterfly, AIResponseRating, InviteForm, GroupTour components
- Enhanced: GroupDetailPage with full AI assistant integration and mobile layout
- Updated: SocialContractPage, OnboardingPage, InvitationPage with personalized messaging
- Added: NAOG1 group data and custom butterfly logo SVG
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Restore single Import button on ContactListPage that navigates to ImportPage
- Add Gmail as third import option on ImportPage (Contacts, Gmail, LinkedIn)
- Fix TypeScript build errors by resolving import conflicts
- Remove unused variables and clean up component exports
- Ensure all builds pass successfully
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Added comprehensive vouch and praise system to ContactViewPage with side-by-side layout
- Fixed contact image centering issues using background-image approach
- Added vouch/praise indicators to contact list with proper styling
- Implemented My Home and My Collection pages with filter dropdowns
- Added Personhood Credentials component with QR code verification
- Renamed "Privacy & rCards" to "My Cards" and reordered account tabs
- Removed "Default" labels from rCard privacy settings
- Added Gmail import option alongside LinkedIn and Contacts
- Fixed notification dropdown layout issues and text wrapping
- Improved responsive design across contact views
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Fix Grid component API usage for MUI v7 (size object notation)
- Resolve state race condition in rCard deletion logic
- Improve type safety in privacy settings change handlers
- Add form state synchronization for rCard editing
- Enhance form validation with length limits
- Add defensive coding for null/undefined values
- Sync privacy settings when rCard prop changes
- Add proper useEffect dependencies and cleanup
Bug fixes:
- Prevent Grid API mismatches causing runtime errors
- Fix stale state access in rCard deletion
- Resolve potential memory leaks in form components
- Add proper error boundaries and validation
- Improve component prop synchronization
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Add NotificationDropdown component with filtering (all/pending/unread)
- Create NotificationItem component with accept/reject/assign actions
- Implement notification service with mock data for vouches and praise
- Add data types for Notification, Vouch, Praise, and RCard categories
- Include default rCard categories (Business, Colleague, Family, Friend, etc.)
- Add rCard assignment dialog for organizing accepted vouches/praise
- Replace static notification badge with dynamic notification system
- Support real-time notification management with state updates
Features:
- Accept/reject vouches and praise from other users
- Assign accepted items to specific rCard categories
- Mark notifications as read/unread
- Filter by status (pending, unread, all)
- Real-time badge count updates
- Professional notification UI with avatars and status chips
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove unused PostAdd imports from DashboardLayout and BottomNavigation
- Remove unused Avatar, Chip, Groups imports from SocialContractPage
- Remove unused Divider, FolderShared imports from GroupDetailPage
- Build now passes all TypeScript checks
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Major changes:
- Remove Post+ button from desktop left menu and mobile bottom navigation
- Add floating action button to Feed page and Group feed tabs
- Create PostCreateButton component with popup for post type selection
- Add Social Contract page for invite flow with high-trust messaging
- Update Group Detail page with expandable feed and better UX
- Enhance invitation flow with group-specific context
- Update group mock data with appropriate professional logos
Features:
- Post type selector popup (Post, Offer, Want) with color-coded icons
- Context-aware posting (main feed vs group-specific)
- Responsive FAB positioning (avoids mobile bottom nav)
- Social contract for authentic professional networking
- Group-specific invitation experience
- Improved navigation structure
Technical:
- New PostCreateButton component with Material-UI dialog
- Enhanced GroupDetailPage with tabs and post functionality
- Updated routing for social contract in onboarding flow
- Better TypeScript interfaces for group posts and links
- Responsive design considerations for mobile and desktop
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove unused icon imports from DashboardLayout
- Fix build process for Cloudflare Pages deployment
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Reorganized main navigation with cleaner structure
- Updated navigation icons: Feed (RssFeed), Network (Hub), Groups, Post (PostAdd), Chat
- Simplified left menu: removed hierarchical sub-items, added Groups back as main item
- Enhanced Contacts page with Import button and cleaner layout
- Removed unnecessary descriptive text from navigation
- Fixed horizontal overflow in left navigation column
- Updated mobile navigation to match new structure
- Improved navigation item styling with proper text wrapping
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Add proper right margin to selected navigation items to prevent them from overflowing outside the sidebar boundaries.
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
- Remove unused event parameter in BottomNavigation
- Fix AccountPage Grid component usage and remove unused imports
- Replace Grid with Flexbox layout for better compatibility
- All navigation files now pass TypeScript compilation and linting
🤖 Generated with [Claude Code](https://claude.ai/code)
Co-Authored-By: Claude <noreply@anthropic.com>
Christopher Maujean