Home > database >  Show a dialog instead of return a widget using Either in Flutter/Dart
Show a dialog instead of return a widget using Either in Flutter/Dart

Time:11-28

I'm a little stuck and can't figure out how the architectural flow should work in this use case. I know almost nothing about functional programming, I'm using this Either from dartz package, a functional programming package. Can someone help me with the following:

I want to show a popup dialog instead of a widget if there is an error. But the design of Either seems to not allow this somehow as this if logic requires a widget of course. Is there a better design which I could accomplish this with?

Learning error handling here

import 'dart:convert';
import 'dart:io';
import 'package:dartz/dartz.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:awesome_dialog/awesome_dialog.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return ProviderScope(
      child: MaterialApp(
        title: 'Flutter Demo',
        theme: ThemeData(
          primarySwatch: Colors.orange,
        ),
        home: const HomePage(),
      ),
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.blueGrey,
      body: Flex(
        direction: Axis.horizontal,
        children: [
          Expanded(
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [
                Consumer(
                  builder: (ctx, ref, child) {
                    if (ref.watch(notifier).state == NotifierState.initial) {
                      return const Text('Press the button');
                    } else if (ref.watch(notifier).state == NotifierState.loading) {
                      return const CircularProgressIndicator();
                    } else {
                      return ref.read(notifier).post.fold(
                        (failure) {
                          showDialog(                     /// Error here, expects a widget
                            context: context,
                            barrierDismissible: true,
                            builder: (BuildContext context) => AlertDialog(
                              title: Text(failure.toString()),
                            ),
                          );
                        },
                        (post) => Text(post.toString()),
                      );
                    }
                  },
                ),
                Consumer(
                  builder: (ctx, ref, child) {
                    return ElevatedButton(
                        onPressed: () {
                          ref.read(notifier).getOnePost();
                        },
                        child: const Text('Get Post'));
                  },
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}

class PostService {
  final httpClient = FakeHttpClient();
  Future<Post?> getOnePost() async {
    try {
      final responseBody = await httpClient.getResponseBody();
      return Post.fromJson(responseBody);
    } on SocketException {
      throw Failure('No Internet connection            
  • Related