refactor: consolidate project loading into EntityGrid component

Unify project loading and searching logic in EntityGrid.vue to eliminate
duplication. Make entities prop optional for projects, add internal
project state, and auto-load projects when needed.

- EntityGrid: Combine search/load into fetchProjects(), add internal
  allProjects state, handle pagination internally for both search and
  load modes
- OnboardMeetingSetupView: Remove project loading methods
- MeetingProjectDialog: Remove project props
- GiftedDialog: Remove project loading logic
- EntitySelectionStep: Make projects prop optional

Reduces code duplication by ~150 lines and simplifies component APIs.
All project selection now uses EntityGrid's internal loading.
This commit is contained in:
Jose Olarte III
2025-11-17 19:49:17 +08:00
parent acf104eaa7
commit cb75b25529
5 changed files with 265 additions and 266 deletions

View File

@@ -269,12 +269,10 @@
<MeetingProjectDialog
ref="meetingProjectDialog"
:all-projects="allProjects"
:active-did="activeDid"
:all-my-dids="allMyDids"
:all-contacts="allContacts"
:notify="$notify"
:load-more-callback="handleLoadMoreProjects"
@assign="handleProjectLinkAssigned"
@open="handleDialogOpen"
@close="handleDialogClose"
@@ -418,7 +416,6 @@ export default class OnboardMeetingView extends Vue {
isRegistered = false;
showDeleteConfirm = false;
fullName = "";
allProjects: PlanData[] = [];
allContacts: Contact[] = [];
allMyDids: string[] = [];
selectedProjectData: PlanData | null = null;
@@ -847,82 +844,6 @@ export default class OnboardMeetingView extends Vue {
}
}
/**
* Load projects from the API
* @param beforeId - Optional rowId for pagination (loads projects before this ID)
*/
async loadProjects(beforeId?: string) {
try {
const headers = await getHeaders(this.activeDid);
let url = `${this.apiServer}/api/v2/report/plans`;
if (beforeId) {
url += `?beforeId=${encodeURIComponent(beforeId)}`;
}
const resp = await this.axios.get(url, { headers });
if (resp.status === 200 && resp.data.data) {
const newProjects = resp.data.data.map(
(plan: {
name: string;
description: string;
image?: string;
handleId: string;
issuerDid: string;
rowId?: string;
}) => ({
name: plan.name,
description: plan.description,
image: plan.image,
handleId: plan.handleId,
issuerDid: plan.issuerDid,
rowId: plan.rowId,
}),
);
if (beforeId) {
// Pagination: append new projects
this.allProjects.push(...newProjects);
} else {
// Initial load: replace array
this.allProjects = newProjects;
}
}
} catch (error) {
this.$logAndConsole(
"Error loading projects: " + errorStringForLog(error),
true,
);
// Don't show error to user - just leave projects empty (or keep existing if pagination)
if (!beforeId) {
this.allProjects = [];
}
}
}
/**
* Handle loading more projects when EntityGrid reaches the end
* Called by MeetingProjectDialog via loadMoreCallback
* @param entities - Current array of projects
*/
async handleLoadMoreProjects(
entities: Array<{
handleId: string;
rowId?: string;
}>,
): Promise<void> {
if (entities.length === 0) {
return;
}
const lastProject = entities[entities.length - 1];
if (!lastProject.rowId) {
// No rowId means we can't paginate - likely end of data
return;
}
await this.loadProjects(lastProject.rowId);
}
/**
* Computed property for selected project
* Returns the separately stored selected project data
@@ -977,18 +898,13 @@ export default class OnboardMeetingView extends Vue {
}
/**
* Handle dialog open event - stop auto-refresh in MembersList and load projects
* Handle dialog open event - stop auto-refresh in MembersList
*/
async handleDialogOpen(): Promise<void> {
handleDialogOpen(): void {
const membersList = this.$refs.membersList as MembersList;
if (membersList) {
membersList.stopAutoRefresh();
}
// Load projects when dialog opens (if not already loaded)
if (this.allProjects.length === 0) {
await this.loadProjects();
}
}
/**