fix: use the native youtube view for the native

It's opening the in app
tracked at
sarbagyastha/youtube_player_flutter#462

client/ios/Podfile.lock

@@ -36,4 +36,4 @@ SPEC CHECKSUMS:
 
 PODFILE CHECKSUM: aafe91acc616949ddb318b77800a7f51bffa2a4c
 
-COCOAPODS: 1.10.0
+COCOAPODS: 1.10.1

client/lib/screens/detail_screen.dart

@@ -46,7 +46,10 @@ class DetailScreen extends StatelessWidget {
       ),
       body: Column(
         children: [
-          YoutubeWidget(youtubeId: extractYoutubeId(args.video.link)),
+          LimitedBox(
+            maxHeight: 350,
+            child: YoutubeWidget(youtubeId: extractYoutubeId(args.video.link)),
+          ),
           Expanded(
             child: CustomScrollView(
               slivers: [

client/lib/widgets/detail/youtube.dart

@@ -1,35 +1,3 @@
-import 'package:flutter/material.dart';
-// import 'package:youtube_player_flutter/youtube_player_flutter.dart';
-import 'package:youtube_player_iframe/youtube_player_iframe.dart';
-
-class YoutubeWidget extends StatefulWidget {
-  final String youtubeId;
-
-  const YoutubeWidget({Key? key, required this.youtubeId}) : super(key: key);
-
-  @override
-  _DetailState createState() => _DetailState();
-}
-
-class _DetailState extends State<YoutubeWidget> {
-  late final YoutubePlayerController _controller;
-
-  @override
-  void initState() {
-    super.initState();
-
-    _controller = YoutubePlayerController(initialVideoId: widget.youtubeId);
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    return YoutubePlayerControllerProvider(
-      // Provides controller to all the widget below it.
-      controller: _controller,
-      child: const YoutubePlayerIFrame(
-        // ignore: avoid_redundant_argument_values
-        aspectRatio: 16 / 9,
-      ),
-    );
-  }
-}
+export "youtube_interface.dart"
+    if (dart.library.html) "./youtube_web.dart"
+    if (dart.library.io) "./youtube_native.dart";

client/lib/widgets/detail/youtube_interface.dart

@@ -0,0 +1,17 @@
+import 'package:flutter/widgets.dart';
+
+class YoutubeWidget extends StatefulWidget {
+  final String youtubeId;
+
+  const YoutubeWidget({Key? key, required this.youtubeId}) : super(key: key);
+
+  @override
+  _YouTubeWidgetState createState() => _YouTubeWidgetState();
+}
+
+class _YouTubeWidgetState extends State<YoutubeWidget> {
+  @override
+  Widget build(BuildContext context) {
+    throw UnimplementedError("you have to import youtube.dart instead");
+  }
+}

client/lib/widgets/detail/youtube_native.dart

@@ -0,0 +1,28 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:youtube_player_flutter/youtube_player_flutter.dart';
+
+class YoutubeWidget extends StatefulWidget {
+  final String youtubeId;
+
+  const YoutubeWidget({Key? key, required this.youtubeId}) : super(key: key);
+
+  @override
+  _YouTubeWidgetState createState() => _YouTubeWidgetState();
+}
+
+class _YouTubeWidgetState extends State<YoutubeWidget> {
+  late final YoutubePlayerController _controller;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _controller = YoutubePlayerController(initialVideoId: widget.youtubeId);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return YoutubePlayer(controller: _controller);
+  }
+}

client/lib/widgets/detail/youtube_web.dart

@@ -0,0 +1,35 @@
+import 'package:flutter/foundation.dart';
+import 'package:flutter/material.dart';
+import 'package:youtube_player_iframe/youtube_player_iframe.dart';
+
+class YoutubeWidget extends StatefulWidget {
+  final String youtubeId;
+
+  const YoutubeWidget({Key? key, required this.youtubeId}) : super(key: key);
+
+  @override
+  _YouTubeWidgetState createState() => _YouTubeWidgetState();
+}
+
+class _YouTubeWidgetState extends State<YoutubeWidget> {
+  late final YoutubePlayerController _controller;
+
+  @override
+  void initState() {
+    super.initState();
+
+    _controller = YoutubePlayerController(initialVideoId: widget.youtubeId);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    return YoutubePlayerControllerProvider(
+      // Provides controller to all the widget below it.
+      controller: _controller,
+      child: const YoutubePlayerIFrame(
+        // ignore: avoid_redundant_argument_values
+        aspectRatio: 16 / 9,
+      ),
+    );
+  }
+}

client/pubspec.lock

@@ -222,7 +222,7 @@ packages:
     source: sdk
     version: "0.0.0"
   flutter_inappwebview:
-    dependency: transitive
+    dependency: "direct main"
     description:
       name: flutter_inappwebview
       url: "https://pub.dartlang.org"

client/pubspec.yaml

@@ -25,6 +25,7 @@ dependencies:
   cupertino_icons: ^1.0.2
   flutter:
     sdk: flutter
+  flutter_inappwebview: ^5.3.2
   grpc: ^3.0.0
   intl: ^0.17.0
   protobuf: ^2.0.0