firebase / flutterfire

🔥 A collection of Firebase plugins for Flutter apps.
https://firebase.google.com/docs/flutter/setup
BSD 3-Clause "New" or "Revised" License
8.68k stars 3.97k forks source link

Can't display the data fetch from Firestone #8064

Closed fbayona13 closed 2 years ago

fbayona13 commented 2 years ago

Discussed in https://github.com/FirebaseExtended/flutterfire/discussions/8063

Originally posted by **fbayona13** February 10, 2022 I'm learning Flutter, Bloc, Firestone, and I'm trying to bring a collection from Firestore and display it as a CarouselSlider using the Bloc pattern. I can't show the Carousel, only shows me the CircularProgressIndicator(). Help pls The video that I'm using -> https://www.youtube.com/watch?v=O8-Q6RyO8QY&list=PLCAZyR6zw2px5C7L2cCG4aywx6g58MIoP&index=25 main.dart ``` class MyApp extends StatelessWidget { // This widget is the root of your application. @override Widget build(BuildContext context) { return MultiBlocProvider( providers: [ BlocProvider(create: (_) => FavoritesBloc()..add(StartFavorites())), BlocProvider( create: (_) => CheckoutServiceBloc()..add(CheckoutServiceStarted())), BlocProvider( create: (_) => CategoryBloc( categoryRepository: CategoryRepository(), )..add(LoadCategories()), ), BlocProvider( create: (_) => ServiceBloc( serviceRepository: ServiceRepository(), )..add(LoadServices()), ), ], ``` home.dart ``` BlocBuilder( builder: (context, state) { if (state is CategoryLoading){ return Center(child: CircularProgressIndicator(),); } if (state is CategoryLoaded){ return CarouselSlider( options: CarouselOptions( aspectRatio: 1.5, viewportFraction: 0.9, enlargeCenterPage: true, enableInfiniteScroll: true, enlargeStrategy: CenterPageEnlargeStrategy.height, ), items: state.categories .map((category) => HeroCarouselCard(category: category)) .toList(), ); } else{ return Text("Something went Wrong"); } }, ), ``` category_model.dart ``` static Category fromSnapshot(DocumentSnapshot snap) { Category category = Category( name: snap['name'], urlImage: snap['imageUrl'], ); return category; } ``` category_base_repo.dart ``` abstract class BaseCategoryRepository { Stream> getAllCategories(); } ``` category_repo.dart ``` class CategoryRepository extends BaseCategoryRepository { final FirebaseFirestore _firebaseFirestore; CategoryRepository({FirebaseFirestore? firebaseFirestore}) : _firebaseFirestore = firebaseFirestore ?? FirebaseFirestore.instance; @override Stream> getAllCategories() { return _firebaseFirestore .collection("categories") .snapshots() .map((snapshot) { return snapshot.docs.map((doc) => Category.fromSnapshot(doc)).toList(); }); } } ``` category_bloc.dart ``` class CategoryBloc extends Bloc { final CategoryRepository _categoryRepository; StreamSubscription? _categorySubscription; CategoryBloc({required CategoryRepository categoryRepository}) : _categoryRepository = categoryRepository, super(CategoryLoading()); @override Stream mapEventToState(CategoryEvent event) async* { if (event is LoadCategories) { yield* _mapLoadCategoriesToState(); } if (event is UpdateCategories) { yield* _mapUpdateCategoriesToState(event); } } Stream _mapLoadCategoriesToState() async* { _categorySubscription?.cancel(); _categorySubscription = _categoryRepository .getAllCategories() .listen((categories) => add(UpdateCategories(categories))); } Stream _mapUpdateCategoriesToState( UpdateCategories event) async* { yield CategoryLoaded(categories: event.categories); } } ``` category_event.dart ``` abstract class CategoryEvent extends Equatable { const CategoryEvent(); } class LoadCategories extends CategoryEvent{ @override List get props => []; } class UpdateCategories extends CategoryEvent{ final List categories; UpdateCategories(this.categories); @override List get props => [categories]; } ``` category_state.dart ``` abstract class CategoryState extends Equatable { const CategoryState(); } class CategoryLoading extends CategoryState { @override List get props => []; } class CategoryLoaded extends CategoryState { final List categories; CategoryLoaded({this.categories = const []}); @override List get props => [categories]; } ```
darshankawar commented 2 years ago

@fbayona13 Your question is better suited for support channels like StackOverflow, so please ask the same there. Closing from here, as this isn't an issue, but more of a code assistance question.