feat!: Handle authentication via OAuth2

.github/workflows/flutter.yml

@@ -7,7 +7,7 @@ on:
  - synchronize
 
 env:
- flutter_version: "3.3.9"
+ flutter_version: "3.10.x"
 jobs:
  prIsWip:
  name: PR is WIP?

.github/workflows/semantic_release.yml

@@ -8,7 +8,7 @@ on:
  - "*.x"
 
 env:
- flutter_version: "3.3.9"
+ flutter_version: "3.10.x"
 
 jobs:
  release:
@@ -35,7 +35,7 @@ jobs:
  flutter-version: ${{ env.flutter_version }}
  - name: Build Flutter Web
  run: |
- flutter build web
+ flutter build web --no-tree-shake-icons
  cd ..
  - name: Setup Node.js
  uses: actions/setup-node@v2

README.md

@@ -44,9 +44,14 @@ This repository gives you the possibility to create, manage and deploy your appl
 <!-- USAGE EXAMPLES -->
 ## Usage
 
+On the server project, you need to have a running instance of the [Lenra Server](https://github.com/lenra-io/server) and have created an OAuth client for the backoffice with the next command:
+```sh
+mix create_oauth2_client backoffice
+```
+
 Run flutter app with chrome
 ```sh
-flutter run -d chrome --web-port 10000 --dart-define=LENRA_SERVER_URL=http://localhost:4000
+flutter run -d chrome --web-port 10000 --dart-define=LENRA_SERVER_URL=http://localhost:4000 --dart-define=OAUTH_CLIENT_ID=<client_id_from_the_previous_cmd>
 ```
 
 Run flutter test

assets/texts/oauth-page-code.js

@@ -0,0 +1,25 @@
+module.exports = (data, counter) => {
+ return {
+ "type": "flex",
+ "spacing": 2,
+ "mainAxisAlignment": "spaceEvenly",
+ "crossAxisAlignment": "center",
+ "children": [
+ {
+ "type": "text",
+ "value": `${counter.text}: ${data[0].count}`
+ },
+ {
+ "type": "button",
+ "text": "+",
+ "onPressed": {
+ "action": "increment",
+ "props": {
+ "id": data[0]._id,
+ "datastore": data[0].datastore
+ }
+ }
+ }
+ ]
+ }
+}

entrypoint.sh

@@ -2,5 +2,8 @@
 
 sed -i "s|\${LENRA_SERVER_URL}|${LENRA_SERVER_URL}|g" index.html
 sed -i "s|\${SENTRY_CLIENT_DSN}|${SENTRY_CLIENT_DSN}|g" index.html
+sed -i "s|\${OAUTH_CLIENT_ID}|${OAUTH_CLIENT_ID}|g" index.html
+sed -i "s|\${OAUTH_BASE_URL}|${OAUTH_BASE_URL}|g" index.html
+sed -i "s|\${OAUTH_REDIRECT_URL}|${OAUTH_REDIRECT_URL}|g" index.html
 
 /bin/bash -c "/opt/bitnami/scripts/nginx/entrypoint.sh $@"

lib/api/response_models/oauth_client_response.dart

@@ -0,0 +1,30 @@
+import 'package:client_common/api/response_models/api_response.dart';
+
+class OAuthClientResponse extends ApiResponse {
+ String clientId;
+ int environmentId;
+ String name;
+ List<dynamic> scopes;
+ List<dynamic> redirectUris;
+ List<dynamic> allowedOrigins;
+
+ OAuthClientResponse.fromJson(Map<String, dynamic> json)
+ : clientId = json["oauth2_client_id"],
+ environmentId = json["environment_id"],
+ name = json['name'],
+ scopes = json['scopes'],
+ redirectUris = json['redirect_uris'],
+ allowedOrigins = json['allowed_origins'];
+
+ @override
+ bool operator ==(Object other) {
+ return other is OAuthClientResponse &&
+ other.clientId == clientId &&
+ other.environmentId == environmentId &&
+ other.name == name;
+ }
+
+ @override
+ // ignore: unnecessary_overrides
+ int get hashCode => super.hashCode;
+}

lib/api/response_models/oauth_clients_response.dart

@@ -0,0 +1,9 @@
+import 'package:client_backoffice/api/response_models/oauth_client_response.dart';
+import 'package:client_common/api/response_models/api_response.dart';
+
+class OAuthClientsResponse extends ApiResponse {
+ List<OAuthClientResponse> clients;
+
+ OAuthClientsResponse.fromJson(List<dynamic> json)
+ : clients = json.map<OAuthClientResponse>((client) => OAuthClientResponse.fromJson(client)).toList();
+}

lib/main.dart

@@ -1,12 +1,18 @@
+import 'dart:async';
+
+import 'package:catcher/catcher.dart';
 import 'package:client_backoffice/navigation/backoffice_navigator.dart';
 import 'package:client_backoffice/navigation/url_strategy/url_strategy.dart' show setUrlStrategyTo;
+import 'package:client_common/api/response_models/api_error.dart';
 import 'package:client_common/config/config.dart';
 import 'package:client_common/models/auth_model.dart';
 import 'package:client_common/models/build_model.dart';
-import 'package:client_common/models/cgu_model.dart';
 import 'package:client_common/models/deployment_model.dart';
 import 'package:client_common/models/store_model.dart';
 import 'package:client_common/models/user_application_model.dart';
+import 'package:client_common/oauth/oauth_model.dart';
+import 'package:client_common/views/lenra_report_mode.dart';
+import 'package:client_common/views/simple_page.dart';
 import 'package:flutter/material.dart';
 import 'package:lenra_components/lenra_components.dart';
 import 'package:logging/logging.dart';
@@ -22,47 +28,129 @@ void main() async {
  });
 
  debugPrint("Starting main app[debugPrint]: ${Config.instance.application}");
- // TODO: Récupération de variables d'environnement ne doit pas marcher
+
  const environment = String.fromEnvironment('ENVIRONMENT');
+ var reportMode = LenraReportMode();
+ CatcherOptions debugOptions = CatcherOptions(
+ reportMode,
+ environment == "production" || environment == "staging"
+ ? [
+ SentryHandler(
+ SentryClient(SentryOptions(dsn: Config.instance.sentryDsn)..environment = environment),
+ ),
+ ]
+ : [],
+ reportOccurrenceTimeout: 100,
+ );
+
+ Catcher(
+ debugConfig: debugOptions,
+ rootWidget: ErrorHandler(streamController: reportMode.streamController, child: Backoffice()),
+ );
+}
 
- if (environment == "production" || environment == "staging") {
- String sentryDsn = Config.instance.sentryDsn;
- await SentryFlutter.init(
- (options) => options
- ..dsn = sentryDsn
- ..environment = environment,
- appRunner: () => runApp(Backoffice()),
+class ErrorHandler extends StatelessWidget {
+ final Widget child;
+ final StreamController<dynamic> streamController;
+
+ const ErrorHandler({Key? key, required this.child, required this.streamController}) : super(key: key);
+
+ @override
+ Widget build(BuildContext context) {
+ return StreamBuilder(
+ builder: (context, snapshot) {
+ if (snapshot.hasError) {
+ return Center(
+ child: Text(snapshot.error.toString()),
+ );
+ }
+ if (snapshot.hasData) {
+ var themeData = LenraThemeData();
+ return LenraTheme(
+ themeData: themeData,
+ child: MaterialApp(
+ theme: ThemeData(
+ visualDensity: VisualDensity.standard,
+ textTheme: TextTheme(bodyMedium: themeData.lenraTextThemeData.bodyText),
+ ),
+ home: SimplePage(
+ title: getErrorTitle(snapshot.data),
+ message: getErrorMessage(snapshot.data),
+ child: Flex(
+ direction: Axis.horizontal,
+ mainAxisAlignment: MainAxisAlignment.center,
+ children: [
+ TextButton(
+ onPressed: () {
+ streamController.add(null);
+ },
+ child: Text("Retry"),
+ ),
+ ],
+ ),
+ ),
+ ),
+ );
+ }
+ return child;
+ },
+ stream: streamController.stream,
  );
- } else {
- runApp(Backoffice());
+ }
+
+ String getErrorTitle(dynamic error) {
+ if (error is ApiError) {
+ return "Connection lost!";
+ } else {
+ return "Unknown error";
+ }
+ }
+
+ String getErrorMessage(dynamic error) {
+ if (error is ApiError) {
+ return "It looks like you lost connection to the server. Please check your internet connection and try again.";
+ } else {
+ return "An unknown error occured. If the error persists, please contact us at contact@lenra.io.";
+ }
  }
 }
 
 class Backoffice extends StatelessWidget {
  Backoffice({Key? key}) : super(key: key);
+
  @override
  Widget build(BuildContext context) {
  var themeData = LenraThemeData();
- return MultiProvider(
- providers: [
- ChangeNotifierProvider<AuthModel>(create: (context) => AuthModel()),
- ChangeNotifierProvider<BuildModel>(create: (context) => BuildModel()),
- ChangeNotifierProvider<DeploymentModel>(create: (context) => DeploymentModel()),
- ChangeNotifierProvider<UserApplicationModel>(create: (context) => UserApplicationModel()),
- ChangeNotifierProvider<StoreModel>(create: (context) => StoreModel()),
- ChangeNotifierProvider<CguModel>(create: (context) => CguModel()),
- ],
- builder: (BuildContext context, _) => LenraTheme(
- themeData: themeData,
- child: MaterialApp.router(
- routerConfig: BackofficeNavigator.router,
- title: 'Lenra',
- theme: ThemeData(
- visualDensity: VisualDensity.standard,
- textTheme: TextTheme(bodyText2: themeData.lenraTextThemeData.bodyText),
- ),
- ),
- ),
+ return Container(
+ color: Colors.white,
+ child: MultiProvider(
+ providers: [
+ ChangeNotifierProvider<OAuthModel>(
+ create: (context) => OAuthModel(
+ Config.instance.oauthClientId,
+ Config.instance.oauthRedirectUrl,
+ scopes: ['profile', 'store', 'manage:account', 'manage:apps'],
+ ),
+ ),
+ ChangeNotifierProvider<AuthModel>(create: (context) => AuthModel()),
+ ChangeNotifierProvider<BuildModel>(create: (context) => BuildModel()),
+ ChangeNotifierProvider<DeploymentModel>(create: (context) => DeploymentModel()),
+ ChangeNotifierProvider<UserApplicationModel>(create: (context) => UserApplicationModel()),
+ ChangeNotifierProvider<StoreModel>(create: (context) => StoreModel()),
+ ],
+ builder: (BuildContext context, _) {
+ return LenraTheme(
+ themeData: themeData,
+ child: MaterialApp.router(
+ routerConfig: BackofficeNavigator.router,
+ title: 'Lenra',
+ theme: ThemeData(
+ visualDensity: VisualDensity.standard,
+ textTheme: TextTheme(bodyMedium: themeData.lenraTextThemeData.bodyText),
+ ),
+ ),
+ );
+ }),
  );
  }
 }