Added TODO

lib/mobile_example.dart

@@ -1,7 +1,7 @@
 import 'dart:math';
 
 import 'package:flutter/material.dart';
-import 'package:gymlink_module_web/main_mobile.dart';
+import 'package:gymlink_module_web/pages/main.dart';
 import 'package:gymlink_module_web/providers/main.dart';
 import 'package:provider/provider.dart';
 
@@ -17,12 +17,8 @@ class MyExampleApp extends StatelessWidget {
     return MaterialApp(
       title: 'GymLink Example App',
       debugShowCheckedModeBanner: false,
-      home: ChangeNotifierProvider(
+      home: const ExampleMainPage(),
-        create: (_) => GymLinkProvider(),
+      theme: ThemeData.dark(useMaterial3: true),
-        child: Consumer<GymLinkProvider>(
-          builder: (context, provider, __) => const ExamplePage(),
-        ),
-      ),
     );
   }
 }
@@ -34,29 +30,70 @@ class ExamplePage extends StatefulWidget {
   State<ExamplePage> createState() => _ExamplePageState();
 }
 
+Widget getDrawer(BuildContext context) => Drawer(
+      child: Column(
+        children: [
+          const DrawerHeader(child: Text('Drawer Header')),
+          ListTile(
+            leading: const Icon(Icons.home),
+            title: const Text('Home'),
+            onTap: () => Navigator.of(context).push(
+              MaterialPageRoute(
+                builder: (context) => const ExampleMainPage(),
+              ),
+            ),
+          ),
+          ListTile(
+            leading: const Icon(Icons.search),
+            title: const Text('Example page'),
+            onTap: () => Navigator.of(context).push(MaterialPageRoute(
+              builder: (context) => const ExampleSecondPage(),
+            )),
+          ),
+        ],
+      ),
+    );
+
+class ExampleMainPage extends StatelessWidget {
+  const ExampleMainPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return ChangeNotifierProvider(
+        create: (_) => GymLinkProvider(),
+        child: Consumer<GymLinkProvider>(
+          builder: (_, value, __) => const ExamplePage(),
+        ));
+  }
+}
+
 class _ExamplePageState extends State<ExamplePage> {
   @override
   void initState() {
     super.initState();
-    context.read<GymLinkProvider>().onTokenReceived('token123');
+    Future.microtask(
+        () => context.read<GymLinkProvider>().onTokenReceived('token123'));
   }
 
   @override
   Widget build(BuildContext context) {
-    return Consumer<GymLinkProvider>(
+    return Scaffold(
-      builder: (context, provider, __) => Scaffold(
+      appBar: AppBar(
-        appBar: AppBar(title: const Text('GymLink Example App')),
+        title: const Text('GymLink Example App'),
+      ),
+      drawer: getDrawer(context),
       body: Column(
         children: [
           const Text('test'),
           IconButton(
             icon: const Icon(Icons.abc),
             onPressed: () {
-                provider.onTokenReceived('token123');
+              context.read<GymLinkProvider>().onTokenReceived('token123');
             },
           ),
-            const Expanded(
+          Expanded(
-              child: MyApp(),
+            child:
+                MainPage(isLoading: context.watch<GymLinkProvider>().isLoading),
           ),
           const SizedBox(
             height: 20,
@@ -67,10 +104,28 @@ class _ExamplePageState extends State<ExamplePage> {
       floatingActionButton: IconButton(
         icon: const Icon(Icons.search),
         onPressed: () {
-            provider.changeTheme(Random().nextInt(0xffffff + 1));
+          context
+              .read<GymLinkProvider>()
+              .changeTheme(Random().nextInt(0xffffff + 1));
         },
       ),
-      ),
+    );
+  }
+}
+
+class ExampleSecondPage extends StatelessWidget {
+  const ExampleSecondPage({super.key});
+
+  @override
+  Widget build(BuildContext context) {
+    return Scaffold(
+      appBar: AppBar(
+        title: const Text('GymLink Example App'),
+      ),
+      drawer: getDrawer(context),
+      body: const Center(
+        child: Text('Example page'),
+      ),
     );
   }
 }

lib/pages/main.dart

@@ -171,8 +171,8 @@ class _MainPageState extends State<MainPage> {
                 Expanded(
                   child: GridView.builder(
                     gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
-                      crossAxisCount:
+                      crossAxisCount: (MediaQuery.sizeOf(context).width ~/ 150)
-                          (MediaQuery.sizeOf(context).width ~/ 250).floor(),
+                          .floor(), //TODO: Make it adaptive size
                     ),
                     itemCount: testData.length,
                     itemBuilder: (context, index) {
@@ -180,7 +180,7 @@ class _MainPageState extends State<MainPage> {
                       return ProductCard(
                         imagePath: Image(
                           image: AssetImage('assets/${product['image']!}'),
-                          width: 100,
+                          width: 50,
                         ),
                         name: product['name']!,
                         price: product['price']!,