Problem using RefreshIndicator with a NestedScrollView

Question

I have 3 tab pages and I want to have a "pull to refresh" type of functionality when I pull to refresh the area inside of the respective tabs. I tried to use RefreshIndicator in the body area but it's hasn't been working properly. It made the header and the scrolling just not function properly anymore.

New to flutter and I'm really stumped, does anyone have any ideas of what I'm doing wrong here? Any help would be appreciated, TYIA!

@override
  Widget build(BuildContext context) => Scaffold(
        body: DefaultTabController(
          length: 3,
          child: NestedScrollView(
            floatHeaderSlivers: true,
            headerSliverBuilder: (context, value) {
              return <Widget>[
                SliverAppBar(
                  backgroundColor: kMainBG,
                  expandedHeight: 100,
                  toolbarHeight: 40,
                  floating: true,
                  pinned: true,
                  leading: IconButton(//icon stuff),
                  actions: <Widget>[IconButton(// icon stuff)],
                  title: Padding( // Padding & text),
                  titleSpacing: 0,
                  centerTitle: true,
                  bottom: TabBar(
                    isScrollable: true,
                    padding: EdgeInsets.only(
                        left: 10, right: 10),
                    unselectedLabelColor: tabUnselected,
                    labelColor: tabSelected,
                    labelStyle: TextStyle(// Styling Stuff),
                    tabs: [
                      Tab(text: 'STORES'),
                      Tab(text: 'OFFERS'),
                      Tab(text: 'EVENTS'),
                    ],
                    indicator: MaterialIndicator(
                      color: tabIndicator,
                      bottomLeftRadius: 50,
                      bottomRightRadius: 50,
                      topLeftRadius: 50,
                      topRightRadius: 50,
                    ),
                  ),
                ),
              ];
            },
            body: TabBarView(
              children: [
                Container(
                  color: kMainBG,
                  child: StoresTab(),
                ),
                Container(
                  color: kMainBG,
                  child: OffersTab(),
                ),
                Container(
                  color: kMainBG,
                  child: EventsTab(),
                ),
              ],
            ),
          ),
        ),
      );

Answer 1

This code is working for me, it's mostly built on top of @Nuts answer, but it needed some tweaking and my edit was rejected see here

Example:-

DefaultTabController(
      length: tabs.length,
      child: RefreshIndicator(
        notificationPredicate: (notification) {
          // with NestedScrollView local(depth == 2) OverscrollNotification are not sent
          return notification.depth == 2;
        },
        onRefresh: () => Future.value(null),
        child: NestedScrollView(
          headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
            return [
              SliverAppBar(...)
            ];
          },
          body: TabBarView(
            children: tabs,
          ),
        ),
      ),
    )