fix: fix dio error on web; added page splitting animations

.gitignore

@@ -31,7 +31,6 @@
 /build/
 
 # Web related
-lib/generated_plugin_registrant.dart
 
 # Exceptions to above rules.
 !/packages/flutter_tools/test/data/dart_dependencies_test/**/.packages

lib/src/common/data/data.dart

@@ -2,5 +2,6 @@ export 'data_sources/data_sources.dart';
 export 'database/database.dart';
 export 'failures/http_failure.dart';
 export 'local/local_storage.dart';
+export 'remote/adapter/adapter.dart';
 export 'remote/app_dio.dart';
 export 'repositories/repositories.dart';

lib/src/common/data/remote/adapter/adapter.dart

@@ -0,0 +1,3 @@
+export 'unsupported.dart'
+    if (dart.library.html) 'web_adapter.dart'
+    if (dart.library.io) 'mobile_adapter.dart';

lib/src/common/data/remote/adapter/mobile_adapter.dart

@@ -0,0 +1,6 @@
+import 'package:dio/dio.dart';
+import 'package:dio/io.dart';
+
+HttpClientAdapter getAdapter() {
+  return IOHttpClientAdapter();
+}

lib/src/common/data/remote/adapter/unsupported.dart

@@ -0,0 +1,5 @@
+import 'package:dio/dio.dart';
+
+HttpClientAdapter getAdapter() {
+  throw 'unsupported platform';
+}

lib/src/common/data/remote/adapter/web_adapter.dart

@@ -0,0 +1,6 @@
+import 'package:dio/browser.dart';
+import 'package:dio/dio.dart';
+
+HttpClientAdapter getAdapter() {
+  return BrowserHttpClientAdapter();
+}

lib/src/common/data/remote/app_dio.dart

@@ -1,6 +1,5 @@
 import 'package:dio/dio.dart';
-import 'package:dio/io.dart';
-import 'package:flutter/material.dart';
+import 'package:flutter/foundation.dart';
 import 'package:flutter_ebook_app/src/common/common.dart';
 import 'package:logman/logman.dart';
 
@@ -18,7 +17,6 @@ class AppDio with DioMixin implements Dio {
       ..add(
         InterceptorsWrapper(
           onRequest: (options, handler) async {
-            options.headers['Content-Type'] = 'application/json';
             return handler.next(options);
           },
           onResponse: (response, handler) {
@@ -30,7 +28,7 @@ class AppDio with DioMixin implements Dio {
         ),
       )
       ..add(LogmanDioInterceptor());
-    httpClientAdapter = IOHttpClientAdapter();
+    httpClientAdapter = getAdapter();
   }
 
   static Dio getInstance() => AppDio._();

lib/src/common/data/repositories/book/book_repository.dart

@@ -20,7 +20,7 @@ abstract class BookRepository {
       final json = jsonDecode(xml2json.toGData());
       category = CategoryFeed.fromJson(json as Map<String, dynamic>);
       return (feed: category, failure: null);
-    } on DioError catch (error) {
+    } on DioException catch (error) {
       final statusCode = error.response?.statusCode ?? 500;
       if (statusCode == 404) {
         return (feed: null, failure: HttpFailure.notFound);

lib/src/common/presentation/ui/widgets/animated_page_splitter.dart

@@ -0,0 +1,56 @@
+import 'package:flutter/material.dart';
+
+class AnimatedPageSplitter extends StatelessWidget {
+  final Widget leftChild;
+  final Widget? rightChild;
+  final bool isExpanded;
+  final Duration animationDuration;
+  final double dividerWidth;
+
+  const AnimatedPageSplitter({
+    super.key,
+    required this.leftChild,
+    this.rightChild,
+    this.isExpanded = false,
+    this.animationDuration = const Duration(milliseconds: 250),
+    this.dividerWidth = 16.0,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        final screenWidth = constraints.maxWidth;
+        final firstHalfWidth = (screenWidth - dividerWidth) / 2.7;
+        final secondHalfWidth = screenWidth - firstHalfWidth;
+
+        final leftSectionWidth = isExpanded ? firstHalfWidth : screenWidth;
+        final rightSectionWidth = isExpanded ? secondHalfWidth : 0.0;
+        final animatedDividerWidth = isExpanded ? dividerWidth : 0.0;
+
+        return Row(
+          children: [
+            AnimatedContainer(
+              duration: animationDuration,
+              width: leftSectionWidth,
+              child: leftChild,
+            ),
+            AnimatedContainer(
+              duration: animationDuration,
+              width: animatedDividerWidth,
+              color: Colors.transparent,
+              child: animatedDividerWidth > 0 ? const VerticalDivider() : null,
+            ),
+            Expanded(
+              child: AnimatedContainer(
+                duration: animationDuration,
+                width: rightSectionWidth,
+                child: rightChild,
+              ),
+            ),
+          ],
+        );
+      },
+    );
+  }
+}

lib/src/common/presentation/ui/widgets/widgets.dart

@@ -1,3 +1,4 @@
+export 'animated_page_splitter.dart';
 export 'book_card.dart';
 export 'book_item.dart';
 export 'book_list_item.dart';

lib/src/common/router/app_router.dart

@@ -14,10 +14,15 @@ class AppRouter extends _$AppRouter {
         page: SplashRoute.page,
         path: '/',
       ),
-      CupertinoRoute(
+      CustomRoute(
         page: TabsRoute.page,
         path: '/tabs-screen',
+        transitionsBuilder: (_, animation, ___, child) => FadeTransition(
+          opacity: animation,
+          child: child,
+        ),
         children: <AutoRoute>[
+          RedirectRoute(path: '', redirectTo: 'home-tab'),
           CupertinoRoute(
             page: HomeRoute.page,
             path: 'home-tab',
@@ -38,11 +43,6 @@ class AppRouter extends _$AppRouter {
             page: ExploreRoute.page,
             path: 'explore-tab',
             children: [
-              CustomRoute(
-                transitionsBuilder: (_, __, ___, child) => child,
-                page: ExploreRouteSmall.page,
-                path: 'explore-small-tab',
-              ),
               CustomRoute(
                 transitionsBuilder: (_, __, ___, child) => child,
                 page: BookDetailsRoute.page,

lib/src/features/book_details/presentation/ui/screens/book_details_screen.dart

@@ -32,8 +32,18 @@ class BookDetailsScreen extends ConsumerStatefulWidget {
 class _BookDetailsScreenState extends ConsumerState<BookDetailsScreen> {
   @override
   Widget build(BuildContext context) {
+    final autoRouteTopRoute = context.watchRouter.currentChild;
+    final canPop = context.router.canPop();
+
     return Scaffold(
       appBar: AppBar(
+        leading: !canPop && autoRouteTopRoute?.name == 'BookDetailsRoute'
+            ? CloseButton(
+                onPressed: () {
+                  Navigator.pop(context);
+                },
+              )
+            : null,
         backgroundColor: context.isSmallScreen ? null : Colors.transparent,
         actions: <Widget>[
           ref.watch(favoritesNotifierProvider).maybeWhen(

lib/src/features/explore/presentation/ui/screens/explore_screen_large.dart

@@ -1,27 +1,19 @@
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_ebook_app/src/common/common.dart';
+import 'package:flutter_ebook_app/src/features/features.dart';
 
-class ExploreScreenLarge extends StatefulWidget {
+class ExploreScreenLarge extends StatelessWidget {
   const ExploreScreenLarge({super.key});
 
-  @override
-  State<ExploreScreenLarge> createState() => _ExploreScreenLargeState();
-}
-
-class _ExploreScreenLargeState extends State<ExploreScreenLarge> {
-  @override
-  void initState() {
-    super.initState();
-    WidgetsBinding.instance.addPostFrameCallback((_) {
-      context.router.replace(const ExploreRouteSmall());
-    });
-  }
-
   @override
   Widget build(BuildContext context) {
-    return AutoRouter(
-      placeholder: (context) => const SizedBox.shrink(),
+    final isNestedEmpty = context.watchRouter.topRoute.name == 'ExploreRoute';
+
+    return AnimatedPageSplitter(
+      isExpanded: !isNestedEmpty,
+      leftChild: const ExploreScreenSmall(),
+      rightChild: const AutoRouter(),
     );
   }
 }

lib/src/features/explore/presentation/ui/screens/genre_screen.dart

@@ -82,8 +82,18 @@ class _GenreScreenState extends ConsumerState<GenreScreen> {
 
   @override
   Widget build(BuildContext context) {
+    final autoRouteTopRoute = context.watchRouter.currentChild;
+    final canPop = context.router.canPop();
+
     return Scaffold(
       appBar: AppBar(
+        leading: !canPop && autoRouteTopRoute?.name == 'GenreRoute'
+            ? CloseButton(
+                onPressed: () {
+                  Navigator.pop(context);
+                },
+              )
+            : null,
         backgroundColor: context.isSmallScreen ? null : Colors.transparent,
         centerTitle: true,
         title: Text(widget.title),

lib/src/features/home/presentation/ui/screens/home_screen_large.dart

@@ -8,15 +8,12 @@ class HomeScreenLarge extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Row(
-      children: [
-        SizedBox(
-          width: context.screenSize.width / 2.7,
-          child: const HomeScreenSmall(),
-        ),
-        const VerticalDivider(thickness: 1, width: 2),
-        const Expanded(child: AutoRouter()),
-      ],
+    final isNestedEmpty = context.watchRouter.topRoute.name == 'HomeRoute';
+
+    return AnimatedPageSplitter(
+      isExpanded: !isNestedEmpty,
+      leftChild: const HomeScreenSmall(),
+      rightChild: const AutoRouter(),
     );
   }
 }

lib/src/features/settings/presentation/ui/screens/settings_screen_large.dart

@@ -1,19 +1,19 @@
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
-
-import 'package:flutter_ebook_app/src/features/settings/settings.dart';
+import 'package:flutter_ebook_app/src/common/common.dart';
+import 'package:flutter_ebook_app/src/features/features.dart';
 
 class SettingsScreenLarge extends StatelessWidget {
   const SettingsScreenLarge({super.key});
 
   @override
   Widget build(BuildContext context) {
-    return const Row(
-      children: [
-        SizedBox(width: 400, child: SettingsScreenSmall()),
-        VerticalDivider(thickness: 1, width: 2),
-        Expanded(child: AutoRouter()),
-      ],
+    final isNestedEmpty = context.watchRouter.topRoute.name == 'SettingsRoute';
+
+    return AnimatedPageSplitter(
+      isExpanded: !isNestedEmpty,
+      leftChild: const SettingsScreenSmall(),
+      rightChild: const AutoRouter(),
     );
   }
 }

lib/src/features/splash/presentation/ui/screens/splash_screen.dart

@@ -3,8 +3,6 @@ import 'dart:async';
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_ebook_app/src/common/common.dart';
-import 'package:flutter_ebook_app/src/debug_page.dart';
-import 'package:logman/logman.dart';
 
 @RoutePage()
 class SplashScreen extends StatefulWidget {
@@ -31,21 +29,6 @@ class _SplashScreenState extends State<SplashScreen> {
   void initState() {
     super.initState();
     startTimeout();
-    WidgetsBinding.instance.addPostFrameCallback((_) {
-      Logman.instance.attachOverlay(
-        context: context,
-        debugPage: const DebugPage(),
-        button: FloatingActionButton(
-          elevation: 0,
-          onPressed: () {},
-          backgroundColor: context.theme.accentColor,
-          child: const Icon(
-            Icons.bug_report,
-            color: Colors.white,
-          ),
-        ),
-      );
-    });
   }
 
   @override

lib/src/features/tabs/presentation/ui/screens/tabs_screen.dart

@@ -1,15 +1,42 @@
 import 'package:auto_route/auto_route.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter_ebook_app/src/common/common.dart';
+import 'package:flutter_ebook_app/src/debug_page.dart';
 import 'package:flutter_ebook_app/src/features/features.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
+import 'package:logman/logman.dart';
 
 @RoutePage()
-class TabsScreen extends ConsumerWidget {
+class TabsScreen extends ConsumerStatefulWidget {
   const TabsScreen({super.key});
 
   @override
-  Widget build(BuildContext context, WidgetRef ref) {
+  ConsumerState<TabsScreen> createState() => _TabsScreenState();
+}
+
+class _TabsScreenState extends ConsumerState<TabsScreen> {
+  @override
+  void initState() {
+    super.initState();
+    WidgetsBinding.instance.addPostFrameCallback((_) {
+      Logman.instance.attachOverlay(
+        context: context,
+        debugPage: const DebugPage(),
+        button: FloatingActionButton(
+          elevation: 0,
+          onPressed: () {},
+          backgroundColor: context.theme.accentColor,
+          child: const Icon(
+            Icons.bug_report,
+            color: Colors.white,
+          ),
+        ),
+      );
+    });
+  }
+
+  @override
+  Widget build(BuildContext context) {
     // watch providers so they don't get disposed
     ref.watch(homeFeedNotifierProvider);
 

pubspec.lock

@@ -53,10 +53,10 @@ packages:
     dependency: "direct main"
     description:
       name: auto_route
-      sha256: "02120972925a567c37921fa28ac7e90680c7095dd0e70711353737ec2727cdc6"
+      sha256: "82f8df1d177416bc6b7a449127d0270ff1f0f633a91f2ceb7a85d4f07c3affa1"
       url: "https://pub.dev"
     source: hosted
-    version: "7.4.0"
+    version: "7.8.4"
   auto_route_generator:
     dependency: "direct dev"
     description:
@@ -1361,4 +1361,4 @@ packages:
     version: "3.1.1"
 sdks:
   dart: ">=3.1.0 <4.0.0"
-  flutter: ">=3.10.0"
+  flutter: ">=3.13.0"

pubspec.yaml

@@ -7,7 +7,7 @@ environment:
   sdk: ">=3.0.0 <4.0.0"
 
 dependencies:
-  auto_route: ^7.4.0
+  auto_route: ^7.8.4
   cached_network_image: ^3.3.0
   cupertino_icons: ^1.0.3
   dio: ^5.4.0