# User Portal

The application is constructed as a Progressive Web App (PWA), allowing users to access all services from a single page. Upon logging into the application, they will be directed to the portal, as shown in the image below.

<figure><img src="https://3191699702-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fv3yKz4qukHpmpz1mhh8P%2Fuploads%2FUJxfNwFf3rMuqUCZLGne%2FScreenshot%202023-12-20%20at%2022.38.04.png?alt=media&#x26;token=70331e03-2c1f-4c20-956f-4a879e7baca3" alt=""><figcaption><p>User's Dashboard View</p></figcaption></figure>

This is the view users encounter when they are logged in and have an active plan (whether it's a trial or a paid one). Now, let's delve into each component displayed on the screen.

### Header:&#x20;

<figure><img src="https://3191699702-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fv3yKz4qukHpmpz1mhh8P%2Fuploads%2FHRpsXIsZ3ULTT3UeBUvr%2FScreenshot%202023-12-20%20at%2022.51.53.png?alt=media&#x26;token=d0fe745f-7ba9-4309-94ff-a7f72f57a2a3" alt=""><figcaption><p>Header</p></figcaption></figure>

<details>

<summary>User's Avatar</summary>

You can allow user's to use their avatar or photo.

</details>

<details>

<summary>Button - What'New?</summary>

You can link this button to a page ot blog post to see users about upcooming features in your application.

</details>

<details>

<summary>Button - Customize this template</summary>

Currently the button opens a pop-up to contact us but you can replace button with something like their current plan name.

</details>

### Sidebar Navigation

![](https://3191699702-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fv3yKz4qukHpmpz1mhh8P%2Fuploads%2Fbj6XKDk5JeNuQyBo4IwQ%2FScreenshot%202023-12-20%20at%2022.54.26.png?alt=media\&token=700ffe9a-0039-40eb-83d4-ca7fa8df7d32)

The sidebar serves as navigation between different views, and it also features functionality to display the percentage of credits the user has utilized.