fixed connection problem

lib/features/core/data/constants/const_colors.dart

@@ -7,6 +7,7 @@ abstract class ConstColours {
 
   static const white = Colors.white;
   static const black = Colors.black;
+  static const transparent = Colors.transparent;
 }
 
 abstract class ConstThemes {

lib/features/core/services/connection_service.dart

@@ -1,133 +0,0 @@
-import 'dart:async';
-import 'dart:io';
-
-import 'package:connectivity_plus/connectivity_plus.dart';
-import 'package:flutter/foundation.dart';
-import 'package:internet_connection_checker/internet_connection_checker.dart';
-
-import '/locator.dart';
-
-/// Used to observe the current connection type.
-class ConnectionService {
-  ConnectionService({
-    required Connectivity connectivity,
-    required InternetConnectionChecker internetConnectionChecker,
-    bool shouldInitialize = true,
-  })  : _connectivity = connectivity,
-        _internetConnectionChecker = internetConnectionChecker {
-    if (shouldInitialize) initialize();
-  }
-
-  ConnectivityResult? _connectivityResult;
-  ConnectivityResult? get connectivityResult => _connectivityResult;
-
-  final Connectivity _connectivity;
-  final Map<String, StreamSubscription> _connectivitySubscriptions = {};
-
-  final InternetConnectionChecker _internetConnectionChecker;
-
-  final Completer _isInitialized = Completer();
-
-  Completer<bool>? _hasInternetConnection;
-
-  final ValueNotifier<bool> _hasInternetConnectionListenable = ValueNotifier(false);
-  ValueListenable<bool> get hasInternetConnectionListenable => _hasInternetConnectionListenable;
-
-  Future<bool> get hasInternetConnection async {
-    try {
-      if (_hasInternetConnection == null) {
-        _hasInternetConnection = Completer<bool>();
-        try {
-          final hasInternetConnection = await _internetConnectionChecker.hasConnection;
-          _hasInternetConnection!.complete(hasInternetConnection);
-          return hasInternetConnection;
-        } catch (error) {
-          _hasInternetConnection!.complete(false);
-          return false;
-        } finally {
-          _hasInternetConnection = null;
-        }
-      } else {
-        final awaitedHasInternet = await _hasInternetConnection!.future;
-
-        return awaitedHasInternet;
-      }
-    } on SocketException catch (_, __) {
-      return false;
-    }
-  }
-
-  Future<void> initialize() async {
-    try {
-      final tag = runtimeType.toString();
-      if (_connectivitySubscriptions[tag] != null) {
-        await dispose();
-      }
-      _connectivitySubscriptions[tag] = _connectivity.onConnectivityChanged.listen(
-        _onConnectivityChanged,
-        cancelOnError: false,
-        onError: (error, stack) {},
-      );
-      await _onConnectivityChanged(await _connectivity.checkConnectivity());
-      _internetConnectionChecker.onStatusChange.listen((final event) {
-        switch (event) {
-          case InternetConnectionStatus.connected:
-            _hasInternetConnectionListenable.value = true;
-            break;
-          case InternetConnectionStatus.disconnected:
-            _hasInternetConnectionListenable.value = false;
-            break;
-        }
-      });
-      _isInitialized.complete();
-    } catch (error, stackTrace) {}
-  }
-
-  Future<void> dispose() async {
-    for (final subscription in _connectivitySubscriptions.values) {
-      await subscription.cancel();
-    }
-    _connectivitySubscriptions.clear();
-    _connectivityResult = null;
-  }
-
-  Future<void> addListener({
-    required String tag,
-    required Future<void> Function({
-      required ConnectivityResult connectivityResult,
-      required bool hasInternet,
-    })
-        listener,
-    bool tryCallListenerOnAdd = true,
-  }) async {
-    try {
-      if (_connectivityResult != null && tryCallListenerOnAdd)
-        await listener(
-            connectivityResult: _connectivityResult!, hasInternet: await hasInternetConnection);
-      _connectivitySubscriptions[tag] =
-          _connectivity.onConnectivityChanged.listen((connectivityResult) async {
-        await listener(
-            connectivityResult: connectivityResult, hasInternet: await hasInternetConnection);
-      });
-    } catch (error, stackTrace) {}
-  }
-
-  Future<void> removeListener({required String tag}) async {
-    try {
-      final subscription = _connectivitySubscriptions[tag];
-      if (subscription != null) {
-        await subscription.cancel();
-      } else {}
-    } catch (error, stackTrace) {}
-  }
-
-  Future<void> _onConnectivityChanged(ConnectivityResult connectivityResult) async {
-    try {
-      _connectivityResult = connectivityResult;
-    } catch (error, stackTrace) {}
-  }
-
-  static ConnectionService get locate => Locator.locate();
-}
-
-class NoInternetException implements Exception {}

lib/features/core/services/connections_service.dart

@@ -0,0 +1,95 @@
+import 'dart:async';
+
+import 'package:connectivity_plus/connectivity_plus.dart';
+import 'package:flutter/foundation.dart';
+import 'package:internet_connection_checker/internet_connection_checker.dart';
+
+import '/features/core/services/logging_service.dart';
+import '/locator.dart';
+
+/// Used to observe the current connection type.
+class ConnectionsService {
+  ConnectionsService({
+    required Connectivity connectivity,
+    required InternetConnectionChecker internetConnectionChecker,
+    required LoggingService loggingService,
+  })  : _internetConnectionChecker = internetConnectionChecker,
+        _connectivity = connectivity,
+        _loggingService = loggingService {
+    _init();
+  }
+
+  final InternetConnectionChecker _internetConnectionChecker;
+  final Connectivity _connectivity;
+  final LoggingService _loggingService;
+
+  late final ValueNotifier<InternetConnectionStatus> _internetConnectionStatusNotifier;
+  ValueListenable<InternetConnectionStatus> get internetConnectionStatusListenable =>
+      _internetConnectionStatusNotifier;
+  late final ValueNotifier<ConnectivityResult> _connectivityResultNotifier;
+  ValueListenable<ConnectivityResult> get connectivityResultListenable =>
+      _connectivityResultNotifier;
+
+  Future<void> _init() async {
+    // Initialize notifiers
+    _internetConnectionStatusNotifier =
+        ValueNotifier(await _internetConnectionChecker.connectionStatus);
+    _connectivityResultNotifier = ValueNotifier(await _connectivity.checkConnectivity());
+    _loggingService
+        .info('Initial internet status: ${internetConnectionStatusListenable.value.nameWithIcon}');
+    _loggingService
+        .info('Initial connectivity result: ${connectivityResultListenable.value.nameWithIcon}');
+
+    // Attach converters by listening to stream
+    _internetConnectionChecker.onStatusChange
+        .listen((final InternetConnectionStatus internetConnectionStatus) {
+      _loggingService.info(
+          'Internet status changed to: ${internetConnectionStatus.nameWithIcon}. Notifying...');
+      _internetConnectionStatusNotifier.value = internetConnectionStatus;
+    });
+    _connectivity.onConnectivityChanged.listen((final connectivityResult) {
+      _loggingService
+          .info('Connectivity result changed to: ${connectivityResult.nameWithIcon}. Notifying...');
+      _connectivityResultNotifier.value = connectivityResult;
+    });
+
+    Locator.instance().signalReady(this);
+  }
+
+  Future<void> dispose() async {
+    _internetConnectionStatusNotifier.dispose();
+    _connectivityResultNotifier.dispose();
+  }
+
+  static ConnectionsService get locate => Locator.locate();
+}
+
+extension _connectionStatusEmojiExtension on InternetConnectionStatus {
+  String get nameWithIcon {
+    switch (this) {
+      case InternetConnectionStatus.connected:
+        return '$name (🌐✅)';
+      case InternetConnectionStatus.disconnected:
+        return '$name (🔌)';
+    }
+  }
+}
+
+extension _connectivityEmojiExtension on ConnectivityResult {
+  String get nameWithIcon {
+    switch (this) {
+      case ConnectivityResult.bluetooth:
+        return '$name (ᛒ🟦)';
+      case ConnectivityResult.wifi:
+        return '$name (◲)';
+      case ConnectivityResult.ethernet:
+        return '$name (🌐)';
+      case ConnectivityResult.mobile:
+        return '$name (📶)';
+      case ConnectivityResult.none:
+        return '$name (🔌)';
+      case ConnectivityResult.vpn:
+        return '$name (🔒)';
+    }
+  }
+}

lib/features/core/services/overlay_service.dart

@@ -1,36 +1,45 @@
-import 'dart:async';
-
 import 'package:flutter/widgets.dart';
 import 'package:mc_gallery/features/core/services/logging_service.dart';
 import 'package:mc_gallery/locator.dart';
 
 class OverlayService {
-  const OverlayService({
+  OverlayService({
     required LoggingService loggingService,
   }) : _loggingService = loggingService;
 
   final LoggingService _loggingService;
 
-  final Map<int, OverlayEntry> _overlayEntryMap = const {};
+  final Map<int, OverlayEntry> _overlayEntryMap = {};
 
-  Future<void> playOverlayEntry({
-    required BuildContext context,
+  void insertOverlayEntry(
+    BuildContext context, {
+    required String tag,
     required OverlayEntry overlayEntry,
-  }) async {
+  }) {
+    if (!_overlayEntryMap.containsKey(tag.hashCode) && !overlayEntry.mounted) {
+      _overlayEntryMap.addEntries([MapEntry(tag.hashCode, overlayEntry)]);
       try {
-      _overlayEntryMap[overlayEntry.hashCode] = overlayEntry;
-      Overlay.of(
-        context,
-        rootOverlay: true,
-      )!
-          .insert(overlayEntry);
-
-      if (overlayEntry.mounted) overlayEntry.remove();
-
-      _overlayEntryMap.remove(overlayEntry.hashCode);
-    } catch (error, stackTrace) {
-      _loggingService.handle(error, stackTrace);
+        Overlay.of(context, rootOverlay: true)?.insert(overlayEntry);
+        //todo(mehul): Fix and not ignore Overlay building while Widget building error.
+      } on FlutterError catch (_) {}
+      _loggingService.info('Overlay inserted with tag: $tag');
+    } else
+      _loggingService.info('Overlay with tag: $tag, NOT inserted');
   }
+
+  void removeOverlayEntry({
+    required String tag,
+  }) {
+    if (_overlayEntryMap.containsKey(tag.hashCode)) {
+      final _overlayEntry = _overlayEntryMap[tag.hashCode];
+      if (_overlayEntry?.mounted ?? false) {
+        _overlayEntryMap[tag.hashCode]?.remove();
+        _overlayEntryMap.remove(tag.hashCode);
+        _loggingService.info('Overlay removed with tag: $tag');
+      } else
+        _loggingService.info('Overlay with tag: $tag already mounted OR not found. Skipped');
+    } else
+      _loggingService.info('Overlay with tag: $tag already exists. Skipped');
   }
 
   void dispose() {

lib/features/core/widgets/mcg_scaffold.dart

@@ -1,12 +1,15 @@
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
-import 'package:flutter/widgets.dart';
+import 'package:internet_connection_checker/internet_connection_checker.dart';
+import 'package:mc_gallery/features/core/data/constants/const_colors.dart';
+import 'package:mc_gallery/features/core/services/logging_service.dart';
+import 'package:mc_gallery/l10n/generated/l10n.dart';
 
-import '../data/constants/const_durations.dart';
-import '../services/connection_service.dart';
+import '/features/core/services/connections_service.dart';
+import '/features/core/services/overlay_service.dart';
 
-class McgScaffold extends StatelessWidget {
-  const McgScaffold({
+class McgScaffold extends StatelessWidget with LoggingService {
+  McgScaffold({
     this.appBar,
     this.bodyBuilderWaiter,
     this.body,
@@ -28,36 +31,59 @@ class McgScaffold extends StatelessWidget {
 
   /// Enabling listing to [ConnectionState], showing a small text at the top, when connectivity is lost.
   final bool forceInternetCheck;
+  final ConnectionsService _connectionsService = ConnectionsService.locate;
+  final OverlayService _overlayService = OverlayService.locate;
 
   @override
   Widget build(BuildContext context) {
-    final Widget loginOptionsBody = bodyBuilderWaiter != null
+    if (forceInternetCheck) {
+      _connectionsService.internetConnectionStatusListenable.addListener(
+        () => _handleOverlayDisplay(context: context),
+      );
+      if (_connectionsService.internetConnectionStatusListenable.value ==
+          InternetConnectionStatus.disconnected) _handleOverlayDisplay(context: context);
+    }
+
+    return Scaffold(
+      appBar: appBar,
+      body: bodyBuilderWaiter != null
           ? ValueListenableBuilder<bool>(
               valueListenable: bodyBuilderWaiter!,
               builder: (context, final isReady, child) => !isReady
                   ? Center(child: waitingWidget ?? const CircularProgressIndicator())
                   : body ?? const SizedBox.shrink(),
             )
-        : body ?? const SizedBox.shrink();
-
-    return Scaffold(
-      appBar: appBar,
-      body: forceInternetCheck
-          ? SingleChildScrollView(
-              child: ValueListenableBuilder<bool>(
-                valueListenable: ConnectionService.locate.hasInternetConnectionListenable,
-                builder: (context, hasInternetConnection, _) => Column(
-                  children: [
-                    AnimatedSwitcher(
-                      duration: ConstDurations.defaultAnimationDuration,
-                      child: !hasInternetConnection ? Text('No internet') : const SizedBox.shrink(),
-                    ),
-                    loginOptionsBody,
-                  ],
-                ),
-              ),
-            )
-          : loginOptionsBody,
+          : body ?? const SizedBox.shrink(),
     );
   }
+
+  void _handleOverlayDisplay({required BuildContext context}) {
+    switch (_connectionsService.internetConnectionStatusListenable.value) {
+      case InternetConnectionStatus.disconnected:
+        _overlayService.insertOverlayEntry(
+          context,
+          tag: runtimeType.toString(),
+          overlayEntry: OverlayEntry(
+            opaque: false,
+            builder: (_) => Align(
+              alignment: Alignment.topCenter,
+              child: Card(
+                elevation: 16,
+                surfaceTintColor: ConstColours.transparent,
+                color: ConstColours.transparent,
+                child: Padding(
+                  padding: const EdgeInsets.all(16),
+                  child: Text(
+                    Strings.current.noInternetMessage,
+                  ),
+                ),
+              ),
+            ),
+          ),
+        );
+        break;
+      case InternetConnectionStatus.connected:
+        _overlayService.removeOverlayEntry(tag: runtimeType.toString());
+    }
+  }
 }

lib/features/home/api/unsplash_images_api.dart

@@ -25,7 +25,7 @@ class UnsplashImagesApi with LoggingService implements ImagesApi {
         return ImageModel(
           imageIndex: imageIndex,
           uri: imageUri,
-          imageName: '${Strings.current.image} $imageIndex: size=$imageSide',
+          imageName: '${Strings.current.image} ${imageIndex + 1}: size=$imageSide',
         );
       });
     } on Exception catch (ex, stackTrace) {

lib/features/home/services/images_service.dart

@@ -36,6 +36,9 @@ class ImagesService {
 
   int get firstAvailableImageIndex => 0;
   int get lastAvailableImageIndex => _imageModels.length - 1;
+  int get numberOfImages => _imageModels.length;
+
+  ImageModel imageModelAt({required int index}) => _imageModels.elementAt(index);
 
   static ImagesService get locate => Locator.locate();
 }

lib/features/home/views/gallery/gallery_view.dart

@@ -16,6 +16,7 @@ class GalleryView extends StatelessWidget {
       viewModelBuilder: () => GalleryViewModel.locate,
       builder: (context, final model) => McgScaffold(
         bodyBuilderWaiter: model.isInitialised,
+        forceInternetCheck: true,
         appBar: AppBar(
           title: Text(model.strings.gallery),
         ),
@@ -46,8 +47,6 @@ class GalleryView extends StatelessWidget {
                                   context,
                                   imageModel: imageModel,
                                 ),
-                                child: Hero(
-                                  tag: imageModel.imageIndex.toString(),
                                 child: CachedNetworkImage(
                                   imageUrl: imageModel.uri.toString(),
                                   cacheKey: imageModel.imageIndex.toString(),
@@ -57,7 +56,6 @@ class GalleryView extends StatelessWidget {
                                   ),
                                 ),
                               ),
-                              ),
                           ],
                         ),
                       ),

lib/features/home/views/image_carousel/image_carousel_view.dart

@@ -1,9 +1,12 @@
+import 'package:auto_size_text/auto_size_text.dart';
 import 'package:cached_network_image/cached_network_image.dart';
+import 'package:carousel_slider/carousel_slider.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_markdown/flutter_markdown.dart';
-import 'package:mc_gallery/features/core/data/constants/const_colors.dart';
-import 'package:mc_gallery/features/core/data/constants/const_text.dart';
+import 'package:mc_gallery/features/home/data/models/image_model.dart';
 
+import '/features/core/data/constants/const_colors.dart';
+import '/features/core/data/constants/const_text.dart';
 import '/features/core/widgets/gap.dart';
 import '/features/core/widgets/mcg_scaffold.dart';
 import '/features/core/widgets/view_model_builder.dart';
@@ -28,38 +31,57 @@ class ImageCarouselView extends StatelessWidget {
       viewModelBuilder: () => ImageCarouselViewModel.locate,
       argumentBuilder: () => imageCarouselViewArguments,
       builder: (context, final model) => McgScaffold(
+        bodyBuilderWaiter: model.isInitialised,
         appBar: AppBar(
           title: Text(model.strings.imageCarousel),
         ),
         body: Column(
           children: [
             Expanded(
+              child: Padding(
+                padding: const EdgeInsets.all(8.0),
                 child: Card(
                   elevation: 8,
-                child: Stack(
+                  surfaceTintColor: ConstColours.transparent,
+                  child: CarouselSlider.builder(
+                    itemCount: model.numberOfImages,
+                    options: CarouselOptions(
+                      enlargeFactor: 1,
+                      enlargeCenterPage: true,
+                      enlargeStrategy: CenterPageEnlargeStrategy.scale,
+                      disableCenter: true,
+                      viewportFraction: 1,
+                      initialPage: model.currentImageIndex,
+                      enableInfiniteScroll: false,
+                      onPageChanged: (final index, _) => model.swipedTo(newIndex: index),
+                    ),
+                    itemBuilder: (context, _, __) => Stack(
                       fit: StackFit.expand,
                       children: [
-                    Hero(
-                      tag: model.currentImageKey,
-                      child: CachedNetworkImage(
+                        ValueListenableBuilder<ImageModel>(
+                          valueListenable: model.currentImageModelListenable,
+                          builder: (context, _, __) => CachedNetworkImage(
                             imageUrl: model.currentImageUrl,
                             cacheKey: model.currentImageKey,
-                        fit: BoxFit.fill,
+                            fit: BoxFit.contain,
                             progressIndicatorBuilder: (_, __, final progress) =>
                                 CircularProgressIndicator(
                               value: model.downloadProgressValue(progress: progress),
                             ),
                           ),
                         ),
-                    Center(
-                      child: Row(
+                        ValueListenableBuilder<ImageModel>(
+                          valueListenable: model.currentImageModelListenable,
+                          builder: (context, _, __) => Row(
                             mainAxisAlignment: MainAxisAlignment.spaceBetween,
                             children: [
                               Icon(
                                 Icons.chevron_left,
-                            color: model.hasPreviousImage ? ConstColours.white : ConstColours.black,
+                                color: model.hasPreviousImage
+                                    ? ConstColours.white
+                                    : ConstColours.black,
                               ),
-                          Text(
+                              AutoSizeText(
                                 model.currentImageName,
                                 style: ConstText.imageOverlayTextStyle(context),
                               ),
@@ -74,6 +96,8 @@ class ImageCarouselView extends StatelessWidget {
                     ),
                   ),
                 ),
+              ),
+            ),
             const Gap(24),
             Padding(
               padding: const EdgeInsets.symmetric(horizontal: 24),

lib/features/home/views/image_carousel/image_carousel_view_model.dart

@@ -22,13 +22,14 @@ class ImageCarouselViewModel extends BaseViewModel {
   final NavigationService _navigationService;
   final LoggingService _loggingService;
 
-  late final ValueNotifier<ImageModel> _currentImageModel;
-  ValueListenable<ImageModel> get currentImageModel => _currentImageModel;
+  late final ValueNotifier<ImageModel> _currentImageModelNotifier;
+  ValueListenable<ImageModel> get currentImageModelListenable => _currentImageModelNotifier;
 
   @override
   Future<void> initialise(bool Function() mounted, [arguments]) async {
-    _currentImageModel = ValueNotifier(_imagesService.imageModels
+    _currentImageModelNotifier = ValueNotifier(_imagesService.imageModels
         .elementAt((arguments! as ImageCarouselViewArguments).imageIndexKey));
+    _loggingService.info('Initialized with image: ${_currentImageModelNotifier.value.imageIndex}');
 
     super.initialise(mounted, arguments);
   }
@@ -38,17 +39,25 @@ class ImageCarouselViewModel extends BaseViewModel {
     super.dispose();
   }
 
-  String get currentImageUrl => currentImageModel.value.uri.toString();
-  String get currentImageKey => currentImageModel.value.imageIndex.toString();
-  String get currentImageName => currentImageModel.value.imageName;
+  void swipedTo({required int newIndex}) {
+    _currentImageModelNotifier.value = _imagesService.imageModelAt(index: newIndex);
+    _loggingService.info('Swiped to image: ${_currentImageModelNotifier.value.imageIndex}');
+  }
+
+  String get currentImageUrl => currentImageModelListenable.value.uri.toString();
+  String get currentImageKey => currentImageModelListenable.value.imageIndex.toString();
+  String get currentImageName => currentImageModelListenable.value.imageName;
+  int get currentImageIndex => currentImageModelListenable.value.imageIndex;
+
+  int get numberOfImages => _imagesService.numberOfImages;
 
   double? downloadProgressValue({required DownloadProgress progress}) =>
       progress.totalSize != null ? progress.downloaded / progress.totalSize! : null;
 
   bool get hasPreviousImage =>
-      currentImageModel.value.imageIndex > _imagesService.firstAvailableImageIndex;
+      currentImageModelListenable.value.imageIndex > _imagesService.firstAvailableImageIndex;
   bool get hasNextImage =>
-      currentImageModel.value.imageIndex < _imagesService.lastAvailableImageIndex;
+      currentImageModelListenable.value.imageIndex < _imagesService.lastAvailableImageIndex;
 
   static ImageCarouselViewModel get locate => Locator.locate();
 }

lib/l10n/generated/intl/messages_en.dart

@@ -27,6 +27,8 @@ class MessageLookup extends MessageLookupByLibrary {
         "imageCarousel": MessageLookupByLibrary.simpleMessage("Image carousel"),
         "imageDetails": MessageLookupByLibrary.simpleMessage(
             "Lorem ipsum dolor sit amet. A odio aliquam est sunt explicabo cum galisum asperiores qui voluptas tempora qui aliquid similique. Ut quam laborum ex nostrum recusandae ab sunt ratione quo tempore corporis 33 voluptas nulla aut obcaecati perspiciatis.\n\nAd eveniet exercitationem ad odit quidem aut omnis corporis ea nulla illum qui quisquam temporibus? Est obcaecati similique et quisquam unde ea impedit mollitia ea accusamus natus hic doloribus quis! Et dolorem rerum id doloribus sint ea porro quia ut reprehenderit ratione?"),
+        "noInternetMessage": MessageLookupByLibrary.simpleMessage(
+            "Are you sure that you\'re connected to the internet?"),
         "somethingWentWrong":
             MessageLookupByLibrary.simpleMessage("Something went wrong"),
         "startLoadingPrompt":

lib/l10n/generated/l10n.dart

@@ -109,6 +109,16 @@ class Strings {
       args: [],
     );
   }
+
+  /// `Are you sure that you're connected to the internet?`
+  String get noInternetMessage {
+    return Intl.message(
+      'Are you sure that you\'re connected to the internet?',
+      name: 'noInternetMessage',
+      desc: '',
+      args: [],
+    );
+  }
 }
 
 class AppLocalizationDelegate extends LocalizationsDelegate<Strings> {

lib/l10n/intl_en.arb

@@ -8,5 +8,7 @@
   "startLoadingPrompt": "Press me to start loading",
 
   "imageCarousel": "Image carousel",
-  "imageDetails": "Lorem ipsum dolor sit amet. A odio aliquam est sunt explicabo cum galisum asperiores qui voluptas tempora qui aliquid similique. Ut quam laborum ex nostrum recusandae ab sunt ratione quo tempore corporis 33 voluptas nulla aut obcaecati perspiciatis.\n\nAd eveniet exercitationem ad odit quidem aut omnis corporis ea nulla illum qui quisquam temporibus? Est obcaecati similique et quisquam unde ea impedit mollitia ea accusamus natus hic doloribus quis! Et dolorem rerum id doloribus sint ea porro quia ut reprehenderit ratione?"
+  "imageDetails": "Lorem ipsum dolor sit amet. A odio aliquam est sunt explicabo cum galisum asperiores qui voluptas tempora qui aliquid similique. Ut quam laborum ex nostrum recusandae ab sunt ratione quo tempore corporis 33 voluptas nulla aut obcaecati perspiciatis.\n\nAd eveniet exercitationem ad odit quidem aut omnis corporis ea nulla illum qui quisquam temporibus? Est obcaecati similique et quisquam unde ea impedit mollitia ea accusamus natus hic doloribus quis! Et dolorem rerum id doloribus sint ea porro quia ut reprehenderit ratione?",
+
+  "noInternetMessage": "Are you sure that you're connected to the internet?"
 }

lib/locator.dart

@@ -3,18 +3,18 @@ import 'dart:async';
 import 'package:connectivity_plus/connectivity_plus.dart';
 import 'package:get_it/get_it.dart';
 import 'package:internet_connection_checker/internet_connection_checker.dart';
-import 'package:mc_gallery/features/core/abstracts/router/app_router.dart';
-import 'package:mc_gallery/features/core/services/logging_service.dart';
-import 'package:mc_gallery/features/core/services/navigation_service.dart';
-import 'package:mc_gallery/features/home/api/unsplash_images_api.dart';
-import 'package:mc_gallery/features/home/services/image_cache_manager_service.dart';
-import 'package:mc_gallery/features/home/services/images_service.dart';
-import 'package:mc_gallery/features/home/views/gallery/gallery_view_model.dart';
-import 'package:mc_gallery/features/home/views/image_carousel/image_carousel_view_model.dart';
 
+import 'features/core/abstracts/router/app_router.dart';
 import 'features/core/services/app_lifecycle_service.dart';
-import 'features/core/services/connection_service.dart';
+import 'features/core/services/connections_service.dart';
+import 'features/core/services/logging_service.dart';
+import 'features/core/services/navigation_service.dart';
 import 'features/core/services/overlay_service.dart';
+import 'features/home/api/unsplash_images_api.dart';
+import 'features/home/services/image_cache_manager_service.dart';
+import 'features/home/services/images_service.dart';
+import 'features/home/views/gallery/gallery_view_model.dart';
+import 'features/home/views/image_carousel/image_carousel_view_model.dart';
 
 GetIt get locate => Locator.instance();
 
@@ -58,37 +58,48 @@ class Locator {
     );
   }
 
-  static FutureOr<void> _registerServices(GetIt it) {
+  static FutureOr<void> _registerServices(GetIt it) async {
     it.registerLazySingleton(
       () => NavigationService(
         mcgRouter: McgRouter.locate,
       ),
     );
+
     it.registerFactory(
       () => LoggingService(),
     );
-    it.registerLazySingleton(
-      () => ConnectionService(
+
+    it.registerSingleton<ConnectionsService>(
+      ConnectionsService(
         connectivity: Connectivity(),
         internetConnectionChecker: InternetConnectionChecker(),
+        loggingService: LoggingService.locate,
       ),
+      signalsReady: true,
+      dispose: (final param) async => await param.dispose(),
     );
+    await it.isReady<ConnectionsService>();
+
     it.registerLazySingleton(
       () => OverlayService(
         loggingService: LoggingService.locate,
       ),
       dispose: (param) => param.dispose(),
     );
-    instance().registerSingleton<AppLifecycleService>(
+
+    it.registerSingleton<AppLifecycleService>(
       AppLifecycleService(
         loggingService: LoggingService.locate,
       ),
-      dispose: (param) async => await param.dispose(),
+      dispose: (final param) async => await param.dispose(),
     );
-    it.registerSingleton(
+
+    it.registerSingleton<ImagesService>(
       ImagesService(imagesApi: UnsplashImagesApi.locate, loggingService: LoggingService.locate),
       signalsReady: true,
     );
+    await it.isReady<ImagesService>();
+
     it.registerSingleton(
       ImageCacheManagerService(
         appLifecycleService: AppLifecycleService.locate,

pubspec.lock

@@ -43,6 +43,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "2.9.0"
+  auto_size_text:
+    dependency: "direct main"
+    description:
+      name: auto_size_text
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "3.0.0"
   boolean_selector:
     dependency: transitive
     description:
@@ -71,6 +78,13 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.0.2"
+  carousel_slider:
+    dependency: "direct main"
+    description:
+      name: carousel_slider
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.2.1"
   characters:
     dependency: transitive
     description:
@@ -545,7 +559,7 @@ packages:
       name: talker
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.1.0+1"
+    version: "2.2.0"
   talker_dio_logger:
     dependency: "direct main"
     description:
@@ -559,7 +573,7 @@ packages:
       name: talker_logger
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "2.1.0"
+    version: "2.2.0"
   term_glyph:
     dependency: transitive
     description:

pubspec.yaml

@@ -32,9 +32,11 @@ dependencies:
 
   # Util frontend
   flutter_markdown: ^0.6.13
+  auto_size_text: ^3.0.0
+  carousel_slider: ^4.2.1
 
   # Logging
-  talker: ^2.1.0+1
+  talker: ^2.2.0
   talker_dio_logger: ^1.0.0
 
   # Assets