Uses hooks instead of stateful components

Author: martyfuhry

Diff for: mobile/lib/modules/memories/views/memory_page.dart

@@ -16,19 +16,12 @@ class MemoryPage extends HookConsumerWidget {
   final List<Memory> memories;
   final int memoryIndex;
 
-  MemoryPage({
+  const MemoryPage({
     required this.memories,
     required this.memoryIndex,
     super.key,
   });
 
-  /// The list of all of the asset page controllers
-  late final memoryAssetPageControllers =
-      List.generate(memories.length, (i) => PageController());
-
-  /// The main vertically scrolling page controller with each list of memories
-  late final memoryPageController = PageController(initialPage: memoryIndex);
-
   @override
   Widget build(BuildContext context, WidgetRef ref) {
     final currentMemory = useState(memories[memoryIndex]);
@@ -39,6 +32,13 @@ class MemoryPage extends HookConsumerWidget {
     );
     const bgColor = Colors.black;
 
+    /// The list of all of the asset page controllers
+    final memoryAssetPageControllers =
+        List.generate(memories.length, (i) => usePageController());
+
+    /// The main vertically scrolling page controller with each list of memories
+    final memoryPageController = usePageController(initialPage: memoryIndex);
+
     // The Page Controller that scrolls horizontally with all of the assets
     PageController currentMemoryAssetPageController =
         memoryAssetPageControllers[currentMemoryIndex.value];