loris/lib/pages/timeline/timeline.dart

import 'package:flutter/material.dart';
import 'package:localization/localization.dart';
import 'package:loris/partials/thread.dart';
import '../../business_logic/timeline/timeline.dart' as tl;
import '../../global.dart' as global;
import 'package:loris/partials/loadingbox.dart';

class Timeline extends StatefulWidget {
  const Timeline({Key? key}) : super(key: key);
  @override
  State<Timeline> createState() => TimelineState();
}

class TimelineState extends State<Timeline> {
  String? oldestId;
  final controller = ScrollController();
  List<Widget> children = [];
  bool loading = false;

  tl.TimelineType selectedTimelineType = tl.TimelineType.home;
  String selectedId = global.settings!.activeIdentity;

  @override
  void initState() {
    super.initState();
    children.add(const LoadingBox());
    fetchMore();
    controller.addListener(() {
      if (controller.position.maxScrollExtent <=
              controller.offset + 2 * MediaQuery.of(context).size.height &&
          !loading) {
        fetchMore();
      }
    });
  }

  Future fetchMore() async {
    while (loading) {
      await Future.delayed(const Duration(milliseconds: 500));
    }
    loading = true;

    final models = await tl.getTimelineFromServer(
        oldestId, selectedId, selectedTimelineType);

    if (mounted) {
      setState(() {
        children.removeWhere((element) {
          return element.runtimeType != Thread;
        });
        List<Thread> threads = [];

        for (int i = 0; i < models.length; i++) {
          threads.add(Thread(model: models[i]));
        }

        if (models.isNotEmpty) {
          oldestId = models.last.posts.last.id;
        }
        children.addAll(threads);
        children.add(
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              TextButton.icon(
                onPressed: () {
                  fetchMore();
                },
                icon: const Icon(Icons.more_horiz),
                label: Text(
                  "load-more".i18n(),
                ),
              )
            ],
          ),
        );
        children.add(const LoadingBox());
        loading = false;
      });
    }
  }

  @override
  void dispose() {
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    List<DropdownMenuItem> identities = [];
    // add identities to dropdown menu
    for (int i = 0; i < global.settings!.identities.keys.length; i++) {
      identities.add(DropdownMenuItem(
        alignment: Alignment.center,
        value: global.settings!.identities.keys.toList()[i],
        child: Text(
          global.settings!.identities.keys.toList()[i],
          style: Theme.of(context).textTheme.bodyMedium,
        ),
      ));
    }
    selectedId = global.settings!.activeIdentity;
    return Column(
      crossAxisAlignment: CrossAxisAlignment.stretch,
      children: [
        Container(
          color: Theme.of(context).colorScheme.surface,
          child: Wrap(
            alignment: WrapAlignment.spaceEvenly,
            children: [
              IconButton(
                onPressed: () {
                  reload();
                },
                icon: const Icon(Icons.refresh),
              ),
              DropdownButtonHideUnderline(
                child: DropdownButton(
                  alignment: Alignment.center,
                  borderRadius: BorderRadius.circular(8),
                  iconEnabledColor: Theme.of(context).colorScheme.onSurface,
                  value: selectedId,
                  items: identities,
                  onChanged: (dynamic value) async {
                    setState(() {
                      selectedId = value ?? global.settings!.activeIdentity;
                      global.settings!.saveActiveIdentity(selectedId);
                      reload();
                    });
                  },
                ),
              ),
              DropdownButtonHideUnderline(
                child: DropdownButton(
                  alignment: Alignment.center,
                  borderRadius: BorderRadius.circular(8),
                  iconEnabledColor: Theme.of(context).colorScheme.onSurface,
                  value: selectedTimelineType,
                  items: [
                    DropdownMenuItem(
                      alignment: Alignment.center,
                      value: tl.TimelineType.home,
                      child: RichText(
                        text: TextSpan(
                          style: Theme.of(context).textTheme.bodyMedium,
                          text: "${"home-timeline".i18n()} ",
                          children: const [
                            WidgetSpan(
                              child: Icon(Icons.home),
                            ),
                          ],
                        ),
                      ),
                    ),
                    DropdownMenuItem(
                      alignment: Alignment.center,
                      value: tl.TimelineType.local,
                      child: RichText(
                        text: TextSpan(
                          style: Theme.of(context).textTheme.bodyMedium,
                          text: "${"local-timeline".i18n()} ",
                          children: const [
                            WidgetSpan(
                              child: Icon(Icons.people),
                            )
                          ],
                        ),
                      ),
                    ),
                    DropdownMenuItem(
                      alignment: Alignment.center,
                      value: tl.TimelineType.public,
                      child: RichText(
                        text: TextSpan(
                          style: Theme.of(context).textTheme.bodyMedium,
                          text: "${"public-timeline".i18n()} ",
                          children: const [
                            WidgetSpan(
                              child: Icon(Icons.public),
                            ),
                          ],
                        ),
                      ),
                    ),
                  ],
                  onChanged: (tl.TimelineType? value) {
                    setState(() {
                      selectedTimelineType = value ?? tl.TimelineType.home;
                      reload();
                    });
                  },
                ),
              )
            ],
          ),
        ),
        Expanded(
          child: ListView.separated(
            physics: const AlwaysScrollableScrollPhysics(),
            controller: controller,
            itemBuilder: (context, index) {
              return children[index];
            },
            separatorBuilder: (context, index) {
              return const Divider(
                color: Colors.transparent,
              );
            },
            itemCount: children.length,
            padding: const EdgeInsets.fromLTRB(24, 0, 24, 64),
            addAutomaticKeepAlives: false,
          ),
        ),
      ],
    );
  }

  void reload() async {
    controller.animateTo(
      0,
      duration: const Duration(seconds: 1),
      curve: Curves.easeOut,
    );
    if (mounted) {
      setState(() {
        children = [const LoadingBox()];
        oldestId = null;
      });
    }
    await _waitForFetchMore();
    if (mounted) {
      setState(() {
        fetchMore();
      });
    }
  }

  Future<void> _waitForFetchMore() async {
    while (loading) {
      await Future.delayed(const Duration(milliseconds: 500));
    }
  }
}