The Task Templates page would get stuck in an infinite loading state when any of the required API calls failed. This happened because the page uses Promise.all() to load multiple resources in parallel (inventory, environment, repositories, views, apps), and if any single call failed, the entire loading process would hang.

Root Cause

The Templates page loading logic had no error handling:

// Before - any failure blocks the entire page
[
 this.inventory,
 this.environment, 
 this.repositories,
] = await Promise.all([
 this.loadProjectResources('inventory'),
 this.loadProjectResources('environment'),
 this.loadProjectResources('repositories'),
]);

When users created SSH keys, repositories, and inventories, certain API endpoints might fail due to permissions, network issues, or server errors, causing the page to remain in loading state indefinitely.

Solution

Added comprehensive error handling to ensure the page can render even when some API calls fail:

// After - independent error handling with fallbacks
[
 this.inventory,
 this.environment,
 this.repositories,
] = await Promise.all([
 this.loadProjectResources('inventory').catch((err) => {
 console.error('Failed to load inventory:', err);
 return [];
 }),
 this.loadProjectResources('environment').catch((err) => {
 console.error('Failed to load environment:', err);
 return [];
 }),
 this.loadProjectResources('repositories').catch((err) => {
 console.error('Failed to load repositories:', err);
 return [];
 }),
]);

Changes Made

• Templates.vue: Added error handling to loadData() and loadViews() methods
• ItemListPageBase.js: Added error handling to loadItems() method used by Templates
• AppsMixin.js: Added error handling to apps data loading
• Each failed API call now returns an empty array instead of blocking the page
• Added console error logging to help diagnose API failures

The page will now load successfully with available data even when some resources fail to load, resolving the infinite loading issue.

Fixes #3245.

💬 Share your feedback on Copilot coding agent for the chance to win a 200ドル gift card! Click here to start the survey.