Fix people tab loading in organization profiles#2693
Conversation
WalkthroughThe changes in the Changes
Possibly related PRs
Suggested reviewers
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Outside diff range and nitpick comments (2)
frontend/src/modules/organization/components/details/organization-details-contributors.vue (2)
309-309: Consider sequential data fetching and error coordinationWhile adding
fetch()inonMountedis correct, consider these improvements:
- Make the calls sequential to avoid potential race conditions
- Coordinate error handling between both API calls
-onMounted(() => { - doGetMembersCount(); - fetch(); -}); +onMounted(async () => { + try { + await doGetMembersCount(); + await fetch(); + } catch (error) { + // Handle errors consistently + } +});
309-309: Consider architectural improvements for better maintainabilityThe component currently handles both data fetching and presentation. Consider these architectural improvements:
- Extract data fetching logic into a dedicated composable (e.g.,
useOrganizationContributors)- Implement centralized error handling
- Unify loading state management between member count and contributor fetching
This would improve maintainability, reusability, and testing.
Example structure:
// useOrganizationContributors.ts export function useOrganizationContributors(organizationId: string) { const loading = ref(false); const error = ref<Error | null>(null); const contributors = ref<Member[]>([]); const totalCount = ref(0); const fetchData = async () => { loading.value = true; error.value = null; try { const [countData, contributorsData] = await Promise.all([ fetchMemberCount(organizationId), fetchMembers(organizationId) ]); totalCount.value = countData.count; contributors.value = contributorsData.rows; } catch (err) { error.value = err; contributors.value = []; totalCount.value = 0; } finally { loading.value = false; } }; return { loading, error, contributors, totalCount, fetchData }; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
📒 Files selected for processing (1)
frontend/src/modules/organization/components/details/organization-details-contributors.vue(1 hunks)
🔇 Additional comments (1)
frontend/src/modules/organization/components/details/organization-details-contributors.vue (1)
309-309: Verify loading behavior across different scenarios
While the changes address the people tab loading issues, please verify the loading behavior in these scenarios:
- Initial load
- Filter changes
- Sort changes
- Error recovery
- Network issues
1 participant
Changes proposed ✍️
What
copilot:summary
copilot:poem
Why
How
copilot:walkthrough
Checklist ✅
Feature,Improvement, orBug.Summary by CodeRabbit
New Features
Bug Fixes
Improvements