DataDog Proof of Concept

.github/workflows/firebase-hosting-pull-request.yml

@@ -18,10 +18,10 @@ jobs:
       - uses: actions/checkout@v3
        # https://github.com/marketplace/actions/flutter-action
       - name: Setup Flutter
-         # SHA for v2.10.0
-        uses: subosito/flutter-action@48cafc24713cca54bbe03cdc3a423187d413aafa
+         # SHA for v2.16.0
+        uses: subosito/flutter-action@44ac965b96f18d999802d4b807e3256d5a3f9fa1
         with:
-          flutter-version: '3.13.9'
+          flutter-version: '3.22.2'
           channel: 'stable'
           cache: true
       - run: flutter pub get
@@ -34,6 +34,8 @@ jobs:
               echo CLOUD_FUNCTIONS_URL=${{ secrets.CLOUD_FUNCTIONS_URL }} >> .env
               echo SA_EMAIL=${{ secrets.SA_EMAIL }} >> .env
               echo SA_SECRET_KEY="${{ secrets.SA_SECRET_KEY }}" >> .env
+              echo DATADOG_CLIENT_TOKEN="${{ secrets.DATADOG_CLIENT_TOKEN }}" >> .env
+              echo DATADOG_APP_ID="${{ secrets.DATADOG_APP_ID }}" >> .env
       - run: flutter build web --dart-define-from-file=.env
       - name: Update .firebaserc
         run: |

analysis_options.yaml

@@ -11,7 +11,9 @@ include: package:flutter_lints/flutter.yaml
 
 analyzer:
    exclude: [
-      build/**
+      build/**,
+      test/
+      integration_test/
    ]
 
    language:

lib/main.dart

@@ -5,19 +5,23 @@
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:url_strategy/url_strategy.dart';
+import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
 
 
-void main() {
+Future<void> main() async {
   setPathUrlStrategy();
-  runApp(
-    MultiProvider(
-      providers: [
-        ChangeNotifierProvider(create: (final _) => UserProvider()),
-        ChangeNotifierProvider(create: (final _) => OverlayProvider())
-      ],
-      child: const MyApp()
-    )
-  );
+
+  await DatadogSdk.runApp(configuration, TrackingConsent.granted, () async {
+    runApp(
+        MultiProvider(
+            providers: [
+              ChangeNotifierProvider(create: (final _) => UserProvider()),
+              ChangeNotifierProvider(create: (final _) => OverlayProvider())
+            ],
+            child: const MyApp()
+        )
+    );
+  });
 }
 
 class MyApp extends StatelessWidget {
@@ -37,6 +41,9 @@
 
       )
     ),
+    navigatorObservers: [
+      DatadogNavigationObserver(datadogSdk: DatadogSdk.instance),
+    ],
     onGenerateRoute: (final settings) => MaterialPageRoute(
       builder: (final context) => const MyHomePage(),
       settings: const RouteSettings(name: '/')

lib/utils/constants.dart

@@ -1,3 +1,5 @@
+import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
+import 'package:datadog_tracking_http_client/datadog_tracking_http_client.dart';
 import 'package:flutter/material.dart';
 
 /* Environment variables */
@@ -8,6 +10,23 @@
     String.fromEnvironment('CLOUD_FUNCTIONS_URL');
 const serviceAccountSecret = String.fromEnvironment('SA_SECRET_KEY');
 const serviceAccountEmail = String.fromEnvironment('SA_EMAIL');
+const datadogClientToken = String.fromEnvironment('DATADOG_CLIENT_TOKEN');
+const dataDogApplicationId = String.fromEnvironment('DATADOG_APP_ID');
+
+/* DataDog*/
+final configuration = DatadogConfiguration(
+  clientToken: datadogClientToken,
+  env: 'env',
+  site: DatadogSite.us5,
+  nativeCrashReportEnabled: true,
+  loggingConfiguration: DatadogLoggingConfiguration(),
+  rumConfiguration: DatadogRumConfiguration(
+    applicationId: dataDogApplicationId,
+    reportFlutterPerformance: true,
+  )
+)..enableHttpTracking();
+final logConfiguration = DatadogLoggerConfiguration();
+final logger = DatadogSdk.instance.logs?.createLogger(logConfiguration);
 
 /* Media Query Breakpoints */
 const double smallScreen = 575;

lib/views/screens/advanced_security_screen.dart

@@ -4,6 +4,7 @@
 import 'package:angeleno_project/controllers/auth0_user_api_implementation.dart';
 import 'package:angeleno_project/utils/constants.dart';
 import 'package:angeleno_project/views/dialogs/mobile.dart';
+import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
 import 'package:flutter/material.dart';
 
 
@@ -25,7 +26,8 @@
   State<AdvancedSecurityScreen> createState() => _AdvancedSecurityState();
 }
 
-class _AdvancedSecurityState extends State<AdvancedSecurityScreen> {
+class _AdvancedSecurityState extends State<AdvancedSecurityScreen>
+    with RouteAware, DatadogRouteAwareMixin {
 
   late Auth0UserApi auth0UserApi;
   late UserProvider userProvider;
@@ -49,6 +51,9 @@
     _authMethods = getAuthenticationMethods();
   }
 
+  @override
+  RumViewInfo get rumViewInfo => RumViewInfo(name: 'Security Screen');
+
   Future<void> getAuthenticationMethods() async {
     await auth0UserApi.getAuthenticationMethods(userProvider.user!.userId)
       .then((final response) {

lib/views/screens/home_screen.dart

@@ -2,6 +2,7 @@
 import 'package:angeleno_project/views/screens/advanced_security_screen.dart';
 import 'package:angeleno_project/views/screens/password_screen.dart';
 import 'package:angeleno_project/views/screens/profile_screen.dart';
+import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 import 'package:url_launcher/url_launcher.dart';
@@ -124,109 +125,112 @@
 
     return Container(
       margin: const EdgeInsets.fromLTRB(0, 47.0, 0, 0),
-      child: Scaffold(
-          key: scaffoldKey,
-          appBar: AppBar(
-            title: const Text('Angeleno Account',
-              style: TextStyle(fontWeight: FontWeight.bold),
-            )
-          ),
-          drawer: NavigationDrawer(
-            onDestinationSelected: _navigationSelected,
-            selectedIndex: _selectedIndex,
-            children:  <Widget>[
-              Padding(
-                padding: const EdgeInsets.fromLTRB(28, 16, 16, 10),
-                child: Text('My Account - $userEmail'),
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Profile'),
-                icon: Icon(Icons.person)
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Password'),
-                icon: Icon(Icons.password)
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Security'),
-                icon: Icon(Icons.security)
-              ),
-              const Divider(),
-              const Padding(
-                padding: EdgeInsets.fromLTRB(28, 16, 16, 10),
-                child: Text('Angeleno'),
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Home'),
-                icon: Icon(Icons.home)
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Services'),
-                icon: Icon(Icons.grid_view)
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Help'),
-                icon: Icon(Icons.question_mark)
-              ),
-              const Padding(
-                padding: EdgeInsets.fromLTRB(28, 16, 28, 10),
-                child: Divider(),
-              ),
-              const NavigationDrawerDestination(
-                label: Text('Logout'),
-                icon: Icon(Icons.logout)
-              )
-            ],
-          ),
-          body: Stack(
-            children: [
-              Center(
-                child: Container(
-                  transformAlignment: Alignment.center,
-                  width: double.infinity,
-                  constraints: const BoxConstraints(maxWidth: 1280),
-                  child: Row(
-                    mainAxisAlignment: MainAxisAlignment.center,
-                    children: <Widget>[
-                      Expanded(
-                        child: Padding(
-                          padding: const EdgeInsets.all(20.0),
-                          child: screens[_selectedIndex])
-                      )
-                    ],
-                  ),
+      child: RumUserActionDetector(
+        rum: DatadogSdk.instance.rum,
+        child: Scaffold(
+            key: scaffoldKey,
+            appBar: AppBar(
+                title: const Text('Angeleno Account',
+                  style: TextStyle(fontWeight: FontWeight.bold),
                 )
-              ),
-              if (overlayProvider.isLoading)
-                Center(
-                  child: Container(
-                    alignment: Alignment.topCenter,
-                    width: double.infinity,
-                    constraints: const BoxConstraints(maxWidth: 1280),
-                    padding: const EdgeInsets.fromLTRB(
-                        10, 0, 10, 0
-                    ),
-                    color: Colors.black.withOpacity(0.25),
-                    child: const LinearProgressIndicator(),
-                  )
+            ),
+            drawer: NavigationDrawer(
+              onDestinationSelected: _navigationSelected,
+              selectedIndex: _selectedIndex,
+              children:  <Widget>[
+                Padding(
+                  padding: const EdgeInsets.fromLTRB(28, 16, 16, 10),
+                  child: Text('My Account - $userEmail'),
                 ),
-            ],
-          ),
-          bottomNavigationBar: Container(
-            padding: const EdgeInsets.all(16.0),
-            child: const Wrap(
-              alignment: WrapAlignment.center,
-              children: [
-                Text(
-                  '© Copyright 2023 City of Los Angeles. '
-                  'All rights reserved. Disclaimer | Privacy Policy',
-                  textDirection: TextDirection.ltr,
-                  textAlign: TextAlign.center,
+                const NavigationDrawerDestination(
+                    label: Text('Profile'),
+                    icon: Icon(Icons.person)
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Password'),
+                    icon: Icon(Icons.password)
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Security'),
+                    icon: Icon(Icons.security)
+                ),
+                const Divider(),
+                const Padding(
+                  padding: EdgeInsets.fromLTRB(28, 16, 16, 10),
+                  child: Text('Angeleno'),
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Home'),
+                    icon: Icon(Icons.home)
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Services'),
+                    icon: Icon(Icons.grid_view)
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Help'),
+                    icon: Icon(Icons.question_mark)
+                ),
+                const Padding(
+                  padding: EdgeInsets.fromLTRB(28, 16, 28, 10),
+                  child: Divider(),
+                ),
+                const NavigationDrawerDestination(
+                    label: Text('Logout'),
+                    icon: Icon(Icons.logout)
                 )
               ],
+            ),
+            body: Stack(
+              children: [
+                Center(
+                    child: Container(
+                      transformAlignment: Alignment.center,
+                      width: double.infinity,
+                      constraints: const BoxConstraints(maxWidth: 1280),
+                      child: Row(
+                        mainAxisAlignment: MainAxisAlignment.center,
+                        children: <Widget>[
+                          Expanded(
+                              child: Padding(
+                                  padding: const EdgeInsets.all(20.0),
+                                  child: screens[_selectedIndex])
+                          )
+                        ],
+                      ),
+                    )
+                ),
+                if (overlayProvider.isLoading)
+                  Center(
+                      child: Container(
+                        alignment: Alignment.topCenter,
+                        width: double.infinity,
+                        constraints: const BoxConstraints(maxWidth: 1280),
+                        padding: const EdgeInsets.fromLTRB(
+                            10, 0, 10, 0
+                        ),
+                        color: Colors.black.withOpacity(0.25),
+                        child: const LinearProgressIndicator(),
+                      )
+                  ),
+              ],
+            ),
+            bottomNavigationBar: Container(
+                padding: const EdgeInsets.all(16.0),
+                child: const Wrap(
+                  alignment: WrapAlignment.center,
+                  children: [
+                    Text(
+                      '© Copyright 2023 City of Los Angeles. '
+                          'All rights reserved. Disclaimer | Privacy Policy',
+                      textDirection: TextDirection.ltr,
+                      textAlign: TextAlign.center,
+                    )
+                  ],
+                )
             )
-          )
-      ),
+        ),
+      )
     );
   }
 }

lib/views/screens/password_screen.dart

@@ -2,6 +2,7 @@
 
 import 'package:angeleno_project/models/password_reset.dart';
 import 'package:angeleno_project/utils/constants.dart';
+import 'package:datadog_flutter_plugin/datadog_flutter_plugin.dart';
 import 'package:flutter/material.dart';
 import 'package:provider/provider.dart';
 
@@ -21,7 +22,8 @@
   State<PasswordScreen> createState() => _PasswordScreenState();
 }
 
-class _PasswordScreenState extends State<PasswordScreen> {
+class _PasswordScreenState extends State<PasswordScreen>
+    with RouteAware, DatadogRouteAwareMixin {
   late OverlayProvider overlayProvider;
   late UserProvider userProvider;
   late Auth0UserApi auth0UserApi;
@@ -48,6 +50,9 @@
     auth0UserApi = widget.auth0UserApi;
   }
 
+  @override
+  RumViewInfo get rumViewInfo => RumViewInfo(name: 'Password Screen');
+
   void submitRequest() {
     if (newPassword == passwordMatch) {