Enhance User Interface and Functionality for Authenticated Users#181

Task 1: Conditional UI for Authenticated Users

The UI now displays a conditional greeting message for authenticated users. It shows "Welcome, [user's name]" dynamically.
The login button is hidden when a user is signed in.
The visibility of sheets is controlled based on the user's authentication status.

Task 2: Dynamic Sheet Creation

Clicking the "Add New" button reveals three input fields for creating a new sheet.
Users can input the necessary data, including sheet name, description, and category.
Upon submission, a new sheet is created and immediately displayed to the user.

Changes Made

Task 1:

Created a ConditionalGreeting component to display the welcome message.
Utilized authentication status to conditionally render the login button and sheets.
Integrated user name dynamically into the welcome message.

Task 2:

Implemented the "Add New" functionality by adding an AddSheetForm component.
Added input fields for sheet name, description, and category.
Created a function to capture user input and send it to the server for sheet creation.
Updated the UI to reflect the addition of a new sheet.

Attached before-and-after screenshots showcasing the changes in the UI.

Before:

Before

After:

After

Testing

Conducted extensive testing of the conditional rendering based on authentication status.
Thoroughly tested the "Add New" functionality to ensure that sheets are created and displayed correctly.
Verified the dynamic nature of the welcome message with different user profiles.

Reviewer Checklist

[x] Code has been reviewed and follows best practices.
[x] Testing has been performed and the functionality works as expected.
[x] Authentication-related changes have been validated to ensure a seamless user experience.
[x] The sheet creation process has been tested and integrates both frontend and backend components.

Additional Notes

The changes made align with the UI improvement request and enhance the user experience for authenticated users. The dynamic nature of the UI ensures that users receive a personalized welcome message and can easily create and access sheets.

Please review and provide feedback on the code and functionality. -Priyam Saha

Algolisted-Org / AlgoListed

Enhance User Interface and Functionality for Authenticated Users#181 #183