refactor(frontend): clean up code by consolidating multi-line JSX into single lines where feasible

- Refactored JSX elements to improve readability by collapsing multi-line props and attributes into single lines if their length permits.
- Improved consistency in component imports by grouping and consolidating them.
- No functional changes, purely restructuring for clarity and maintainability.

frontend/e2e/project-dashboard.spec.ts

@@ -33,7 +33,9 @@ test.describe('Project Dashboard Page', () => {
     await expect(page.getByTestId('project-header')).toBeVisible();
 
     // Check project name
-    await expect(page.getByRole('heading', { level: 1 })).toContainText('E-Commerce Platform Redesign');
+    await expect(page.getByRole('heading', { level: 1 })).toContainText(
+      'E-Commerce Platform Redesign'
+    );
 
     // Check status badges
     await expect(page.getByText('In Progress')).toBeVisible();
@@ -288,7 +290,9 @@ test.describe('Project Dashboard Activity Feed', () => {
     await page.waitForLoadState('networkidle');
 
     // Look for action buttons in activity feed (if any require action)
-    const reviewButton = page.getByTestId('recent-activity').getByRole('button', { name: /review/i });
+    const reviewButton = page
+      .getByTestId('recent-activity')
+      .getByRole('button', { name: /review/i });
     const count = await reviewButton.count();
 
     // Either there are action items or not - both are valid