feat(mobile): Add share and collaborative list menus to mobile by MohamedBassem · Pull Request #2282 · karakeep-app/karakeep

MohamedBassem · 2025-12-20T11:03:19Z

No description provided.

This commit adds support for share list and collaborative list functionality in the mobile app, bringing feature parity with the web app. Changes: - Updated ListActionsMenu to include "Share" and "Manage Collaborators" options - Created ShareListModal component with: - Public list toggle and shareable URL with copy functionality - RSS feed toggle with token generation and copy functionality - Created ManageCollaboratorsModal component with: - Add collaborators with role selection (viewer/editor) - View current collaborators and owner - Update collaborator roles (owner only) - Remove collaborators (owner only) - Revoke pending invitations (owner only) - Read-only mode for non-owners to view collaborators Both modals follow the existing mobile app patterns using React Native's Modal, Switch components, MenuView for selections, and expo-clipboard for copy functionality. The implementation mirrors the web app features while adapting to the mobile UI/UX patterns.

Changed from React Native native Modal components to expo-router screen modals for better navigation integration and native presentation. Changes: - Created new screen files: - apps/mobile/app/dashboard/lists/[slug]/share.tsx - apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx - Updated dashboard layout to register modal screens with presentation: "modal" - Updated ListActionsMenu to use router.push() instead of modal state - Removed old modal components from apps/mobile/components/lists/ Benefits: - Better integration with native navigation stack - Consistent with existing modal patterns in the app (e.g., manage_tags, manage_lists) - Proper back navigation and deep linking support - Native modal presentation animations

coderabbitai · 2025-12-20T11:03:34Z

Walkthrough

This PR introduces sharing and collaborators management functionality to the mobile dashboard. It adds two new modal screens (Share List and Manage Collaborators), integrates corresponding menu actions into the list actions menu, and implements data fetching, mutations, and UI components for both features with proper error handling and user feedback.

Changes

Cohort / File(s)	Summary
Navigation and layout configuration `apps/mobile/app/dashboard/_layout.tsx`	Adds two new modal screen routes: `lists/[slug]/share` with "Share List" title and `lists/[slug]/manage_collaborators` with "Manage Collaborators" title, both with transparent headers and back button styling.
List actions menu `apps/mobile/app/dashboard/lists/[slug].tsx`	Introduces "Share" action (visible to owners only) and "Manage/View Collaborators" action (title varies by role) to ListActionsMenu with iOS icons and navigation routing to the respective modal screens.
Feature screens `apps/mobile/app/dashboard/lists/[slug]/share.tsx`, `apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx`	Implements two new screen components: ShareListScreen for toggling list visibility, displaying/copying public and RSS URLs, and regenerating/clearing RSS tokens; ManageCollaboratorsScreen for adding collaborators, viewing/modifying roles, revoking invitations, and removing collaborators with loading states, error handling, confirmation dialogs, and role-based access control.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~60 minutes

ManageCollaboratorsScreen complexity: Multiple mutations (addCollaborator, removeCollaborator, updateCollaboratorRole, revokeInvitation) with cache invalidation, conditional rendering based on permissions, and confirmation prompts for destructive actions requiring careful verification.
ShareListScreen logic: Data fetching coordination, RSS token state management, and clipboard operations with proper error boundaries and loading states.
Error handling and state management: Loading spinners, error screens, empty states, and local state synchronization across both screens need thorough testing.
User interactions: Confirm prompts, toast notifications, and role-based UI visibility require validation against design intent.

Possibly related PRs

feat(mobile): proper handling for shared list permissions #2165: Modifies apps/mobile/app/dashboard/lists/[slug].tsx to make ListActionsMenu role-aware and adjust owner-only actions; directly related to the menu changes in this PR.

Pre-merge checks

❌ Failed checks (1 warning, 1 inconclusive)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%.	You can run `@coderabbitai generate docstrings` to improve docstring coverage.
Description check	❓ Inconclusive	No description was provided by the author, making it impossible to evaluate relevance to the changeset.	Add a pull request description explaining the purpose and scope of the changes, including which features are being added.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title accurately describes the main changes: adding share and collaborative list menus to the mobile app.

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 92e352f and 9dfe17e.

📒 Files selected for processing (4)

apps/mobile/app/dashboard/_layout.tsx (1 hunks)
apps/mobile/app/dashboard/lists/[slug].tsx (2 hunks)
apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx (1 hunks)
apps/mobile/app/dashboard/lists/[slug]/share.tsx (1 hunks)

🧰 Additional context used

📓 Path-based instructions (4)

**/*.{ts,tsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use TypeScript for type safety in all source files

Files:

apps/mobile/app/dashboard/lists/[slug].tsx
apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx
apps/mobile/app/dashboard/_layout.tsx
apps/mobile/app/dashboard/lists/[slug]/share.tsx

**/*.{ts,tsx,js,jsx,json,css,md}

📄 CodeRabbit inference engine (AGENTS.md)

Format code using Prettier according to project standards

Files:

apps/mobile/app/dashboard/lists/[slug].tsx
apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx
apps/mobile/app/dashboard/_layout.tsx
apps/mobile/app/dashboard/lists/[slug]/share.tsx

**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (AGENTS.md)

Lint code using oxlint and fix issues with pnpm lint:fix

Files:

apps/mobile/app/dashboard/lists/[slug].tsx
apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx
apps/mobile/app/dashboard/_layout.tsx
apps/mobile/app/dashboard/lists/[slug]/share.tsx

apps/mobile/**/*.{ts,tsx,js,jsx}

📄 CodeRabbit inference engine (AGENTS.md)

Use Expo for developing the mobile application

Files:

apps/mobile/app/dashboard/lists/[slug].tsx
apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx
apps/mobile/app/dashboard/_layout.tsx
apps/mobile/app/dashboard/lists/[slug]/share.tsx

🧬 Code graph analysis (1)

apps/mobile/app/dashboard/lists/[slug]/share.tsx (6)

apps/mobile/lib/useColorScheme.tsx (1)

useColorScheme (46-46)

apps/mobile/lib/settings.ts (1)

useAppSettings (77-81)

packages/shared-react/hooks/lists.ts (1)

useEditBookmarkList (22-37)

packages/trpc/models/lists.ts (2)

regenRssToken (588-591)

clearRssToken (593-596)

apps/mobile/components/FullPageError.tsx (1)

FullPageError (6-26)

apps/mobile/components/ui/CustomSafeAreaView.tsx (1)

CustomSafeAreaView (5-31)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)

GitHub Check: typecheck
GitHub Check: tests

🔇 Additional comments (4)

apps/mobile/app/dashboard/_layout.tsx (1)

112-129: LGTM! Modal routes properly configured.

The new modal routes for sharing and managing collaborators follow the established patterns in the file. The configurations are consistent with other modal screens and properly integrate with the navigation structure.

apps/mobile/app/dashboard/lists/[slug].tsx (1)

102-118: LGTM! Menu actions and navigation properly implemented.

The new menu actions are well-designed with:

Appropriate role-based visibility (share limited to owners)

Adaptive titles based on user role for better UX

Platform-specific icons using SF Symbols

Correct navigation paths matching the route definitions

Also applies to: 140-145

apps/mobile/app/dashboard/lists/[slug]/share.tsx (1)

27-221: LGTM! Well-structured share screen implementation.

The ShareListScreen is comprehensively implemented with:

Proper error and loading state handling

Cache invalidation for all mutations

Good UX with toasts for user feedback

Clean separation between public list and RSS feed functionality

Appropriate disabled states during async operations

Defensive coding with null checks and type guards

The integration with existing shared-react hooks (useEditBookmarkList) maintains consistency across the codebase.

apps/mobile/app/dashboard/lists/[slug]/manage_collaborators.tsx (1)

26-456: LGTM! Excellent implementation of collaborator management.

The ManageCollaboratorsScreen is thoroughly implemented with:

Comprehensive role-based access control (read-only mode for non-owners)

Proper status handling for pending, declined, and accepted collaborators

Thoughtful UX with confirmation dialogs for destructive actions

Clear user feedback through toasts for all operations

Thorough cache invalidation across multiple endpoints (lists, collaborators, bookmarks)

Appropriate loading and error states

Helpful role descriptions and empty states

Good accessibility practices (keyboard types, autocapitalize settings)

Nice touches like haptic feedback on selections

The complex conditional rendering logic for different user roles and collaborator statuses is well-structured and appears correct throughout.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

claude added 2 commits December 19, 2025 12:47

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

feat(mobile): Add share and collaborative list menus to mobile#2282

feat(mobile): Add share and collaborative list menus to mobile#2282
MohamedBassem wants to merge 2 commits intomainfrom
claude/add-mobile-list-menus-spcS7

MohamedBassem commented Dec 20, 2025

Uh oh!

coderabbitai bot commented Dec 20, 2025 •

edited

Loading

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

MohamedBassem commented Dec 20, 2025

Uh oh!

coderabbitai bot commented Dec 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Pre-merge checks

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

coderabbitai bot commented Dec 20, 2025 •

edited

Loading