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/components/projects/ProjectHeader.test.tsx

@@ -46,13 +46,7 @@ describe('ProjectHeader', () => {
 
   it('shows pause button when canPause is true and project is active', () => {
     const onPauseProject = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        canPause={true}
-        onPauseProject={onPauseProject}
-      />
-    );
+    render(<ProjectHeader project={mockProject} canPause={true} onPauseProject={onPauseProject} />);
     expect(screen.getByRole('button', { name: /pause project/i })).toBeInTheDocument();
   });
 
@@ -64,13 +58,7 @@ describe('ProjectHeader', () => {
 
   it('shows run sprint button when canStart is true', () => {
     const onStartSprint = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        canStart={true}
-        onStartSprint={onStartSprint}
-      />
-    );
+    render(<ProjectHeader project={mockProject} canStart={true} onStartSprint={onStartSprint} />);
     expect(screen.getByRole('button', { name: /run sprint/i })).toBeInTheDocument();
   });
 
@@ -83,13 +71,7 @@ describe('ProjectHeader', () => {
   it('calls onStartSprint when run sprint button is clicked', async () => {
     const user = userEvent.setup();
     const onStartSprint = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        canStart={true}
-        onStartSprint={onStartSprint}
-      />
-    );
+    render(<ProjectHeader project={mockProject} canStart={true} onStartSprint={onStartSprint} />);
 
     await user.click(screen.getByRole('button', { name: /run sprint/i }));
     expect(onStartSprint).toHaveBeenCalledTimes(1);
@@ -98,13 +80,7 @@ describe('ProjectHeader', () => {
   it('calls onPauseProject when pause button is clicked', async () => {
     const user = userEvent.setup();
     const onPauseProject = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        canPause={true}
-        onPauseProject={onPauseProject}
-      />
-    );
+    render(<ProjectHeader project={mockProject} canPause={true} onPauseProject={onPauseProject} />);
 
     await user.click(screen.getByRole('button', { name: /pause project/i }));
     expect(onPauseProject).toHaveBeenCalledTimes(1);
@@ -113,12 +89,7 @@ describe('ProjectHeader', () => {
   it('calls onCreateSprint when new sprint button is clicked', async () => {
     const user = userEvent.setup();
     const onCreateSprint = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        onCreateSprint={onCreateSprint}
-      />
-    );
+    render(<ProjectHeader project={mockProject} onCreateSprint={onCreateSprint} />);
 
     await user.click(screen.getByRole('button', { name: /new sprint/i }));
     expect(onCreateSprint).toHaveBeenCalledTimes(1);
@@ -127,12 +98,7 @@ describe('ProjectHeader', () => {
   it('calls onSettings when settings button is clicked', async () => {
     const user = userEvent.setup();
     const onSettings = jest.fn();
-    render(
-      <ProjectHeader
-        project={mockProject}
-        onSettings={onSettings}
-      />
-    );
+    render(<ProjectHeader project={mockProject} onSettings={onSettings} />);
 
     await user.click(screen.getByRole('button', { name: /project settings/i }));
     expect(onSettings).toHaveBeenCalledTimes(1);