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/activity-feed.spec.ts

@@ -103,9 +103,11 @@ test.describe('Activity Feed Page', () => {
 
   test('approval actions are visible for pending approvals', async ({ page }) => {
     // Find approval event
-    const approvalEvent = page.locator('[data-testid^="event-item-"]', {
-      has: page.getByText('Action Required'),
-    }).first();
+    const approvalEvent = page
+      .locator('[data-testid^="event-item-"]', {
+        has: page.getByText('Action Required'),
+      })
+      .first();
 
     // Approval buttons should be visible
     await expect(approvalEvent.getByTestId('approve-button')).toBeVisible();