Feat/profile/edit profile screen UI and tests #108

Harrish92 · 2024-10-31T15:37:03Z

Title

Description

This PR introduces the UI for EditProfileScreen, adds the option to change the profile image, and implements validation logic for the fields. It also includes tests for these functionalities. It closes issue #88.

Changes

Created the UI for EditProfileScreen.
Added the option to change the profile image when the add_circle_icon is clicked.
Implemented validation logic to check if the name, date of birth, and description fields are filled.
Added tests to verify the UI element.

Files

Added

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileScreenTest.kt

Modified

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

Removed

None

Dependencies Added

None

Testing

Verified that the UI elements on the EditProfileScreen are correctly displayed.
Ensured that all tests for the EditProfileScreen pass successfully.

Screenshots (if applicable)

Implement EditProfileScreen UI and tests #89

- Center GlideImage horizontally in EditProfileScreen - Adjust padding and layout for better UI alignment - Update text styles and field arrangements - Add rounded corners and borders to input fields - Ensure Save Changes button is centered and styled

…file/editProfileScreen-ui-and-tests

- Extract ProfileImage composable - Extract ProfileTextField composable - Extract ProfileSection composable - Add comments for better code understanding - Maintain existing UI layout and design

- Added UI tests for `EditProfileScreen` to verify UI elements and interactions. - Implemented field validation to check if name, date of birth, and description fields are filled.

…file/editProfileScreen-ui-and-tests

francelu

Summary

Good initial implementation of the EditProfileScreen. Improvements are needed for consistency and better alignment with the Figma design.

Important

Code Quality

Enhance code consistency as noted in the comments.

Functionality

Ensure the UI matches the Figma specifications more closely. Check other screens' code for consistency and inspiration.

Testing

Review the existing tests to confirm they cover the updated UI and logic. Check other screens' tests for consistency, completeness, and inspiration.

Suggestions

Address the changes highlighted in the code and file comments.

Steps before PR approved

Implement the changes detailed in the code and file comments to ensure consistency and Figma alignment.

app/src/main/res/values-night/themes.xml

app/src/main/res/values/themes.xml

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

charliemangano · 2024-11-02T15:29:44Z

Hi @Harrish92! I just merged a PR (#102) that refactors every testTag in a separate file for better maintainability. Can you take a look at how it's done and apply it to your code?

…file/editProfileScreen-ui-and-tests

- Revamped the tests for EditProfile to ensure better coverage and adherence to the testTag convention. - Improved the layout for better user experience and visual consistency. - Added a new component to the UI for enhanced functionality.

…file/editProfileScreen-ui-and-tests

francelu

PR Review: `EditProfileScreen` UI Implementation

Summary:

Overall, great work on implementing the EditProfileScreen UI. The screen aligns well with the provided Figma designs and showcases attention to detail.

Review Notes:

A few minor issues need addressing before approval.
Refer to in-line code comments for specific suggestions and corrections.

Requested Changes:

Address code consistency and formatting issues.
Review and implement small optimizations as highlighted in the code comments.

Approval Status:

Pending – please make the suggested adjustments.

Good job so far! Let me know if you need further clarification on any points.

app/src/main/res/values-night/themes.xml

app/src/main/res/values/themes.xml

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

app/src/main/java/com/android/periodpals/resources/C.kt

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

…pdate description input field - Added tags for sectors to improve testability and organization. - Refactored tests for better adherence to conventions. - Changed the profile icon for a suitable look. - Updated the description input field to be more explicit.

francelu · 2024-11-05T11:31:50Z

@Harrish92
Hey, I've just noticed you answered to one of my in-line comments. Please check my proposition here :)

~~I also noticed your code coverage on the new code is 78.2%. Could you try to make it above 80% ? Tell ChatGPT to have at least 80% coverage, maybe it'll help :)~~
Never mind, line coverage is >90%. All good !

…file/editProfileScreen-ui-and-tests

francelu

A few nitpicks to correct before PR approved for merge. We're almost there !! :)))

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

app/src/main/java/com/android/periodpals/resources/C.kt

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

app/src/main/java/com/android/periodpals/resources/C.kt

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

- Renamed test functions from saveValid... and saveInvalid... to editValid... and editInvalid... to better reflect their purpose. - Removed unnecessary toggled comments for cleaner code. - Ensured no extra spaces after test function declarations for better readability. - Reordered lines in the same order as the testTags. - Simplified validation logic for email.

francelu

PR Review

Summary

Overall, a strong effort. The code mostly adheres to the standards and the Figma design, and the intended functionality is clear.

Important

Code Quality

The code is generally readable and consistent. However, there are a few areas where the naming conventions and spacing can be improved to better align with project guidelines.

Functionality

The feature works as expected, handling most scenarios effectively.

Testing

UI tests appear thorough and well-implemented.

Documentation

No changes are needed to external documentation.

Suggestions

Consider implementing the suggested naming convention changes for better readability and consistency.

Steps before PR Merge

Address the code naming changes as mentioned in the comments.

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

app/src/androidTest/java/com/android/periodpals/ui/profile/EditProfileTest.kt

taghizadlaura

Summary

They are only small adjustments to fit the figma (please see comments).

Important

Code Quality

LGTM

Functionality

LGTM

Testing

LGTM please check when you change the code that it doesn't affect the tests.

Documentation

LGTM. There's a lot of comments which strongly contribute to the understanding of the code.

Steps before PR approved

Please read the comments to fit more to the figma

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

app/src/main/java/com/android/periodpals/resources/C.kt

app/src/main/java/com/android/periodpals/ui/components/ProfileComponents.kt

- Set `fillMaxWidth` to name, email, and dob for `OutlineFieldText`. - Removed the background color for the save button. - Removed the `HorizontalDivider`. - Resized profile image profile to 190.dp. - Renamed button to "Save".

taghizadlaura

Please also remove the color of the button.

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt

sonarqubecloud · 2024-11-07T15:57:43Z

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
77.8% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarCloud

taghizadlaura

LGTM now :)

Harrish92 added 6 commits October 30, 2024 22:38

Merge branch 'main' of github.com:PeriodPals/periodpals into feat/pro…

d1afd7b

…file/editProfileScreen-ui-and-tests

fix: modularize EditProfileScreen without changing UI

aa7ae4f

- Extract ProfileImage composable - Extract ProfileTextField composable - Extract ProfileSection composable - Add comments for better code understanding - Maintain existing UI layout and design

feat: add UI tests for EditProfileScreen and validate fields

d61be6e

- Added UI tests for `EditProfileScreen` to verify UI elements and interactions. - Implemented field validation to check if name, date of birth, and description fields are filled.

Merge branch 'main' of github.com:PeriodPals/periodpals into feat/pro…

250ff12

…file/editProfileScreen-ui-and-tests

feat: implement image change on icon click

72ce683

Harrish92 linked an issue Oct 31, 2024 that may be closed by this pull request

Implement EditProfileScreen UI and tests #89

Closed

Harrish92 requested review from taghizadlaura and francelu October 31, 2024 15:37

Merge branch 'main' into feat/profile/editProfileScreen-ui-and-tests

7ba8628

taghizadlaura assigned taghizadlaura and Harrish92 and unassigned taghizadlaura Oct 31, 2024

francelu requested changes Nov 1, 2024

View reviewed changes

charliemangano added the enhancement New feature or request label Nov 2, 2024

francelu mentioned this pull request Nov 3, 2024

Test edit profile is (not) displayed #126

Closed

12 tasks

Harrish92 added 3 commits November 3, 2024 19:16

Merge branch 'main' of github.com:PeriodPals/periodpals into feat/pro…

69490a9

…file/editProfileScreen-ui-and-tests

Merge branch 'main' of github.com:PeriodPals/periodpals into feat/pro…

7837bdf

…file/editProfileScreen-ui-and-tests

Harrish92 requested a review from francelu November 4, 2024 18:16

fix: set the correct content for main

325ad76

francelu requested changes Nov 4, 2024

View reviewed changes

Harrish92 requested a review from francelu November 5, 2024 10:17

fix: correct EditProfile to pass tests

58f02bc

Merge branch 'main' of github.com:PeriodPals/periodpals into feat/pro…

8a91386

…file/editProfileScreen-ui-and-tests

francelu requested changes Nov 5, 2024

View reviewed changes

Harrish92 requested a review from francelu November 5, 2024 22:01

francelu approved these changes Nov 6, 2024

View reviewed changes

fix: change function names for editProfileTest

c9702af

taghizadlaura requested changes Nov 7, 2024

View reviewed changes

fix: update UI elements in EditProfileScreen

a06a3c4

- Set `fillMaxWidth` to name, email, and dob for `OutlineFieldText`. - Removed the background color for the save button. - Removed the `HorizontalDivider`. - Resized profile image profile to 190.dp. - Renamed button to "Save".

Harrish92 requested a review from taghizadlaura November 7, 2024 13:10

taghizadlaura requested changes Nov 7, 2024

View reviewed changes

app/src/main/java/com/android/periodpals/ui/profile/EditProfile.kt Outdated Show resolved Hide resolved

fix: remove color assigned to button

c17d229

Harrish92 requested a review from taghizadlaura November 7, 2024 16:00

taghizadlaura approved these changes Nov 7, 2024

View reviewed changes

Harrish92 merged commit 8f7b780 into main Nov 7, 2024
3 checks passed

Harrish92 deleted the feat/profile/editProfileScreen-ui-and-tests branch November 7, 2024 16:11

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Feat/profile/edit profile screen UI and tests #108

Feat/profile/edit profile screen UI and tests #108

Harrish92 commented Oct 31, 2024

francelu left a comment

charliemangano commented Nov 2, 2024

francelu left a comment

francelu commented Nov 5, 2024 •

edited

Loading

francelu left a comment

francelu left a comment

taghizadlaura left a comment

taghizadlaura left a comment

sonarqubecloud bot commented Nov 7, 2024

taghizadlaura left a comment

Feat/profile/edit profile screen UI and tests #108

Feat/profile/edit profile screen UI and tests #108

Conversation

Harrish92 commented Oct 31, 2024

Title

Description

Changes

Files

Added

Modified

Removed

Dependencies Added

Testing

Screenshots (if applicable)

francelu left a comment

Choose a reason for hiding this comment

Summary

Important

Code Quality

Functionality

Testing

Suggestions

Steps before PR approved

charliemangano commented Nov 2, 2024

francelu left a comment

Choose a reason for hiding this comment

PR Review: EditProfileScreen UI Implementation

Summary:

Review Notes:

Requested Changes:

Approval Status:

francelu commented Nov 5, 2024 • edited Loading

francelu left a comment

Choose a reason for hiding this comment

francelu left a comment

Choose a reason for hiding this comment

PR Review

Summary

Important

Code Quality

Functionality

Testing

Documentation

Suggestions

Steps before PR Merge

taghizadlaura left a comment

Choose a reason for hiding this comment

Summary

Important

Code Quality

Functionality

Testing

Documentation

Steps before PR approved

taghizadlaura left a comment

Choose a reason for hiding this comment

sonarqubecloud bot commented Nov 7, 2024

Quality Gate passed

taghizadlaura left a comment

Choose a reason for hiding this comment

PR Review: `EditProfileScreen` UI Implementation

francelu commented Nov 5, 2024 •

edited

Loading