v0.2.28 (#65 )

* bumped version. * fixed comments cubit and story tile. * cancel subscription on error.
v0.2.27 (#64 )
2025-08-06 18:24:42 +08:00 · 2022-07-02 01:14:40 -07:00 · 2022-06-30 18:32:11 -07:00
23 changed files with 568 additions and 103 deletions
--- a/assets/screenshots/05.png
+++ b/assets/screenshots/05.png
--- a/assets/screenshots/12.png
+++ b/assets/screenshots/12.png
--- a/fastlane/metadata/android/en-US/changelogs/69.txt
+++ b/fastlane/metadata/android/en-US/changelogs/69.txt
@ -0,0 +1,3 @@
+- Lazy loading.
+- Offline mode now includes web pages.
+- You can now sort comments in story screen.
--- a/fastlane/metadata/android/en-US/changelogs/70.txt
+++ b/fastlane/metadata/android/en-US/changelogs/70.txt
@ -0,0 +1,3 @@
+- Lazy loading.
+- Offline mode now includes web pages.
+- You can now sort comments in story screen.
--- a/fastlane/metadata/android/en-US/images/phoneScreenshots/05.png
+++ b/fastlane/metadata/android/en-US/images/phoneScreenshots/05.png
--- a/fastlane/metadata/android/en-US/images/phoneScreenshots/12.png
+++ b/fastlane/metadata/android/en-US/images/phoneScreenshots/12.png
--- a/ios/Runner.xcodeproj/project.pbxproj
+++ b/ios/Runner.xcodeproj/project.pbxproj
@ -568,7 +568,7 @@
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2;
+				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = QMWX3X2NF7;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@ -577,7 +577,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 0.2.26;
+				MARKETING_VERSION = 0.2.28;
 				PRODUCT_BUNDLE_IDENTIFIER = com.jiaqi.hacki;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
@ -705,7 +705,7 @@
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2;
+				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = QMWX3X2NF7;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@ -714,7 +714,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 0.2.26;
+				MARKETING_VERSION = 0.2.28;
 				PRODUCT_BUNDLE_IDENTIFIER = com.jiaqi.hacki;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
@ -736,7 +736,7 @@
 				CODE_SIGN_ENTITLEMENTS = Runner/Runner.entitlements;
 				CODE_SIGN_IDENTITY = "Apple Development";
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 2;
+				CURRENT_PROJECT_VERSION = 1;
 				DEVELOPMENT_TEAM = QMWX3X2NF7;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = Runner/Info.plist;
@ -745,7 +745,7 @@
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 0.2.26;
+				MARKETING_VERSION = 0.2.28;
 				PRODUCT_BUNDLE_IDENTIFIER = com.jiaqi.hacki;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
--- a/lib/cubits/comments/comments_cubit.dart
+++ b/lib/cubits/comments/comments_cubit.dart
@ -11,6 +11,7 @@ import 'package:hacki/models/models.dart';
 import 'package:hacki/repositories/repositories.dart';
 import 'package:hacki/screens/screens.dart';
 import 'package:hacki/services/services.dart';
+import 'package:logger/logger.dart';

 part 'comments_state.dart';

@ -21,8 +22,11 @@ class CommentsCubit extends Cubit<CommentsState> {
    OfflineRepository? offlineRepository,
    StoriesRepository? storiesRepository,
    SembastRepository? sembastRepository,
+    Logger? logger,
    required bool offlineReading,
    required Item item,
+    required FetchMode defaultFetchMode,
+    required CommentsOrder defaultCommentsOrder,
  })  : _collapseCache = collapseCache,
        _commentCache = commentCache ?? locator.get<CommentCache>(),
        _offlineRepository =
@ -31,15 +35,32 @@ class CommentsCubit extends Cubit<CommentsState> {
            storiesRepository ?? locator.get<StoriesRepository>(),
        _sembastRepository =
            sembastRepository ?? locator.get<SembastRepository>(),
-        super(CommentsState.init(offlineReading: offlineReading, item: item));
+        _logger = logger ?? locator.get<Logger>(),
+        super(
+          CommentsState.init(
+            offlineReading: offlineReading,
+            item: item,
+            fetchMode: defaultFetchMode,
+            order: defaultCommentsOrder,
+          ),
+        );

  final CollapseCache _collapseCache;
  final CommentCache _commentCache;
  final OfflineRepository _offlineRepository;
  final StoriesRepository _storiesRepository;
  final SembastRepository _sembastRepository;
+  final Logger _logger;
+
+  /// The [StreamSubscription] for stream (both lazy or eager)
+  /// fetching comments posted directly to the story.
  StreamSubscription<Comment>? _streamSubscription;

+  /// The map of [StreamSubscription] for streams
+  /// fetching comments lazily. [int] is the id of parent comment.
+  final Map<int, StreamSubscription<Comment>> _streamSubscriptions =
+      <int, StreamSubscription<Comment>>{};
+
  static const int _pageSize = 20;

  @override
@ -64,7 +85,7 @@ class CommentsCubit extends Cubit<CommentsState> {
      );

      _streamSubscription = _storiesRepository
-          .fetchCommentsStream(
+          .fetchAllCommentsRecursivelyStream(
            ids: targetParents!.last.kids,
            level: targetParents.last.level + 1,
          )
@ -74,7 +95,13 @@ class CommentsCubit extends Cubit<CommentsState> {
      return;
    }

-    emit(state.copyWith(status: CommentsStatus.loading));
+    emit(
+      state.copyWith(
+        status: CommentsStatus.loading,
+        comments: <Comment>[],
+        currentPage: 0,
+      ),
+    );

    final Item item = state.item;
    final Item updatedItem = state.offlineReading
@ -90,13 +117,26 @@ class CommentsCubit extends Cubit<CommentsState> {
          .listen(_onCommentFetched)
        ..onDone(_onDone);
    } else {
-      _streamSubscription = _storiesRepository
-          .fetchCommentsStream(
-            ids: kids,
-            getFromCache: useCommentCache ? _commentCache.getComment : null,
-          )
-          .listen(_onCommentFetched)
-        ..onDone(_onDone);
+      switch (state.fetchMode) {
+        case FetchMode.lazy:
+          _streamSubscription = _storiesRepository
+              .fetchCommentsStream(
+                ids: kids,
+                getFromCache: useCommentCache ? _commentCache.getComment : null,
+              )
+              .listen(_onCommentFetched)
+            ..onDone(_onDone);
+          break;
+        case FetchMode.eager:
+          _streamSubscription = _storiesRepository
+              .fetchAllCommentsRecursivelyStream(
+                ids: kids,
+                getFromCache: useCommentCache ? _commentCache.getComment : null,
+              )
+              .listen(_onCommentFetched)
+            ..onDone(_onDone);
+          break;
+      }
    }
  }

@ -110,26 +150,47 @@ class CommentsCubit extends Cubit<CommentsState> {
      return;
    }

-    _collapseCache.resetCollapsedComments();
-
    emit(
      state.copyWith(
        status: CommentsStatus.loading,
-        comments: <Comment>[],
      ),
    );

+    _collapseCache.resetCollapsedComments();
+
    await _streamSubscription?.cancel();
+    for (final int id in _streamSubscriptions.keys) {
+      await _streamSubscriptions[id]?.cancel();
+    }
+    _streamSubscriptions.clear();
+
+    emit(
+      state.copyWith(
+        comments: <Comment>[],
+        currentPage: 0,
+      ),
+    );

    final Item item = state.item;
    final Item updatedItem =
        await _storiesRepository.fetchItemBy(id: item.id) ?? item;
    final List<int> kids = sortKids(updatedItem.kids);

-    _streamSubscription = _storiesRepository
-        .fetchCommentsStream(ids: kids)
-        .listen(_onCommentFetched)
-      ..onDone(_onDone);
+    if (state.fetchMode == FetchMode.lazy) {
+      _streamSubscription = _storiesRepository
+          .fetchCommentsStream(
+            ids: kids,
+          )
+          .listen(_onCommentFetched)
+        ..onDone(_onDone);
+    } else {
+      _streamSubscription = _storiesRepository
+          .fetchAllCommentsRecursivelyStream(
+            ids: kids,
+          )
+          .listen(_onCommentFetched)
+        ..onDone(_onDone);
+    }

    emit(
      state.copyWith(
@ -144,17 +205,67 @@ class CommentsCubit extends Cubit<CommentsState> {
    emit(
      state.copyWith(
        onlyShowTargetComment: false,
-        comments: <Comment>[],
        item: story,
      ),
    );
    init();
  }

-  void loadMore() {
-    if (_streamSubscription != null) {
-      emit(state.copyWith(status: CommentsStatus.loading));
-      _streamSubscription?.resume();
+  /// [comment] is only used for lazy fetching.
+  void loadMore({Comment? comment}) {
+    switch (state.fetchMode) {
+      case FetchMode.lazy:
+        if (comment == null) return;
+        if (_streamSubscriptions.containsKey(comment.id)) return;
+
+        final int level = comment.level + 1;
+        int offset = 0;
+
+        /// Ignoring because the subscription will be cancelled in close()
+        // ignore: cancel_subscriptions
+        final StreamSubscription<Comment> streamSubscription =
+            _storiesRepository
+                .fetchCommentsStream(ids: comment.kids)
+                .listen((Comment cmt) {
+          _collapseCache.addKid(cmt.id, to: cmt.parent);
+          _commentCache.cacheComment(cmt);
+          _sembastRepository.cacheComment(cmt);
+
+          final List<LinkifyElement> elements = _linkify(
+            cmt.text,
+          );
+
+          final BuildableComment buildableComment =
+              BuildableComment.fromComment(cmt, elements: elements);
+
+          emit(
+            state.copyWith(
+              comments: <Comment>[...state.comments]..insert(
+                  state.comments.indexOf(comment) + offset + 1,
+                  buildableComment.copyWith(level: level),
+                ),
+            ),
+          );
+          offset++;
+        })
+              ..onDone(() {
+                _streamSubscriptions[comment.id]?.cancel();
+                _streamSubscriptions.remove(comment.id);
+              })
+              ..onError((dynamic error) {
+                _logger.e(error);
+                _streamSubscriptions[comment.id]?.cancel();
+                _streamSubscriptions.remove(comment.id);
+              });
+
+        _streamSubscriptions[comment.id] = streamSubscription;
+        break;
+      case FetchMode.eager:
+        if (_streamSubscription != null) {
+          emit(state.copyWith(status: CommentsStatus.loading));
+          _streamSubscription?.resume();
+        }
+        break;
    }
  }

@ -181,10 +292,29 @@ class CommentsCubit extends Cubit<CommentsState> {
  }

  void onOrderChanged(CommentsOrder? order) {
-    HapticFeedback.selectionClick();
    if (order == null) return;
+    if (state.order == order) return;
+    HapticFeedback.selectionClick();
    _streamSubscription?.cancel();
-    emit(state.copyWith(order: order, comments: <Comment>[]));
+    for (final StreamSubscription<Comment> s in _streamSubscriptions.values) {
+      s.cancel();
+    }
+    _streamSubscriptions.clear();
+    emit(state.copyWith(order: order));
+    init(useCommentCache: true);
+  }
+
+  void onFetchModeChanged(FetchMode? fetchMode) {
+    if (fetchMode == null) return;
+    if (state.fetchMode == fetchMode) return;
+    _collapseCache.resetCollapsedComments();
+    HapticFeedback.selectionClick();
+    _streamSubscription?.cancel();
+    for (final StreamSubscription<Comment> s in _streamSubscriptions.values) {
+      s.cancel();
+    }
+    _streamSubscriptions.clear();
+    emit(state.copyWith(fetchMode: fetchMode));
    init(useCommentCache: true);
  }

@ -229,21 +359,24 @@ class CommentsCubit extends Cubit<CommentsState> {

      emit(state.copyWith(comments: updatedComments));

-      if (updatedComments.length >= _pageSize + _pageSize * state.currentPage &&
-          updatedComments.length <=
-              _pageSize * 2 + _pageSize * state.currentPage) {
-        final bool isHidden = _collapseCache.isHidden(comment.id);
+      if (state.fetchMode == FetchMode.eager) {
+        if (updatedComments.length >=
+                _pageSize + _pageSize * state.currentPage &&
+            updatedComments.length <=
+                _pageSize * 2 + _pageSize * state.currentPage) {
+          final bool isHidden = _collapseCache.isHidden(comment.id);

-        if (!isHidden) {
-          _streamSubscription?.pause();
+          if (!isHidden) {
+            _streamSubscription?.pause();
+          }
+
+          emit(
+            state.copyWith(
+              currentPage: state.currentPage + 1,
+              status: CommentsStatus.loaded,
+            ),
+          );
        }
-
-        emit(
-          state.copyWith(
-            currentPage: state.currentPage + 1,
-            status: CommentsStatus.loaded,
-          ),
-        );
      }
    }
  }
@ -276,6 +409,9 @@ class CommentsCubit extends Cubit<CommentsState> {
  @override
  Future<void> close() async {
    await _streamSubscription?.cancel();
+    for (final StreamSubscription<Comment> s in _streamSubscriptions.values) {
+      await s.cancel();
+    }
    await super.close();
  }
 }
--- a/lib/cubits/comments/comments_state.dart
+++ b/lib/cubits/comments/comments_state.dart
@ -14,6 +14,11 @@ enum CommentsOrder {
  oldestFirst,
 }

+enum FetchMode {
+  lazy,
+  eager,
+}
+
 class CommentsState extends Equatable {
  const CommentsState({
    required this.item,
@ -21,6 +26,7 @@ class CommentsState extends Equatable {
    required this.status,
    required this.fetchParentStatus,
    required this.order,
+    required this.fetchMode,
    required this.onlyShowTargetComment,
    required this.offlineReading,
    required this.currentPage,
@ -29,10 +35,11 @@ class CommentsState extends Equatable {
  CommentsState.init({
    required this.offlineReading,
    required this.item,
+    required this.fetchMode,
+    required this.order,
  })  : comments = <Comment>[],
        status = CommentsStatus.init,
        fetchParentStatus = CommentsStatus.init,
-        order = CommentsOrder.natural,
        onlyShowTargetComment = false,
        currentPage = 0;

@ -41,6 +48,7 @@ class CommentsState extends Equatable {
  final CommentsStatus status;
  final CommentsStatus fetchParentStatus;
  final CommentsOrder order;
+  final FetchMode fetchMode;
  final bool onlyShowTargetComment;
  final bool offlineReading;
  final int currentPage;
@ -51,6 +59,7 @@ class CommentsState extends Equatable {
    CommentsStatus? status,
    CommentsStatus? fetchParentStatus,
    CommentsOrder? order,
+    FetchMode? fetchMode,
    bool? onlyShowTargetComment,
    bool? offlineReading,
    int? currentPage,
@ -61,6 +70,7 @@ class CommentsState extends Equatable {
      fetchParentStatus: fetchParentStatus ?? this.fetchParentStatus,
      status: status ?? this.status,
      order: order ?? this.order,
+      fetchMode: fetchMode ?? this.fetchMode,
      onlyShowTargetComment:
          onlyShowTargetComment ?? this.onlyShowTargetComment,
      offlineReading: offlineReading ?? this.offlineReading,
@ -68,6 +78,8 @@ class CommentsState extends Equatable {
    );
  }

+  Set<int> get commentIds => comments.map((Comment e) => e.id).toSet();
+
  @override
  List<Object?> get props => <Object?>[
        item,
@ -75,6 +87,7 @@ class CommentsState extends Equatable {
        status,
        fetchParentStatus,
        order,
+        fetchMode,
        onlyShowTargetComment,
        offlineReading,
        currentPage,
--- a/lib/cubits/preference/preference_cubit.dart
+++ b/lib/cubits/preference/preference_cubit.dart
@ -1,6 +1,7 @@
 import 'package:bloc/bloc.dart';
 import 'package:equatable/equatable.dart';
 import 'package:hacki/config/locator.dart';
+import 'package:hacki/cubits/comments/comments_cubit.dart';
 import 'package:hacki/repositories/repositories.dart';

 part 'preference_state.dart';
@ -33,6 +34,10 @@ class PreferenceCubit extends Cubit<PreferenceState> {
        .then((bool value) => emit(state.copyWith(markReadStories: value)));
    _preferenceRepository.shouldShowMetadata
        .then((bool value) => emit(state.copyWith(showMetadata: value)));
+    _preferenceRepository.fetchMode
+        .then((FetchMode value) => emit(state.copyWith(fetchMode: value)));
+    _preferenceRepository.commentsOrder
+        .then((CommentsOrder value) => emit(state.copyWith(order: value)));
  }

  void toggleNotificationMode() {
@ -74,4 +79,16 @@ class PreferenceCubit extends Cubit<PreferenceState> {
    emit(state.copyWith(showMetadata: !state.showMetadata));
    _preferenceRepository.toggleMetadataMode();
  }
+
+  void selectFetchMode(FetchMode? fetchMode) {
+    if (fetchMode == null || state.fetchMode == fetchMode) return;
+    emit(state.copyWith(fetchMode: fetchMode));
+    _preferenceRepository.selectFetchMode(fetchMode);
+  }
+
+  void selectCommentsOrder(CommentsOrder? order) {
+    if (order == null || state.order == order) return;
+    emit(state.copyWith(order: order));
+    _preferenceRepository.selectCommentsOrder(order);
+  }
 }
--- a/lib/cubits/preference/preference_state.dart
+++ b/lib/cubits/preference/preference_state.dart
@ -10,6 +10,8 @@ class PreferenceState extends Equatable {
    required this.useReader,
    required this.markReadStories,
    required this.showMetadata,
+    required this.fetchMode,
+    required this.order,
  });

  const PreferenceState.init()
@ -20,7 +22,9 @@ class PreferenceState extends Equatable {
        useTrueDark = false,
        useReader = false,
        markReadStories = false,
-        showMetadata = false;
+        showMetadata = false,
+        fetchMode = FetchMode.eager,
+        order = CommentsOrder.natural;

  final bool showNotification;
  final bool showComplexStoryTile;
@ -30,6 +34,8 @@ class PreferenceState extends Equatable {
  final bool useReader;
  final bool markReadStories;
  final bool showMetadata;
+  final FetchMode fetchMode;
+  final CommentsOrder order;

  PreferenceState copyWith({
    bool? showNotification,
@ -40,6 +46,8 @@ class PreferenceState extends Equatable {
    bool? useReader,
    bool? markReadStories,
    bool? showMetadata,
+    FetchMode? fetchMode,
+    CommentsOrder? order,
  }) {
    return PreferenceState(
      showNotification: showNotification ?? this.showNotification,
@ -50,6 +58,8 @@ class PreferenceState extends Equatable {
      useReader: useReader ?? this.useReader,
      markReadStories: markReadStories ?? this.markReadStories,
      showMetadata: showMetadata ?? this.showMetadata,
+      fetchMode: fetchMode ?? this.fetchMode,
+      order: order ?? this.order,
    );
  }

@ -63,5 +73,7 @@ class PreferenceState extends Equatable {
        useReader,
        markReadStories,
        showMetadata,
+        fetchMode,
+        order,
      ];
 }
--- a/lib/extensions/context_extension.dart
+++ b/lib/extensions/context_extension.dart
@ -1,3 +1,5 @@
+import 'dart:math';
+
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';

@ -9,4 +11,48 @@ extension TryReadContext on BuildContext {
      return null;
    }
  }
+
+  Rect? get rect {
+    final RenderBox? box = findRenderObject() as RenderBox?;
+    final Rect? rect =
+        box == null ? null : box.localToGlobal(Offset.zero) & box.size;
+    return rect;
+  }
+
+  static double _screenWidth = 0;
+  static double _storyTileHeight = 0;
+  static int _storyTileMaxLines = 4;
+  static const double _screenWidthLowerBound = 428,
+      _screenWidthUpperBound = 850,
+      _picHeightLowerBound = 110,
+      _picHeightUpperBound = 128,
+      _smallPicHeight = 100,
+      _picHeightFactor = 0.3;
+
+  double get storyTileHeight {
+    final double screenWidth =
+        min(MediaQuery.of(this).size.height, MediaQuery.of(this).size.width);
+
+    if (screenWidth == _screenWidth) {
+      return _storyTileHeight;
+    } else {
+      _screenWidth = screenWidth;
+    }
+
+    final bool showSmallerPreviewPic = screenWidth > _screenWidthLowerBound &&
+        screenWidth < _screenWidthUpperBound;
+    final double height = showSmallerPreviewPic
+        ? _smallPicHeight
+        : (screenWidth * _picHeightFactor)
+            .clamp(_picHeightLowerBound, _picHeightUpperBound);
+    final int maxLines = height == _smallPicHeight ? 3 : 4;
+    _storyTileMaxLines = maxLines;
+
+    _storyTileHeight = height;
+    return height;
+  }
+
+  int get storyTileMaxLines {
+    return _storyTileMaxLines;
+  }
 }
--- a/lib/models/story.dart
+++ b/lib/models/story.dart
@ -1,5 +1,3 @@
-import 'dart:convert';
-
 import 'package:hacki/models/item.dart';

 enum StoryType {
@ -113,9 +111,10 @@ class Story extends Item {

  @override
  String toString() {
-    final String prettyString =
-        const JsonEncoder.withIndent('  ').convert(this);
-    return 'Story $prettyString';
+    // final String prettyString =
+    //     const JsonEncoder.withIndent('  ').convert(this);
+    // return 'Story $prettyString';
+    return 'Story $id';
  }

  @override
--- a/lib/repositories/preference_repository.dart
+++ b/lib/repositories/preference_repository.dart
@ -3,6 +3,7 @@ import 'dart:io';

 import 'package:flutter_secure_storage/flutter_secure_storage.dart';
 import 'package:hacki/config/locator.dart';
+import 'package:hacki/cubits/comments/comments_cubit.dart';
 import 'package:logger/logger.dart';
 import 'package:shared_preferences/shared_preferences.dart';
 import 'package:synced_shared_preferences/synced_shared_preferences.dart';
@ -42,6 +43,8 @@ class PreferenceRepository {
  static const String _navigationModeKey = 'navigationMode';
  static const String _eyeCandyModeKey = 'eyeCandyMode';
  static const String _markReadStoriesModeKey = 'markReadStoriesMode';
+  static const String _fetchModeKey = 'fetchMode';
+  static const String _commentsOrderKey = 'commentsOrder';

  static const bool _notificationModeDefaultValue = true;
  static const bool _displayModeDefaultValue = true;
@ -53,6 +56,8 @@ class PreferenceRepository {
  static const bool _markReadStoriesModeDefaultValue = true;
  static const bool _isFirstLaunchKeyDefaultValue = true;
  static const bool _metadataModeDefaultValue = true;
+  static final int _fetchModeDefaultValue = FetchMode.eager.index;
+  static final int _commentsOrderDefaultValue = CommentsOrder.natural.index;

  final SyncedSharedPreferences _syncedPrefs;
  final Future<SharedPreferences> _prefs;
@ -120,6 +125,17 @@ class PreferenceRepository {
            _markReadStoriesModeDefaultValue,
      );

+  Future<FetchMode> get fetchMode async => _prefs.then(
+        (SharedPreferences prefs) => FetchMode.values
+            .elementAt(prefs.getInt(_fetchModeKey) ?? _fetchModeDefaultValue),
+      );
+
+  Future<CommentsOrder> get commentsOrder async => _prefs.then(
+        (SharedPreferences prefs) => CommentsOrder.values.elementAt(
+          prefs.getInt(_commentsOrderKey) ?? _commentsOrderDefaultValue,
+        ),
+      );
+
  Future<bool> hasPushed(int commentId) async =>
      _prefs.then((SharedPreferences prefs) {
        final bool? val = prefs.getBool(_getPushNotificationKey(commentId));
@ -237,6 +253,18 @@ class PreferenceRepository {
    await prefs.setBool(_metadataModeKey, !currentMode);
  }

+  Future<void> selectFetchMode(FetchMode fetchMode) async {
+    final SharedPreferences prefs = await _prefs;
+    final int index = fetchMode.index;
+    await prefs.setInt(_fetchModeKey, index);
+  }
+
+  Future<void> selectCommentsOrder(CommentsOrder order) async {
+    final SharedPreferences prefs = await _prefs;
+    final int index = order.index;
+    await prefs.setInt(_commentsOrderKey, index);
+  }
+
  //#region fav

  Future<List<int>> favList({required String of}) async {
--- a/lib/repositories/stories_repository.dart
+++ b/lib/repositories/stories_repository.dart
@ -68,8 +68,33 @@ class StoriesRepository {

      if (comment != null) {
        yield comment;
+      }
+    }
+    return;
+  }

-        yield* fetchCommentsStream(
+  Stream<Comment> fetchAllCommentsRecursivelyStream({
+    required List<int> ids,
+    int level = 0,
+    Comment? Function(int)? getFromCache,
+  }) async* {
+    for (final int id in ids) {
+      Comment? comment = getFromCache?.call(id)?.copyWith(level: level);
+
+      comment ??= await _firebaseClient
+          .get('${_baseUrl}item/$id.json')
+          .then((dynamic json) => _parseJson(json as Map<String, dynamic>?))
+          .then((Map<String, dynamic>? json) async {
+        if (json == null) return null;
+
+        final Comment comment = Comment.fromJson(json, level: level);
+        return comment;
+      });
+
+      if (comment != null) {
+        yield comment;
+
+        yield* fetchAllCommentsRecursivelyStream(
          ids: comment.kids,
          level: level + 1,
          getFromCache: getFromCache,
--- a/lib/screens/home_screen.dart
+++ b/lib/screens/home_screen.dart
@ -452,7 +452,10 @@ class _HomeScreenState extends State<HomeScreen>
      locator.get<StoriesRepository>().fetchItemBy(id: id).then((Item? item) {
        if (mounted) {
          if (item != null) {
-            goToItemScreen(args: ItemScreenArgs(item: item));
+            goToItemScreen(
+              args: ItemScreenArgs(item: item),
+              forceNewScreen: true,
+            );
          }
        }
      });
--- a/lib/screens/item/item_screen.dart
+++ b/lib/screens/item/item_screen.dart
@ -86,6 +86,10 @@ class ItemScreen extends StatefulWidget {
                    context.read<StoriesBloc>().state.offlineReading,
                item: args.item,
                collapseCache: context.read<CollapseCache>(),
+                defaultFetchMode:
+                    context.read<PreferenceCubit>().state.fetchMode,
+                defaultCommentsOrder:
+                    context.read<PreferenceCubit>().state.order,
              )..init(
                  onlyShowTargetComment: args.onlyShowTargetComment,
                  targetParents: args.targetComments,
@ -128,6 +132,10 @@ class ItemScreen extends StatefulWidget {
                    context.read<StoriesBloc>().state.offlineReading,
                item: args.item,
                collapseCache: context.read<CollapseCache>(),
+                defaultFetchMode:
+                    context.read<PreferenceCubit>().state.fetchMode,
+                defaultCommentsOrder:
+                    context.read<PreferenceCubit>().state.order,
              )..init(
                  onlyShowTargetComment: args.onlyShowTargetComment,
                  targetParents: args.targetComments,
@ -307,7 +315,13 @@ class _ItemScreenState extends State<ItemScreen> {
                    }
                  }
                },
-                onLoading: context.read<CommentsCubit>().loadMore,
+                onLoading: () {
+                  if (state.fetchMode == FetchMode.eager) {
+                    context.read<CommentsCubit>().loadMore();
+                  } else {
+                    refreshController.loadComplete();
+                  }
+                },
                child: ListView.builder(
                  primary: false,
                  itemCount: state.comments.length + 2,
@ -349,7 +363,8 @@ class _ItemScreenState extends State<ItemScreen> {
                                  icon: Icons.message,
                                ),
                                SlidableAction(
-                                  onPressed: (_) => onMoreTapped(state.item),
+                                  onPressed: (BuildContext context) =>
+                                      onMoreTapped(state.item, context.rect),
                                  backgroundColor: Palette.orange,
                                  foregroundColor: Palette.white,
                                  icon: Icons.more_horiz,
@ -486,6 +501,9 @@ class _ItemScreenState extends State<ItemScreen> {
                                  ),
                                  Text(
                                    '''${state.item.score} karma, ${state.item.descendants} comment${state.item.descendants > 1 ? 's' : ''}''',
+                                    style: const TextStyle(
+                                      fontSize: TextDimens.pt12,
+                                    ),
                                  ),
                                ] else ...<Widget>[
                                  const SizedBox(
@ -505,10 +523,46 @@ class _ItemScreenState extends State<ItemScreen> {
                                              strokeWidth: Dimens.pt2,
                                            ),
                                          )
-                                        : const Text('View parent thread'),
+                                        : const Text(
+                                            'View parent thread',
+                                            style: TextStyle(
+                                              fontSize: TextDimens.pt12,
+                                            ),
+                                          ),
                                  ),
                                ],
                                const Spacer(),
+                                if (!state.offlineReading)
+                                  DropdownButton<FetchMode>(
+                                    value: state.fetchMode,
+                                    underline: const SizedBox.shrink(),
+                                    items: const <DropdownMenuItem<FetchMode>>[
+                                      DropdownMenuItem<FetchMode>(
+                                        value: FetchMode.lazy,
+                                        child: Text(
+                                          'Lazy',
+                                          style: TextStyle(
+                                            fontSize: TextDimens.pt12,
+                                          ),
+                                        ),
+                                      ),
+                                      DropdownMenuItem<FetchMode>(
+                                        value: FetchMode.eager,
+                                        child: Text(
+                                          'Eager',
+                                          style: TextStyle(
+                                            fontSize: TextDimens.pt12,
+                                          ),
+                                        ),
+                                      ),
+                                    ],
+                                    onChanged: context
+                                        .read<CommentsCubit>()
+                                        .onFetchModeChanged,
+                                  ),
+                                const SizedBox(
+                                  width: Dimens.pt6,
+                                ),
                                DropdownButton<CommentsOrder>(
                                  value: state.order,
                                  underline: const SizedBox.shrink(),
@ -519,7 +573,7 @@ class _ItemScreenState extends State<ItemScreen> {
                                      child: Text(
                                        'Natural',
                                        style: TextStyle(
-                                          fontSize: TextDimens.pt14,
+                                          fontSize: TextDimens.pt12,
                                        ),
                                      ),
                                    ),
@ -528,7 +582,7 @@ class _ItemScreenState extends State<ItemScreen> {
                                      child: Text(
                                        'Newest first',
                                        style: TextStyle(
-                                          fontSize: TextDimens.pt14,
+                                          fontSize: TextDimens.pt12,
                                        ),
                                      ),
                                    ),
@ -537,7 +591,7 @@ class _ItemScreenState extends State<ItemScreen> {
                                      child: Text(
                                        'Oldest first',
                                        style: TextStyle(
-                                          fontSize: TextDimens.pt14,
+                                          fontSize: TextDimens.pt12,
                                        ),
                                      ),
                                    ),
@ -595,6 +649,7 @@ class _ItemScreenState extends State<ItemScreen> {
                        myUsername:
                            authState.isLoggedIn ? authState.username : null,
                        opUsername: state.item.by,
+                        fetchMode: state.fetchMode,
                        onReplyTapped: (Comment cmt) {
                          HapticFeedback.lightImpact();
                          if (cmt.deleted || cmt.dead) {
@ -854,6 +909,7 @@ class _ItemScreenState extends State<ItemScreen> {
                                        context.read<AuthBloc>().state.username,
                                    onStoryLinkTapped: onStoryLinkTapped,
                                    actionable: false,
+                                    fetchMode: FetchMode.eager,
                                  ),
                                  const Divider(
                                    height: Dimens.zero,
@ -895,7 +951,7 @@ class _ItemScreenState extends State<ItemScreen> {
    }
  }

-  void onMoreTapped(Item item) {
+  void onMoreTapped(Item item, Rect? rect) {
    HapticFeedback.lightImpact();

    if (item.dead || item.deleted) {
@ -1104,7 +1160,7 @@ class _ItemScreenState extends State<ItemScreen> {
          case _MenuAction.downvote:
            break;
          case _MenuAction.share:
-            onShareTapped(item);
+            onShareTapped(item, rect);
            break;
          case _MenuAction.flag:
            onFlagTapped(item);
@ -1119,8 +1175,12 @@ class _ItemScreenState extends State<ItemScreen> {
    });
  }

-  void onShareTapped(Item item) =>
-      Share.share('https://news.ycombinator.com/item?id=${item.id}');
+  void onShareTapped(Item item, Rect? rect) {
+    Share.share(
+      'https://news.ycombinator.com/item?id=${item.id}',
+      sharePositionOrigin: rect,
+    );
+  }

  void onFlagTapped(Item item) {
    showDialog<bool>(
--- a/lib/screens/profile/profile_screen.dart
+++ b/lib/screens/profile/profile_screen.dart
@ -283,6 +283,122 @@ class _ProfileScreenState extends State<ProfileScreen>
                                },
                                activeColor: Palette.orange,
                              ),
+                              const SizedBox(
+                                height: Dimens.pt8,
+                              ),
+                              Flex(
+                                direction: Axis.horizontal,
+                                mainAxisAlignment: MainAxisAlignment.center,
+                                children: <Widget>[
+                                  Flexible(
+                                    child: Row(
+                                      children: const <Widget>[
+                                        SizedBox(
+                                          width: Dimens.pt16,
+                                        ),
+                                        Text('Default fetch mode'),
+                                        Spacer(),
+                                      ],
+                                    ),
+                                  ),
+                                  Flexible(
+                                    child: Row(
+                                      children: const <Widget>[
+                                        Text('Default comments order'),
+                                        Spacer(),
+                                      ],
+                                    ),
+                                  ),
+                                ],
+                              ),
+                              Flex(
+                                direction: Axis.horizontal,
+                                mainAxisAlignment: MainAxisAlignment.center,
+                                children: <Widget>[
+                                  Flexible(
+                                    child: Row(
+                                      children: <Widget>[
+                                        const SizedBox(
+                                          width: Dimens.pt16,
+                                        ),
+                                        DropdownButton<FetchMode>(
+                                          value: preferenceState.fetchMode,
+                                          underline: const SizedBox.shrink(),
+                                          items: const <
+                                              DropdownMenuItem<FetchMode>>[
+                                            DropdownMenuItem<FetchMode>(
+                                              value: FetchMode.lazy,
+                                              child: Text(
+                                                'Lazy',
+                                                style: TextStyle(
+                                                  fontSize: TextDimens.pt16,
+                                                ),
+                                              ),
+                                            ),
+                                            DropdownMenuItem<FetchMode>(
+                                              value: FetchMode.eager,
+                                              child: Text(
+                                                'Eager',
+                                                style: TextStyle(
+                                                  fontSize: TextDimens.pt16,
+                                                ),
+                                              ),
+                                            ),
+                                          ],
+                                          onChanged: context
+                                              .read<PreferenceCubit>()
+                                              .selectFetchMode,
+                                        ),
+                                        const Spacer(),
+                                      ],
+                                    ),
+                                  ),
+                                  Flexible(
+                                    child: Row(
+                                      children: <Widget>[
+                                        DropdownButton<CommentsOrder>(
+                                          value: preferenceState.order,
+                                          underline: const SizedBox.shrink(),
+                                          items: const <
+                                              DropdownMenuItem<CommentsOrder>>[
+                                            DropdownMenuItem<CommentsOrder>(
+                                              value: CommentsOrder.natural,
+                                              child: Text(
+                                                'Natural',
+                                                style: TextStyle(
+                                                  fontSize: TextDimens.pt16,
+                                                ),
+                                              ),
+                                            ),
+                                            DropdownMenuItem<CommentsOrder>(
+                                              value: CommentsOrder.newestFirst,
+                                              child: Text(
+                                                'Newest first',
+                                                style: TextStyle(
+                                                  fontSize: TextDimens.pt16,
+                                                ),
+                                              ),
+                                            ),
+                                            DropdownMenuItem<CommentsOrder>(
+                                              value: CommentsOrder.oldestFirst,
+                                              child: Text(
+                                                'Oldest first',
+                                                style: TextStyle(
+                                                  fontSize: TextDimens.pt16,
+                                                ),
+                                              ),
+                                            ),
+                                          ],
+                                          onChanged: context
+                                              .read<PreferenceCubit>()
+                                              .selectCommentsOrder,
+                                        ),
+                                        const Spacer(),
+                                      ],
+                                    ),
+                                  ),
+                                ],
+                              ),
                              SwitchListTile(
                                title: const Text('Complex Story Tile'),
                                subtitle: const Text(
@ -410,7 +526,7 @@ class _ProfileScreenState extends State<ProfileScreen>
                                  showAboutDialog(
                                    context: context,
                                    applicationName: 'Hacki',
-                                    applicationVersion: 'v0.2.26',
+                                    applicationVersion: 'v0.2.28',
                                    applicationIcon: ClipRRect(
                                      borderRadius: const BorderRadius.all(
                                        Radius.circular(
--- a/lib/screens/widgets/comment_tile.dart
+++ b/lib/screens/widgets/comment_tile.dart
@ -17,6 +17,7 @@ class CommentTile extends StatelessWidget {
    required this.myUsername,
    required this.comment,
    required this.onStoryLinkTapped,
+    required this.fetchMode,
    this.onReplyTapped,
    this.onMoreTapped,
    this.onEditTapped,
@ -32,10 +33,11 @@ class CommentTile extends StatelessWidget {
  final int level;
  final bool actionable;
  final Function(Comment)? onReplyTapped;
-  final Function(Comment)? onMoreTapped;
+  final Function(Comment, Rect?)? onMoreTapped;
  final Function(Comment)? onEditTapped;
  final Function(Comment)? onRightMoreTapped;
  final Function(String) onStoryLinkTapped;
+  final FetchMode fetchMode;

  @override
  Widget build(BuildContext context) {
@ -88,8 +90,11 @@ class CommentTile extends StatelessWidget {
                                        icon: Icons.edit,
                                      ),
                                    SlidableAction(
-                                      onPressed: (_) =>
-                                          onMoreTapped?.call(comment),
+                                      onPressed: (BuildContext context) =>
+                                          onMoreTapped?.call(
+                                        comment,
+                                        context.rect,
+                                      ),
                                      backgroundColor: Palette.orange,
                                      foregroundColor: Palette.white,
                                      icon: Icons.more_horiz,
@ -277,6 +282,30 @@ class CommentTile extends StatelessWidget {
                                            },
                                          ),
                                  ),
+                                if (!state.collapsed &&
+                                    fetchMode == FetchMode.lazy &&
+                                    comment.kids.isNotEmpty &&
+                                    !context
+                                        .read<CommentsCubit>()
+                                        .state
+                                        .commentIds
+                                        .contains(comment.kids.first))
+                                  Center(
+                                    child: TextButton(
+                                      onPressed: () {
+                                        HapticFeedback.selectionClick();
+                                        context
+                                            .read<CommentsCubit>()
+                                            .loadMore(comment: comment);
+                                      },
+                                      child: Text(
+                                        '''Load ${comment.kids.length} ${comment.kids.length > 1 ? 'replies' : 'reply'}''',
+                                        style: const TextStyle(
+                                          fontSize: TextDimens.pt12,
+                                        ),
+                                      ),
+                                    ),
+                                  ),
                                const Divider(
                                  height: Dimens.zero,
                                ),
@ -298,7 +327,7 @@ class CommentTile extends StatelessWidget {
                      : Palette.transparent;
                  final bool isMyComment = myUsername == comment.by;

-                  Widget? wrapper = child;
+                  Widget wrapper = child;

                  if (isMyComment && level == 0) {
                    return Container(
@ -330,7 +359,7 @@ class CommentTile extends StatelessWidget {
                    );
                  }

-                  return wrapper!;
+                  return wrapper;
                },
              );
            },
--- a/lib/screens/widgets/link_preview/link_preview.dart
+++ b/lib/screens/widgets/link_preview/link_preview.dart
@ -2,6 +2,7 @@ import 'dart:async';

 import 'package:flutter/material.dart';
 import 'package:hacki/config/constants.dart';
+import 'package:hacki/extensions/extensions.dart';
 import 'package:hacki/models/models.dart';
 import 'package:hacki/screens/widgets/link_preview/link_view.dart';
 import 'package:hacki/screens/widgets/link_preview/web_analyzer.dart';
@ -199,23 +200,9 @@ class _LinkPreviewState extends State<LinkPreview> {

  @override
  Widget build(BuildContext context) {
-    const double screenWidthLowerBound = 428,
-        screenWidthUpperBound = 850,
-        picHeightLowerBound = 118,
-        picHeightUpperBound = 140,
-        smallPicHeight = 100,
-        picHeightFactor = 0.14;
-    final double screenWidth = MediaQuery.of(context).size.width;
-    final bool showSmallerPreviewPic = screenWidth > screenWidthLowerBound &&
-        screenWidth < screenWidthUpperBound;
-    final double height = showSmallerPreviewPic
-        ? smallPicHeight
-        : (MediaQuery.of(context).size.height * picHeightFactor)
-            .clamp(picHeightLowerBound, picHeightUpperBound);
-
    final Widget loadingWidget = widget.placeholderWidget ??
        Container(
-          height: height,
+          height: context.storyTileHeight,
          width: MediaQuery.of(context).size.width,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.circular(
@ -232,13 +219,13 @@ class _LinkPreviewState extends State<LinkPreview> {
    final WebInfo? info = _info as WebInfo?;
    loadedWidget = _info == null
        ? _buildLinkContainer(
-            height,
+            context.storyTileHeight,
            title: _errorTitle,
            desc: _errorBody,
            imageUri: null,
          )
        : _buildLinkContainer(
-            height,
+            context.storyTileHeight,
            title: _errorTitle,
            desc: WebAnalyzer.isNotEmpty(info!.description)
                ? info.description
--- a/lib/screens/widgets/link_preview/link_view.dart
+++ b/lib/screens/widgets/link_preview/link_view.dart
@ -147,7 +147,7 @@ class LinkView extends StatelessWidget {

  Widget _buildTitleContainer(TextStyle _titleTS, int _maxLines) {
    return Padding(
-      padding: const EdgeInsets.fromLTRB(4, 2, 3, 1),
+      padding: const EdgeInsets.fromLTRB(4, 2, 3, 0),
      child: Column(
        children: <Widget>[
          Container(
@ -168,7 +168,7 @@ class LinkView extends StatelessWidget {
    return Expanded(
      flex: 2,
      child: Padding(
-        padding: const EdgeInsets.fromLTRB(5, 3, 5, 0),
+        padding: const EdgeInsets.fromLTRB(5, 2, 5, 0),
        child: Column(
          children: <Widget>[
            if (showMetadata)
--- a/lib/screens/widgets/story_tile.dart
+++ b/lib/screens/widgets/story_tile.dart
@ -3,6 +3,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:flutter_fadein/flutter_fadein.dart';
 import 'package:hacki/blocs/blocs.dart';
 import 'package:hacki/config/constants.dart';
+import 'package:hacki/extensions/extensions.dart';
 import 'package:hacki/models/models.dart';
 import 'package:hacki/screens/widgets/widgets.dart';
 import 'package:hacki/styles/styles.dart';
@ -29,20 +30,7 @@ class StoryTile extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    if (showWebPreview) {
-      const double screenWidthLowerBound = 428,
-          screenWidthUpperBound = 850,
-          picHeightLowerBound = 118,
-          picHeightUpperBound = 140,
-          smallPicHeight = 100,
-          picHeightFactor = 0.14;
-      final double screenWidth = MediaQuery.of(context).size.width;
-      final bool showSmallerPreviewPic = screenWidth > screenWidthLowerBound &&
-          screenWidth < screenWidthUpperBound;
-      final double height = showSmallerPreviewPic
-          ? smallPicHeight
-          : (MediaQuery.of(context).size.height * picHeightFactor)
-              .clamp(picHeightLowerBound, picHeightUpperBound);
-
+      final double height = context.storyTileHeight;
      return TapDownWrapper(
        onTap: onTap,
        child: Padding(
@ -143,7 +131,7 @@ class StoryTile extends StatelessWidget {
              backgroundColor: Palette.transparent,
              borderRadius: Dimens.zero,
              removeElevation: true,
-              bodyMaxLines: height == smallPicHeight ? 3 : 4,
+              bodyMaxLines: context.storyTileMaxLines,
              errorTitle: story.title,
              titleStyle: TextStyle(
                color: hasRead
--- a/pubspec.yaml
+++ b/pubspec.yaml
@ -1,6 +1,6 @@
 name: hacki
 description: A Hacker News reader.
-version: 0.2.26+68
+version: 0.2.28+70
 publish_to: none

 environment: