cardosofelipe/fast-next-template
Template
1
0
Fork 1
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source 
- 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.
This commit is contained in:
Felipe Cardoso
2026-01-01 11:46:57 +01:00
parent a7ba0f9bd8
commit a4c91cb8c3
77 changed files with 600 additions and 907 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
frontend/tests/components/projects/ProjectDashboard.test.tsx
View File

@@ -74,7 +74,12 @@ const mockUseProjectEventsDefault = {
events: [] as ProjectEvent[],
isConnected: true,
connectionState: 'connected' as ConnectionState,
error: null as { message: string; timestamp: string; code?: string; retryAttempt?: number } | null,
error: null as {
message: string;
timestamp: string;
code?: string;
retryAttempt?: number;
} | null,
retryCount: 0,
reconnect: mockReconnect,
disconnect: mockDisconnect,
@@ -389,11 +394,7 @@ describe('Event to Activity Conversion', () => {
});
it('handles system actor type', () => {
const event = createMockEvent(
EventType.SPRINT_STARTED,
{ sprint_name: 'Sprint 5' },
'system'
);
const event = createMockEvent(EventType.SPRINT_STARTED, { sprint_name: 'Sprint 5' }, 'system');
mockUseProjectEventsResult.events = [event];
render(<ProjectDashboard projectId="test" />);
expect(screen.getByTestId('mock-recent-activity')).toBeInTheDocument();

46
frontend/tests/components/projects/ProjectHeader.test.tsx
View File

@@ -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);

38
frontend/tests/components/projects/RecentActivity.test.tsx
View File

@@ -65,38 +65,20 @@ describe('RecentActivity', () => {
it('shows View All button when there are more activities than maxItems', () => {
const onViewAll = jest.fn();
render(
<RecentActivity
activities={mockActivities}
maxItems={2}
onViewAll={onViewAll}
/>
);
render(<RecentActivity activities={mockActivities} maxItems={2} onViewAll={onViewAll} />);
expect(screen.getByRole('button', { name: /view all/i })).toBeInTheDocument();
});
it('does not show View All button when all activities are shown', () => {
const onViewAll = jest.fn();
render(
<RecentActivity
activities={mockActivities}
maxItems={5}
onViewAll={onViewAll}
/>
);
render(<RecentActivity activities={mockActivities} maxItems={5} onViewAll={onViewAll} />);
expect(screen.queryByRole('button', { name: /view all/i })).not.toBeInTheDocument();
});
it('calls onViewAll when View All button is clicked', async () => {
const user = userEvent.setup();
const onViewAll = jest.fn();
render(
<RecentActivity
activities={mockActivities}
maxItems={2}
onViewAll={onViewAll}
/>
);
render(<RecentActivity activities={mockActivities} maxItems={2} onViewAll={onViewAll} />);
await user.click(screen.getByRole('button', { name: /view all/i }));
expect(onViewAll).toHaveBeenCalledTimes(1);
@@ -104,24 +86,14 @@ describe('RecentActivity', () => {
it('shows Review Request button for items requiring action', () => {
const onActionClick = jest.fn();
render(
<RecentActivity
activities={mockActivities}
onActionClick={onActionClick}
/>
);
render(<RecentActivity activities={mockActivities} onActionClick={onActionClick} />);
expect(screen.getByRole('button', { name: /review request/i })).toBeInTheDocument();
});
it('calls onActionClick when Review Request button is clicked', async () => {
const user = userEvent.setup();
const onActionClick = jest.fn();
render(
<RecentActivity
activities={mockActivities}
onActionClick={onActionClick}
/>
);
render(<RecentActivity activities={mockActivities} onActionClick={onActionClick} />);
await user.click(screen.getByRole('button', { name: /review request/i }));
expect(onActionClick).toHaveBeenCalledWith('act-003');

8
frontend/tests/components/projects/StatusBadge.test.tsx
View File

@@ -23,9 +23,7 @@ describe('ProjectStatusBadge', () => {
});
it('applies custom className', () => {
const { container } = render(
<ProjectStatusBadge status="active" className="custom-class" />
);
const { container } = render(<ProjectStatusBadge status="active" className="custom-class" />);
expect(container.firstChild).toHaveClass('custom-class');
});
});
@@ -54,9 +52,7 @@ describe('AutonomyBadge', () => {
});
it('applies custom className', () => {
const { container } = render(
<AutonomyBadge level="milestone" className="custom-class" />
);
const { container } = render(<AutonomyBadge level="milestone" className="custom-class" />);
expect(container.firstChild).toHaveClass('custom-class');
});
});

4
frontend/tests/components/projects/wizard/ProjectWizard.test.tsx
View File

@@ -264,7 +264,9 @@ describe('ProjectWizard', () => {
await user.click(screen.getByRole('button', { name: /create project/i }));
await waitFor(() => {
expect(screen.getByRole('button', { name: /go to project dashboard/i })).toBeInTheDocument();
expect(
screen.getByRole('button', { name: /go to project dashboard/i })
).toBeInTheDocument();
});
await user.click(screen.getByRole('button', { name: /go to project dashboard/i }));

18
frontend/tests/components/projects/wizard/steps/AutonomyStep.test.tsx
View File

@@ -60,7 +60,9 @@ describe('AutonomyStep', () => {
it('has accessible radiogroup role', () => {
render(<AutonomyStep state={defaultState} updateState={mockUpdateState} />);
expect(screen.getByRole('radiogroup', { name: /autonomy level options/i })).toBeInTheDocument();
expect(
screen.getByRole('radiogroup', { name: /autonomy level options/i })
).toBeInTheDocument();
});
});
@@ -69,7 +71,9 @@ describe('AutonomyStep', () => {
const user = userEvent.setup();
render(<AutonomyStep state={defaultState} updateState={mockUpdateState} />);
const fullControlOption = screen.getByRole('button', { name: /full control.*review every action/i });
const fullControlOption = screen.getByRole('button', {
name: /full control.*review every action/i,
});
await user.click(fullControlOption);
expect(mockUpdateState).toHaveBeenCalledWith({ autonomyLevel: 'full_control' });
@@ -89,7 +93,9 @@ describe('AutonomyStep', () => {
const user = userEvent.setup();
render(<AutonomyStep state={defaultState} updateState={mockUpdateState} />);
const autonomousOption = screen.getByRole('button', { name: /autonomous.*only major decisions/i });
const autonomousOption = screen.getByRole('button', {
name: /autonomous.*only major decisions/i,
});
await user.click(autonomousOption);
expect(mockUpdateState).toHaveBeenCalledWith({ autonomyLevel: 'autonomous' });
@@ -180,7 +186,7 @@ describe('AutonomyStep', () => {
autonomyOptions.forEach((option) => {
const button = screen.getByRole('button', {
name: new RegExp(`${option.label}.*${option.description}`, 'i')
name: new RegExp(`${option.label}.*${option.description}`, 'i'),
});
expect(button).toBeInTheDocument();
});
@@ -207,7 +213,9 @@ describe('AutonomyStep', () => {
};
render(<AutonomyStep state={stateWithFullControl} updateState={mockUpdateState} />);
const autonomousOption = screen.getByRole('button', { name: /autonomous.*only major decisions/i });
const autonomousOption = screen.getByRole('button', {
name: /autonomous.*only major decisions/i,
});
await user.click(autonomousOption);
expect(mockUpdateState).toHaveBeenCalledWith({ autonomyLevel: 'autonomous' });

14
frontend/tests/components/projects/wizard/steps/ClientModeStep.test.tsx
View File

@@ -59,7 +59,9 @@ describe('ClientModeStep', () => {
it('has accessible radiogroup role', () => {
render(<ClientModeStep state={defaultState} updateState={mockUpdateState} />);
expect(screen.getByRole('radiogroup', { name: /client interaction mode options/i })).toBeInTheDocument();
expect(
screen.getByRole('radiogroup', { name: /client interaction mode options/i })
).toBeInTheDocument();
});
});
@@ -76,7 +78,9 @@ describe('ClientModeStep', () => {
const user = userEvent.setup();
render(<ClientModeStep state={defaultState} updateState={mockUpdateState} />);
const technicalOption = screen.getByRole('button', { name: /technical mode.*detailed technical/i });
const technicalOption = screen.getByRole('button', {
name: /technical mode.*detailed technical/i,
});
await user.click(technicalOption);
expect(mockUpdateState).toHaveBeenCalledWith({ clientMode: 'technical' });
@@ -123,7 +127,7 @@ describe('ClientModeStep', () => {
clientModeOptions.forEach((option) => {
const button = screen.getByRole('button', {
name: new RegExp(`${option.label}.*${option.description}`, 'i')
name: new RegExp(`${option.label}.*${option.description}`, 'i'),
});
expect(button).toBeInTheDocument();
});
@@ -168,7 +172,9 @@ describe('ClientModeStep', () => {
};
render(<ClientModeStep state={stateWithTechnical} updateState={mockUpdateState} />);
const technicalOption = screen.getByRole('button', { name: /technical mode.*detailed technical/i });
const technicalOption = screen.getByRole('button', {
name: /technical mode.*detailed technical/i,
});
await user.click(technicalOption);
// Should still call updateState

6
frontend/tests/components/projects/wizard/steps/ComplexityStep.test.tsx
View File

@@ -65,7 +65,9 @@ describe('ComplexityStep', () => {
it('has accessible radiogroup role', () => {
render(<ComplexityStep state={defaultState} updateState={mockUpdateState} />);
expect(screen.getByRole('radiogroup', { name: /project complexity options/i })).toBeInTheDocument();
expect(
screen.getByRole('radiogroup', { name: /project complexity options/i })
).toBeInTheDocument();
});
});
@@ -164,7 +166,7 @@ describe('ComplexityStep', () => {
complexityOptions.forEach((option) => {
const button = screen.getByRole('button', {
name: new RegExp(`${option.label}.*${option.description}`, 'i')
name: new RegExp(`${option.label}.*${option.description}`, 'i'),
});
expect(button).toBeInTheDocument();
});