From 8b62c18171de9dff2e4f080112120aed5d84eefa Mon Sep 17 00:00:00 2001 From: Neeraj Gupta <254676+ua741@users.noreply.github.com> Date: Tue, 20 Aug 2024 11:48:01 +0530 Subject: [PATCH] [mob] UX change --- mobile/lib/generated/intl/messages_en.dart | 5 +- mobile/lib/generated/l10n.dart | 14 +++- mobile/lib/l10n/intl_en.arb | 2 +- .../machine_learning_settings_page.dart | 75 ++++++++++++++++--- 4 files changed, 79 insertions(+), 17 deletions(-) diff --git a/mobile/lib/generated/intl/messages_en.dart b/mobile/lib/generated/intl/messages_en.dart index bfadffe8aa..b92a9f13e7 100644 --- a/mobile/lib/generated/intl/messages_en.dart +++ b/mobile/lib/generated/intl/messages_en.dart @@ -949,6 +949,8 @@ class MessageLookup extends MessageLookupByLibrary { "machineLearning": MessageLookupByLibrary.simpleMessage("Machine learning"), "magicSearch": MessageLookupByLibrary.simpleMessage("Magic search"), + "magicSearchHint": MessageLookupByLibrary.simpleMessage( + "Magic search allows to search photos by their contents, e.g. \'flower\', \'red car\', \'identify documents\'"), "manage": MessageLookupByLibrary.simpleMessage("Manage"), "manageDeviceStorage": MessageLookupByLibrary.simpleMessage("Manage device storage"), @@ -975,8 +977,7 @@ class MessageLookup extends MessageLookupByLibrary { "Please click here for more details about this feature in our privacy policy"), "mlConsentTitle": MessageLookupByLibrary.simpleMessage("Enable machine learning?"), - "mlIndexing": - MessageLookupByLibrary.simpleMessage("Enable ML indexing"), + "mlIndexing": MessageLookupByLibrary.simpleMessage("Enable Indexing"), "mlIndexingDescription": MessageLookupByLibrary.simpleMessage( "Please note that machine learning will result in a higher bandwidth and battery usage until all items are indexed."), "mobileWebDesktop": diff --git a/mobile/lib/generated/l10n.dart b/mobile/lib/generated/l10n.dart index a0528dc053..5f831a325e 100644 --- a/mobile/lib/generated/l10n.dart +++ b/mobile/lib/generated/l10n.dart @@ -9025,10 +9025,10 @@ class S { ); } - /// `Enable ML indexing` + /// `Enable Indexing` String get mlIndexing { return Intl.message( - 'Enable ML indexing', + 'Enable Indexing', name: 'mlIndexing', desc: '', args: [], @@ -9055,6 +9055,16 @@ class S { ); } + /// `Magic search allows to search photos by their contents, e.g. 'flower', 'red car', 'identify documents'` + String get magicSearchHint { + return Intl.message( + 'Magic search allows to search photos by their contents, e.g. \'flower\', \'red car\', \'identify documents\'', + name: 'magicSearchHint', + desc: '', + args: [], + ); + } + /// `Panorama` String get panorama { return Intl.message( diff --git a/mobile/lib/l10n/intl_en.arb b/mobile/lib/l10n/intl_en.arb index d4c349565e..92b58dcd7b 100644 --- a/mobile/lib/l10n/intl_en.arb +++ b/mobile/lib/l10n/intl_en.arb @@ -1269,7 +1269,7 @@ } } }, - "mlIndexing": "Enable ML indexing", + "mlIndexing": "Enable Indexing", "moreDetails" : "More details", "enableMLIndexingDesc": "Ente supports on-device machine learning for face recognition, magic search and other advanced search features", "magicSearchHint": "Magic search allows to search photos by their contents, e.g. 'flower', 'red car', 'identify documents'", diff --git a/mobile/lib/ui/settings/machine_learning_settings_page.dart b/mobile/lib/ui/settings/machine_learning_settings_page.dart index 293899bb67..28e95a42eb 100644 --- a/mobile/lib/ui/settings/machine_learning_settings_page.dart +++ b/mobile/lib/ui/settings/machine_learning_settings_page.dart @@ -3,6 +3,7 @@ import "dart:async"; import "package:flutter/material.dart"; import "package:intl/intl.dart"; import "package:photos/generated/l10n.dart"; +import "package:photos/l10n/l10n.dart"; import "package:photos/service_locator.dart"; import "package:photos/services/machine_learning/machine_learning_controller.dart"; import "package:photos/services/machine_learning/ml_service.dart"; @@ -13,11 +14,14 @@ import "package:photos/services/remote_assets_service.dart"; import "package:photos/services/user_remote_flag_service.dart"; import "package:photos/theme/ente_theme.dart"; import "package:photos/ui/common/loading_widget.dart"; +import "package:photos/ui/common/web_page.dart"; +import "package:photos/ui/components/buttons/button_widget.dart"; import "package:photos/ui/components/buttons/icon_button_widget.dart"; import "package:photos/ui/components/captioned_text_widget.dart"; import "package:photos/ui/components/menu_item_widget/menu_item_widget.dart"; import "package:photos/ui/components/menu_section_description_widget.dart"; import "package:photos/ui/components/menu_section_title.dart"; +import "package:photos/ui/components/models/button_type.dart"; import "package:photos/ui/components/title_bar_title_widget.dart"; import "package:photos/ui/components/title_bar_widget.dart"; import "package:photos/ui/components/toggle_switch_widget.dart"; @@ -62,6 +66,7 @@ class _MachineLearningSettingsPageState @override Widget build(BuildContext context) { + final hasEnabled = localSettings.isFaceIndexingEnabled; return Scaffold( body: CustomScrollView( primary: false, @@ -86,12 +91,16 @@ class _MachineLearningSettingsPageState delegate: SliverChildBuilderDelegate( (delegateBuildContext, index) => Padding( padding: const EdgeInsets.only(left: 16, right: 16), - child: Text( - S.of(context).mlIndexingDescription, - textAlign: TextAlign.left, - style: getEnteTextTheme(context) - .mini - .copyWith(color: getEnteColorScheme(context).textMuted), + child: Column( + children: [ + Text( + S.of(context).mlIndexingDescription, + textAlign: TextAlign.left, + style: getEnteTextTheme(context).mini.copyWith( + color: getEnteColorScheme(context).textMuted, + ), + ), + ], ), ), childCount: 1, @@ -103,7 +112,7 @@ class _MachineLearningSettingsPageState return Padding( padding: const EdgeInsets.symmetric(horizontal: 16), child: Padding( - padding: const EdgeInsets.symmetric(vertical: 20), + padding: const EdgeInsets.only(top: 20), child: _getMlSettings(context), ), ); @@ -111,6 +120,45 @@ class _MachineLearningSettingsPageState childCount: 1, ), ), + if (!hasEnabled) + SliverList( + delegate: SliverChildBuilderDelegate( + (delegateBuildContext, index) { + return Padding( + padding: const EdgeInsets.symmetric(horizontal: 16), + child: Column( + children: [ + ButtonWidget( + buttonType: ButtonType.secondary, + labelText: context.l10n.moreDetails, + onTap: () async { + Navigator.of(context).push( + MaterialPageRoute( + builder: (BuildContext context) { + return WebPage( + S.of(context).help, + "https://help.ente.io/photos/features/machine-learning", + ); + }, + ), + ).ignore(); + }, + ), + const SizedBox(height: 12), + Text( + S.of(context).magicSearchHint, + textAlign: TextAlign.left, + style: getEnteTextTheme(context).mini.copyWith( + color: getEnteColorScheme(context).textMuted, + ), + ), + ], + ), + ); + }, + childCount: 1, + ), + ), ], ), ); @@ -123,15 +171,15 @@ class _MachineLearningSettingsPageState children: [ MenuItemWidget( captionedTextWidget: CaptionedTextWidget( - title: S.of(context).mlFunctions, + title: S.of(context).mlIndexing, ), menuItemColor: colorScheme.fillFaint, trailingWidget: ToggleSwitchWidget( value: () => localSettings.isFaceIndexingEnabled, onChanged: () async { - if (!localSettings.isFaceIndexingEnabled && - !UserRemoteFlagService.instance - .getCachedBoolValue(UserRemoteFlagService.mlEnabled)) { + final hasGivenConsent = UserRemoteFlagService.instance + .getCachedBoolValue(UserRemoteFlagService.mlEnabled); + if (!localSettings.isFaceIndexingEnabled && !hasGivenConsent) { final result = await Navigator.push( context, MaterialPageRoute( @@ -149,7 +197,10 @@ class _MachineLearningSettingsPageState await MLService.instance.init(firstTime: true); await SemanticSearchService.instance.init(); unawaited(MLService.instance.runAllML(force: true)); - } else {} + } else { + await UserRemoteFlagService.instance + .setBoolValue(UserRemoteFlagService.mlEnabled, false); + } if (mounted) { setState(() {}); }