How to place TabbarView (child: slivergrid) inside a CustomScrollView (children: Slivers) in flutter

Question

I cant figure out how to use a tabbarview inside of a customscrollview that requires slivers for children. I have tried to wrap the tabbar view in anything i could think of but no luck so far.

desired result | desired result with sliverappbar closed on scroll

here is code that gives the desired look, but is not tab bar controllable

return Scaffold(
  backgroundColor: kBackgroundGrey,
  body: Padding(
    padding: EdgeInsets.only(top: statusBarHeight),
    child: CustomScrollView(
      slivers: [
        const MainMenuSliverAppBar(),
        MainMenuSliverTabBar(
          topTabContrlr: _tabControllerTop,
        ),
        const MainMenuProductSliverGrid()
      ],
    ),
  ),
  bottomNavigationBar: BottomChoiceTab(
    botTabController: _tabControllerBot,
  ),
);

here is my attempt that fails to work for controlling silver grid with tab bar failed attempt

    return Scaffold(
  backgroundColor: kBackgroundGrey,
  body: Padding(
    padding: EdgeInsets.only(top: statusBarHeight),
    child: CustomScrollView(
      slivers: [
        const MainMenuSliverAppBar(),
        MainMenuSliverTabBar(
          topTabContrlr: _tabControllerTop,
        ),
        SliverFillRemaining(
          child: TabBarView(controller: _tabControllerTop, children: const [
            MainMenuProductSliverGrid(),
            MainMenuProductSliverGrid(),
            MainMenuProductSliverGrid(),
            MainMenuProductSliverGrid()
          ]),
        )
      ],
    ),
  ),
  bottomNavigationBar: BottomChoiceTab(
    botTabController: _tabControllerBot,
  ),
);

any help would be greatly appreciated, even if you could just point me in the right direction. I haven't been able to find anything on StackOverflow, google, etc. my failed attempt code is from the closest solution I could find to my problem but it seems even that doesn't work.

plz save me lol