nested providerScope override not taking effect of provider

[omar-hadek]

i have a provider that is not implemented until i get a value for it

final currentSalonProvider =
    Provider<Salon>((ref) => throw UnimplementedError());

then im watching it from an interceptor provider

final salonInterceptorProvider = Provider<SalonInterceptor>((ref) {
  return SalonInterceptor(salonId: ref.watch(currentSalonProvider).id);
});

its been added to an http service provider

final salonHttpServiceProvider = Provider<HttpService>(
  (ref) {
    final storageService = ref.read(storageServiceProvider);
    final authInterceptor = ref.read(authInterceptorProvider);
    final salonInterceptor = ref.read(salonInterceptorProvider);
    final localeInterceptor = ref.read(localeInterceptorProvider);

    return DioHttpService(
      authInterceptor: authInterceptor,
      localeInterceptor: localeInterceptor,
      salonInterceptor: salonInterceptor,
      storageService: storageService,
      enableCaching: false,
      enableLogging: kDebugMode,
      addLocale: true,
      addSalon: true,
      isPrivate: false,
    );
  },
);

I have a repository provider that using that httpService

final salonDetailRepositoryProvider = Provider<SalonDetailRepository>((ref) {
  return SalonDetailRepository(
    ref.watch(salonHttpServiceProvider),
  );
},);

final salonModulesFutureProvider = FutureProvider.autoDispose<List<SalonGrid>>(
  (ref) async {
     final translation = ref.read(appLocalizationsProvider);
    final salonDetailRepository = ref.watch(salonDetailRepositoryProvider);
    final availableModules = ref.read(availableModulesProvider);

    final salonModules = await salonDetailRepository.getSalonModules(
      availableModules: [],
      myAppointmentsTrganslated: translation.myAppointments'
    );
    return salonModules;
  },
);

this is the view that is consuming that provider

class DashboardPage extends ConsumerWidget {
  final Salon salon;
  const DashboardPage({
    Key? key,
    required this.salon,
  }) : super(key: key);
  static const String routeName = 'dashboard';
  static const String routePath = '/dashboard';

  static const String privateName = 'dashboard-private';
  static const String privatePath = '/dashboard-private';

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    // final todo = ref.watch(currentSalonProvider);

    return ProviderScope(
      // parent: ,
      overrides: [
        currentSalonProvider.overrideWithValue(salon),
      ],
      child: Scaffold(
        body: CustomScrollView(
          slivers: [
            DashboardSliverAppBar(salonId: salon.id),
            DashboardGrid(),
          ],
        ),
      ),
    );
  }
}



class DashboardGrid extends ConsumerWidget {
  const DashboardGrid({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context, WidgetRef ref) {
    return ref.watch(salonModulesFutureProvider).when(
          data: (data) {
            final modules = data;
            return SliverGrid(
              //padding: EdgeInsets.all(16),
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                crossAxisCount: modules.length <= 8 ? 2 : 3,
                crossAxisSpacing: 8,
                mainAxisSpacing: 8,
                mainAxisExtent: 130,
              ),
              delegate: SliverChildBuilderDelegate(
                (_, index) {
                  final module = modules[index];

                  return GriditemView(
                    module: module,
                  );
                },
                childCount: modules.length,
              ),
            );
          },
          error: (error, stackTrace) => Center(
            child: Text('error occurred $error'),
          ).toSliver,
          loading: () => Center(
            child: CircularProgressIndicator(),
          ).toSliver,
        );
  }
}

My problem is i still get UNEMPLEMENTEDError