From fcf9c4ed65d622bbad994c6c26ac6d9367c68059 Mon Sep 17 00:00:00 2001
From: Tommy Chow <tommyxchow@gmail.com>
Date: Fri, 20 Aug 2021 21:22:27 -0400
Subject: [PATCH] Add channel list & tweak channel card flex

---
 lib/widgets/channel_card.dart |  2 +
 lib/widgets/channel_list.dart | 69 +++++++++++++++++++++++++++++++++++
 2 files changed, 71 insertions(+)
 create mode 100644 lib/widgets/channel_list.dart

diff --git a/lib/widgets/channel_card.dart b/lib/widgets/channel_card.dart
index a7307dc8..c9f9be45 100644
--- a/lib/widgets/channel_card.dart
+++ b/lib/widgets/channel_card.dart
@@ -16,6 +16,7 @@ class ChannelCard extends StatelessWidget {
           crossAxisAlignment: CrossAxisAlignment.center,
           children: [
             Flexible(
+              flex: 1,
               child: Padding(
                 padding: EdgeInsets.all(10.0),
                 child: Image.network(
@@ -24,6 +25,7 @@ class ChannelCard extends StatelessWidget {
               ),
             ),
             Flexible(
+              flex: 2,
               child: Padding(
                 padding: EdgeInsets.all(5.0),
                 child: Column(
diff --git a/lib/widgets/channel_list.dart b/lib/widgets/channel_list.dart
new file mode 100644
index 00000000..a56a8231
--- /dev/null
+++ b/lib/widgets/channel_list.dart
@@ -0,0 +1,69 @@
+import 'dart:convert';
+
+import 'package:flutter/material.dart';
+import 'package:frosty/models/channel.dart';
+import 'package:frosty/widgets/channel_card.dart';
+import 'package:http/http.dart' as http;
+
+class ChannelList extends StatefulWidget {
+  const ChannelList({Key? key}) : super(key: key);
+
+  @override
+  _ChannelListState createState() => _ChannelListState();
+}
+
+class _ChannelListState extends State<ChannelList> {
+  var channels = <Channel>[];
+  String? cursor;
+
+  Future<void> getTopChannels({required String token}) async {
+    final url;
+    if (cursor != null) {
+      url = Uri.parse('https://api.twitch.tv/helix/streams?first=10&after=$cursor');
+    } else {
+      url = Uri.parse('https://api.twitch.tv/helix/streams?first=10');
+    }
+    final headers = {'Authorization': 'Bearer $token', 'Client-Id': const String.fromEnvironment('CLIENT_ID')};
+    final response = await http.get(url, headers: headers);
+    final decoded = jsonDecode(response.body);
+    final data = decoded['data'] as List;
+    cursor = decoded['pagination']['cursor'];
+
+    channels += data.map((channel) => Channel.fromJson(channel)).toList();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      child: FutureBuilder(
+        future: getTopChannels(token: const String.fromEnvironment('TEST_TOKEN')),
+        builder: (context, snapshot) {
+          switch (snapshot.connectionState) {
+            case ConnectionState.none:
+              // TODO: Handle this case.
+              break;
+            case ConnectionState.waiting:
+              // TODO: Handle this case.
+              break;
+            case ConnectionState.active:
+              // TODO: Handle this case.
+              break;
+            case ConnectionState.done:
+              return ListView.builder(
+                itemBuilder: (context, index) {
+                  print(index);
+                  if (index >= channels.length / 2) {
+                    print('fetching more channels...');
+                    print(channels.length);
+                    getTopChannels(token: const String.fromEnvironment('TEST_TOKEN'));
+                  }
+                  return ChannelCard(channelInfo: channels[index]);
+                },
+              );
+          }
+          return Text('loading');
+        },
+      ),
+    );
+  }
+}