The JobAgentPage.tsx interface currently suffers from two major UI/UX regressions that impact usability:
Broken Mouse Scrolling in Textarea: When the user inputs long, multi-line paragraphs, the textarea hits its maxHeight limit (200px) and the inline style overflow: "hidden" completely suppresses native mouse wheel scroll events. Users are currently forced to navigate the text solely via keyboard arrow keys, which is a significant accessibility barrier.
Non-Sticky Chat Footer (Layout Spill): The chat footer (containing the Send button and "powered by" labels) is not pinned to the bottom of the viewable screen. As the chat grows, the footer section spills outside the viewport, forcing the user to scroll the entire outer page container to access the input controls. This breaks the standard AI-chat pattern where the input controls should remain fixed at the bottom.
Proposed Solution:
I propose a comprehensive refactor of the input layout in JobAgentPage.tsx:
Textarea Fix: Remove overflow: "hidden" from inline styles and apply overflow-y-auto as a Tailwind class to enable native browser scrolling once the height ceiling is reached.
Sticky Layout Fix: Re-structure the outer flex container. The chat message area should be set to flex-1 with overflow-y-auto, and the input container should be removed from the main scroll flow, allowing it to stay pinned to the bottom of the viewport (h-[calc(100vh-4rem)] distribution).
@Sachinchaurasiya360 Plz assign me this under gssoc26
Broken Mouse Scrolling in Textarea: When the user inputs long, multi-line paragraphs, the textarea hits its maxHeight limit (200px) and the inline style overflow: "hidden" completely suppresses native mouse wheel scroll events. Users are currently forced to navigate the text solely via keyboard arrow keys, which is a significant accessibility barrier.
Non-Sticky Chat Footer (Layout Spill): The chat footer (containing the Send button and "powered by" labels) is not pinned to the bottom of the viewable screen. As the chat grows, the footer section spills outside the viewport, forcing the user to scroll the entire outer page container to access the input controls. This breaks the standard AI-chat pattern where the input controls should remain fixed at the bottom.
Proposed Solution:
I propose a comprehensive refactor of the input layout in JobAgentPage.tsx:
Textarea Fix: Remove overflow: "hidden" from inline styles and apply overflow-y-auto as a Tailwind class to enable native browser scrolling once the height ceiling is reached.
Sticky Layout Fix: Re-structure the outer flex container. The chat message area should be set to flex-1 with overflow-y-auto, and the input container should be removed from the main scroll flow, allowing it to stay pinned to the bottom of the viewport (h-[calc(100vh-4rem)] distribution).
@Sachinchaurasiya360 Plz assign me this under gssoc26