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/tests/lib/hooks/useProjectEvents.test.ts

@@ -119,9 +119,7 @@ describe('useProjectEvents', () => {
 
   describe('initialization', () => {
     it('should start disconnected', () => {
-      const { result } = renderHook(() =>
-        useProjectEvents('project-123', { autoConnect: false })
-      );
+      const { result } = renderHook(() => useProjectEvents('project-123', { autoConnect: false }));
 
       expect(result.current.connectionState).toBe('disconnected');
       expect(result.current.isConnected).toBe(false);