How do I approach Other / Miscellaneous interview questions?

Other / Miscellaneous questions require understanding of core concepts and practice. PracHub provides solutions with explanations to help you master other / miscellaneous interviews.

What difficulty level is this interview question?

This is a medium difficulty Other / Miscellaneous question, commonly asked during HR Screen rounds at Akuna Capital.

What role is this question designed for?

This question is commonly asked for Software Engineer candidates at Akuna Capital during technical interviews.

Implement React check-in/out month dropdowns | Akuna Capital Interview Question

Quick Overview

This question evaluates front-end React skills including controlled components, state synchronization, interdependent input validation, keyboard accessibility/ARIA, and unit testing for UI behavior, and it sits in the Front-end/UI development domain (Other/Miscellaneous) with an emphasis on practical implementation rather than purely conceptual reasoning. It is commonly asked because interviewers use it to verify an engineer's ability to enforce input constraints, integrate dropdowns with existing form state and submission flows, maintain accessibility with native controls, and provide test coverage for validation and disabled-option behavior.

React UI Enhancement: Check-in/Check-out Month Dropdowns

Context

You are working on a hotel reservation form in a React codebase. The form needs two new, controlled dropdowns for selecting months: one for Check-in and one for Check-out. The selections must respect constraints based on the current month and each other. Assume the form already has state management and an onSubmit handler; you will integrate with it via controlled props/callbacks or context.

Requirements

Render two month dropdowns (January–December) integrated with the existing form.
Enforce that the selected Check-out month is not earlier than the Check-in month; disable invalid options accordingly.
Disable months earlier than the current month for both dropdowns.
Keep components controlled and synchronize selections with the provided state management (props/callbacks or context) so the booking form receives updates.
Validate on change and on submit; block submission and show inline errors if constraints are violated.
Ensure keyboard accessibility and proper ARIA labels.
Add unit tests covering state updates, disabled options, and validation behavior.

Notes/Assumptions:

Months are for the current year only. Without year selection, the constraint is month-based only (e.g., September ≥ August). If you later add years, update the comparison accordingly.
Use native HTML select elements for built-in keyboard accessibility.

Quick Overview

Context

Requirements

Render two month dropdowns (January–December) integrated with the existing form.

Enforce that the selected Check-out month is not earlier than the Check-in month; disable invalid options accordingly.

Disable months earlier than the current month for both dropdowns.

Keep components controlled and synchronize selections with the provided state management (props/callbacks or context) so the booking form receives updates.

Validate on change and on submit; block submission and show inline errors if constraints are violated.

Ensure keyboard accessibility and proper ARIA labels.

Add unit tests covering state updates, disabled options, and validation behavior.

Notes/Assumptions:

Months are for the current year only. Without year selection, the constraint is month-based only (e.g., September ≥ August). If you later add years, update the comparison accordingly.

Use native HTML select elements for built-in keyboard accessibility.

Implement React check-in/out month dropdowns

Quick Overview

React UI Enhancement: Check-in/Check-out Month Dropdowns

Context

Requirements

Solution

Comments (0)

Implement React check-in/out month dropdowns

Quick Overview

React UI Enhancement: Check-in/Check-out Month Dropdowns

Context

Requirements

Solution

Comments (0)