# 1. Follow/Unfollow the User

### 1. Follow/Unfollow the User

The profile page allows Users to view their own profile information, and the profile information of other Users in the application.  

#### The Follow/Unfollow Button on the Profile Page

When the Current User is viewing someone else's profile, the `Button Follow/Edit Profile` element is shown to the Current User:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbkiZ5OtzlIgDSx12K%2F-LXblkalssQVZ3WF1Q9T%2FButtonFollowInEditorResponsiveBase.png?alt=media\&token=9fde7c25-8a66-4d47-9b07-365e793286b3)

When the `Button Follow/Edit Profile` element is shown, and the Current User isn't yet following the person whose profile they are viewing, the `Button Follow/Edit Profile` element's text will be "Follow":

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbkiZ5OtzlIgDSx12K%2F-LXblpKUKFMJQQD-Xk8P%2FButtonFollowResponsiveTemplate.png?alt=media\&token=45af67d1-dc3b-4276-8426-ea94f8316a95)

When the `Button Follow` element is clicked, the Current User is now following the person whose profile they are viewing. As a result, the button's text conditionally changes from "Follow" to "\[checkmark] Following".   

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXblz6yWw_ieHqznOBC%2F-LXbmXgZ87cTMPY4O4iH%2FFollowingButtonResponsiveBaseTemplate.png?alt=media\&token=38c2072d-ebd2-445d-a5e7-c31bd8d001cc)

When the "\[checkmark] Following" text is hovered, its text will conditionally change to "Unfollow":

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbsb1wCjxeT9eYFaoS%2F-LXbsjTeGP-ibh_avXbs%2FUnfollowButtonResponsiveBase.png?alt=media\&token=c4b1e525-50e2-4ec9-aa84-8d0bf1d0dd9d)

If the "Unfollow" text is clicked, the Current User will no longer be following the person whose profile they are viewing.

#### The Edit Profile Buttons on the Profile Page

When the Current User is viewing their own profile page, the `Button Follow/Edit Profile` element will be visible if the current page width is greater than 725 pixels; the button's text will be "Edit Profile". If the page width is less than or equal to 725 pixels, the `Button Edit Profile (Mobile)` element will be visible instead.

**Editor** 

Desktop:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbv39Rx5I_pLjRkbNe%2FEditProfileProfilePagedesktopResponsiveBase.png?alt=media\&token=0d5a5837-c80e-423f-a0f8-d4e65b6b37fe)

Mobile:

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbv6UjaWgfB2iL8Tmi%2FEditProfileMobileResponsiveBase.png?alt=media\&token=e7a37683-7848-4129-8d5a-a81c84a0742c)

**Preview**

Desktop

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbvAAJrNL4wZUZ1yzr%2FEditProfileButtonPreviewModeResponsiveBase.png?alt=media\&token=b009c1cf-1320-40fb-a7eb-e45501a37e7f)

Mobile

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbuouGg_B7L9fHg01d%2F-LXbvDtlsM6MIz4l-quM%2FEditProfileResponsiveBasePreviewModeMobile.png?alt=media\&token=4ef7b87c-77dc-48a3-b2ce-118d45feab3f)

These buttons' texts are "\[pencil icon] Edit". When clicked, these buttons' workflows navigate the Current User to their account page, in order to edit their profile information.

![](https://1788973256-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-L8uq1TOYNrDiHA5baDk%2F-LXbwCot9JkGpDdSeTni%2F-LXbwypJovAZHbIJGcJu%2Fimage.png?alt=media\&token=9e281235-c461-4900-8874-95c78a7493f5)

{% hint style="info" %}
More information on these workflows can be found in the **B. Follow/Unfollow** workflow folder.
{% endhint %}