fix(vue-app): avoid multiple $fetch calls

[pi0]

Types of changes

• Bug fix (a non-breaking change which fixes an issue)
• New feature (a non-breaking change which adds functionality)
• Breaking change (fix or feature that would cause existing functionality to change)

Description

Co-authored-by: Aster duda84@gmail.com

fixes #7107. closes #7108.

• Ensure lifecycle hooks registering once
• Ensure only one fetch promise is active per component instance

Checklist:

• My change requires a change to the documentation.
• I have updated the documentation accordingly. (PR: #)
• I have added tests to cover my changes (if not applicable, please state why)
• All new and existing tests are passing.

[codecov-io]

Codecov Report

Merging #7129 into dev will not change coverage by %.
The diff coverage is n/a.

@@           Coverage Diff           @@
##              dev    #7129   +/-   ##
=======================================
  Coverage   62.69%   62.69%           
=======================================
  Files          84       84           
  Lines        3394     3394           
  Branches      926      926           
=======================================
  Hits         2128     2128           
  Misses       1018     1018           
  Partials      248      248           

Flag	Coverage Δ
#unittests	62.69% <ø> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update b82f8d1...0876311. Read the comment docs.

[tarunmangukiya]

I am seeing this issue even after updating #7191

[pi0]

@tarunmangukiya As per #7191 (comment) do you still have this issue?

[tarunmangukiya]

The issue has been resolved. That was Cloudflare Proxy issue.
I'll deploy it to live in a day or two. And we'll be able to see new fetch APIs in action. :)