Add Firebase Storage

Profile picture is currently hard coded , lets store it in firebase storage

add package firebase_storage to pubspec.yaml

firebase_storage: ^11.6.6

Screens => profile_screen.dart

  final _firestore = FirebaseFirestore.instance;
  final _auth = FirebaseAuth.instance;
  final _storage = FirebaseStorage.instance;

  var name = "Loading...";
  var bio = "Loading...";
  var photoURL = FirebaseAuth.instance.currentUser!.photoURL;

update initState

 @override
  void initState() {
    super.initState();
    _auth.currentUser!.reload();
    loadUserData();

    loadBadges();
  }

add functionality to loadUserData. and updateUserData


  void loadUserData() {
    _firestore
        .collection("users")
        .doc(_auth.currentUser!.uid)
        .get()
        .then((snapshot) {
      setState(() {
        name = snapshot.data()!["name"];
        bio = snapshot.data()!["bio"];
      });
    });
  }

  void updateUserData() {
    _firestore.collection("users").doc(_auth.currentUser!.uid).update({
      'name': name,
      'bio': bio,
    }).then((value) {
      showDialog(
          context: context,
          builder: (context) {
            return AlertDialog(
              title: Text("Success!"),
              content: Text("The profile data has been updated!"),
              actions: [
                TextButton(
                    onPressed: () {
                      Navigator.of(context).pop();
                    },
                    child: Text("OK!"))
              ],
            );
          });
    }).catchError((err) {
      showDialog(
          context: context,
          builder: (context) {
            return AlertDialog(
              title: Text("Uh-Oh!"),
              content: Text("$err"),
              actions: [
                TextButton(
                  onPressed: () {
                    Navigator.of(context).pop();
                  },
                  child: Text("Try Again!"),
                )
              ],
            );
          });
    });
  }

Update getImage -> to store image to storage

Future getImage() async {
    final pickedFile =
        await ImagePicker().pickImage(source: ImageSource.gallery);

    if (pickedFile != null) {
      File _image = File(pickedFile.path);

      _storage
          .ref("profile_pictures/${_auth.currentUser!.uid}.jpg")
          .putFile(_image)
          .then((snapshot) {
        snapshot.ref.getDownloadURL().then((url) {
          _firestore
              .collection("users")
              .doc(_auth.currentUser!.uid)
              .update({'profilePic': url}).then((snapshot) {
            _auth.currentUser!.updatePhotoURL(url);
          });
        });
      });
    } else {
      print("A file was not selected");
    }
  }

image_picker needs access to photos update Info.plist file, located in <project root>/ios/Runner/Info.plist

We can also bring the background illistration for the Courses from storage

Widgets => explore_course_card.dart

  final _storage = FirebaseStorage.instance;
  String? illustrationURL;

modigy getIllustration

void getIllustration() {
    _storage
        .ref("illustrations/${widget.course.illustration}")
        .getDownloadURL()
        .then((url) {
      setState(() {
        illustrationURL = url;
      });
    });
  }

Column(
        mainAxisAlignment: MainAxisAlignment.end,
        children: [
          (illustrationURL == null)
              ? Container()
              : Image.network(
                  illustrationURL!,
                  fit: BoxFit.cover,
                  height: 100.0,
                )
        ],
      )),

Last updated