1 files changed, 70 insertions, 0 deletions
diff --git a/lib/screens/albums_screen.dart b/lib/screens/albums_screen.dart
new file mode 100644
index 0000000..d376e35
--- /dev/null
+++ b/lib/screens/albums_screen.dart
@@ -0,0 +1,70 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
+import 'package:pmsna1/models/album.dart';
+import 'package:pmsna1/network/music_api.dart';
+import 'package:pmsna1/widgets/album_item.dart';
+import 'package:pmsna1/widgets/responsive.dart';
+
+import '../widgets/loading_modal_widget.dart';
+
+class AlbumsScreen extends StatefulWidget {
+  const AlbumsScreen({super.key});
+
+  @override
+  State<AlbumsScreen> createState() => _AlbumsScreenState();
+}
+
+class _AlbumsScreenState extends State<AlbumsScreen> {
+  MusicApi? musicApi;
+
+  @override
+  void initState() {
+    super.initState();
+    musicApi = MusicApi();
+  }
+
+  Widget getGridForCount(
+    int count,
+    int itemCount,
+    Widget Function(BuildContext, int) itemBuilder,
+  ) {
+    return MasonryGridView.builder(
+      gridDelegate: SliverSimpleGridDelegateWithFixedCrossAxisCount(
+        crossAxisCount: count,
+      ),
+      itemCount: itemCount,
+      itemBuilder: itemBuilder,
+    );
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(title: const Text('Música (Alvvays)')),
+      body: FutureBuilder(
+        future: musicApi!.getAlvvaysAlbums(),
+        builder: (context, AsyncSnapshot<List<Album>?> snapshot) {
+          int itemCount = snapshot.data != null ? snapshot.data!.length : 0;
+          itemBuilder(BuildContext context, int index) {
+            return AlbumItem(snapshot.data![index]);
+          }
+
+          if (snapshot.hasData) {
+            return Responsive(
+              mobile: getGridForCount(2, itemCount, itemBuilder),
+              tablet: getGridForCount(3, itemCount, itemBuilder),
+              desktop: getGridForCount(4, itemCount, itemBuilder),
+            );
+          } else if (snapshot.hasError) {
+            print(snapshot.error);
+            return const Center(
+              child: Text('Ocurrió un error'),
+            );
+          } else {
+            return const LoadingModal();
+          }
+        },
+      ),
+    );
+  }
+}