[PR #597] [MERGED] feat: |UI| add loading for lazy load component #651

New issue

Closed

opened 2026-02-26 21:32:14 +03:00 by kerem · 0 comments

kerem commented

2026-02-26 21:32:14 +03:00

Owner

📋 Pull Request Information

Original PR: https://github.com/dreamhunter2333/cloudflare_temp_email/pull/597
Author: @dreamhunter2333
Created: 2/26/2025
Status: ✅ Merged
Merged: 2/26/2025
Merged by: @dreamhunter2333

Base: main ← Head: feature/dev

📝 Commits (1)

492c982 feat: |UI| add loading for lazy load component

📊 Changes

3 files changed (+17 additions, -3 deletions)

View changed files

📝 frontend/src/views/Admin.vue (+6 -1)
📝 frontend/src/views/Header.vue (+4 -0)
📝 frontend/src/views/Index.vue (+7 -2)

📄 Description

PR Type

enhancement

Description

Add loading indicator for lazy-loaded components.
Implement loading state in Admin, Header, and Index views.
Improve user experience with visual feedback during component loading.

Changes walkthrough 📝

Relevant files

Enhancement

Admin.vue `Add loading indicator for lazy-loaded SendMail component` frontend/src/views/Admin.vue Define `SendMail` as an async component with loading indicator. Set `loading` state to true before importing `SendMail` and false after.	+6/-1
Header.vue `Implement loading state for admin page navigation` frontend/src/views/Header.vue Add loading state before and after navigation to admin page. Update `menuOptions` and `logoClick` functions to include loading indicator.	+4/-0
Index.vue `Add loading indicator for lazy-loaded SendMail component` frontend/src/views/Index.vue Define `SendMail` as an async component with loading indicator. Set `loading` state to true before importing `SendMail` and false after.	+7/-2

Need help?
Type /help how to ... in the comments thread for any questions about PR-Agent usage.
Check out the documentation for more information.

_{🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.}

## 📋 Pull Request Information **Original PR:** https://github.com/dreamhunter2333/cloudflare_temp_email/pull/597 **Author:** [@dreamhunter2333](https://github.com/dreamhunter2333) **Created:** 2/26/2025 **Status:** ✅ Merged **Merged:** 2/26/2025 **Merged by:** [@dreamhunter2333](https://github.com/dreamhunter2333) **Base:** `main` ← **Head:** `feature/dev` --- ### 📝 Commits (1) - [`492c982`](https://github.com/dreamhunter2333/cloudflare_temp_email/commit/492c982a68f6847bd61184404013725555d2d174) feat: |UI| add loading for lazy load component ### 📊 Changes **3 files changed** (+17 additions, -3 deletions) <details> <summary>View changed files</summary> 📝 `frontend/src/views/Admin.vue` (+6 -1) 📝 `frontend/src/views/Header.vue` (+4 -0) 📝 `frontend/src/views/Index.vue` (+7 -2) </details> ### 📄 Description ### **PR Type** enhancement ___ ### **Description** - Add loading indicator for lazy-loaded components. - Implement loading state in Admin, Header, and Index views. - Improve user experience with visual feedback during component loading. ___ ### **Changes walkthrough** 📝 <table><thead><tr><th></th><th align="left">Relevant files</th></tr></thead><tbody><tr><td><strong>Enhancement</strong></td><td><table> <tr> <td> <details> <summary><strong>Admin.vue</strong><dd><code>Add loading indicator for lazy-loaded SendMail component</code>  </dd></summary> <hr> frontend/src/views/Admin.vue <li>Define <code>SendMail</code> as an async component with loading indicator.<br> <li> Set <code>loading</code> state to true before importing <code>SendMail</code> and false after. </details> </td> <td><a href="https://github.com/dreamhunter2333/cloudflare_temp_email/pull/597/files#diff-78137b072a7fa52c6d503efb9a3d32c07da5073dd5ca32ac48b1402ac2481a55">+6/-1</a>      </td> </tr> <tr> <td> <details> <summary><strong>Header.vue</strong><dd><code>Implement loading state for admin page navigation</code>                </dd></summary> <hr> frontend/src/views/Header.vue <li>Add loading state before and after navigation to admin page.<br> <li> Update <code>menuOptions</code> and <code>logoClick</code> functions to include loading <br>indicator. </details> </td> <td><a href="https://github.com/dreamhunter2333/cloudflare_temp_email/pull/597/files#diff-a80b3d70a6be259910c988c05d497228b10a5e686042743c1831584fb391360d">+4/-0</a>      </td> </tr> <tr> <td> <details> <summary><strong>Index.vue</strong><dd><code>Add loading indicator for lazy-loaded SendMail component</code>  </dd></summary> <hr> frontend/src/views/Index.vue <li>Define <code>SendMail</code> as an async component with loading indicator.<br> <li> Set <code>loading</code> state to true before importing <code>SendMail</code> and false after. </details> </td> <td><a href="https://github.com/dreamhunter2333/cloudflare_temp_email/pull/597/files#diff-9816bb6131d16919d3ca2c71fb0911d2cb73cc9a49d75394c6206ff15f1aa4d8">+7/-2</a>      </td> </tr> </table></td></tr></tr></tbody></table> ___ > <details> <summary> Need help?</summary><li>Type <code>/help how to ...</code> in the comments thread for any questions about PR-Agent usage.</li><li>Check out the <a href="https://qodo-merge-docs.qodo.ai/usage-guide/">documentation</a> for more information.</li></details> --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>