useAsyncData in composables that uses each other
Hi, everyone! 
I have a repo here: https://gitlab.com/HIV/budgettracker
The description:
I have a composable
Both of them are supposed to run server-side on initial load.
(B) uses (A) to compute
(B) is used on
the
The problem:
Whenever the app starts, it issues 2 requests to
What did I try:
The question:
What are the options to 'tear apart' single composable with
Thank you!
I have a repo here: https://gitlab.com/HIV/budgettracker
The description:
I have a composable
useTransactionGroups (B) and useTransactions (A)Both of them are supposed to run server-side on initial load.
(B) uses (A) to compute
groups property.(B) is used on
transactions page and the (A) is used in the TFilter component.the
transactions data is requested with useAsyncData that (as per docs) is supposed to use useState for the data it fetches to cache it.The problem:
Whenever the app starts, it issues 2 requests to
transactions API endpoint from (A), because:TFilter -> (A): filtersTransactions (page) -> (B): groups -> (A): transactionsWhat did I try:
- use pinia store to join (A) + (B) data inside in one shot;
- use closures in (A) and (B) to not to create two separate instances of (A);
- use
useSatateto manage data inside (A) and (B)
transactions page and pass filter and groups as props to the corresponding components, everything works great.The question:
What are the options to 'tear apart' single composable with
useAsyncData inside. I think I don't understand something and maybe composables are not even designed to work that way.Thank you!
