✨ Publisher list on account

- Implement DataSavingGate util (previous commit was only the shell)
- Update ProfilePictureWidget to always load avatars via UniversalImage
  using fileId, bypassing CloudFileWidget and its data-saving check
- Keep larger media under data-saving control
- Add i18n strings for data-saving mode

Signed-off-by: Texas0295 <kimura@texas0295.top>

assets/i18n/en-US.json

@@ -349,6 +349,8 @@
   "chatBreakNone": "None",
   "settingsRealmCompactView": "Compact Realm View",
   "settingsMixedFeed": "Mixed Feed",
+  "settingsDataSavingMode": "Data Saving Mode",
+  "dataSavingHint": "Data Saving Mode",
   "settingsAutoTranslate": "Auto Translate",
   "settingsHideBottomNav": "Hide Bottom Navigation",
   "settingsSoundEffects": "Sound Effects",

assets/i18n/zh-CN.json

@@ -315,6 +315,8 @@
   "chatBreakNone": "无",
   "settingsRealmCompactView": "紧凑领域视图",
   "settingsMixedFeed": "混合动态",
+  "settingsDataSavingMode": "流量节省模式",
+  "dataSavingHint": "流量节省模式",
   "settingsAutoTranslate": "自动翻译",
   "settingsHideBottomNav": "隐藏底部导航",
   "settingsSoundEffects": "音效",

assets/i18n/zh-TW.json

@@ -315,6 +315,8 @@
     "settingsRealmCompactView": "緊湊領域視圖",
     "settingsMixedFeed": "混合動態",
     "settingsAutoTranslate": "自動翻譯",
+    "settingsDataSavingMode": "低數據模式",
+    "dataSavingHint": "低數據模式",
     "settingsHideBottomNav": "隱藏底部導航",
     "settingsSoundEffects": "音效",
     "settingsAprilFoolFeatures": "愚人節功能",

lib/pods/config.dart

@@ -20,6 +20,7 @@ const kAppColorSchemeStoreKey = 'app_color_scheme';
 const kAppNotifyWithHaptic = 'app_notify_with_haptic';
 const kAppCustomFonts = 'app_custom_fonts';
 const kAppAutoTranslate = 'app_auto_translate';
+const kAppDataSavingMode = 'app_data_saving_mode';
 const kAppSoundEffects = 'app_sound_effects';
 const kAppAprilFoolFeatures = 'app_april_fool_features';
 const kAppWindowSize = 'app_window_size';
@@ -55,6 +56,7 @@ final serverUrlProvider = Provider<String>((ref) {
 sealed class AppSettings with _$AppSettings {
   const factory AppSettings({
     required bool autoTranslate,
+    required bool dataSavingMode,
     required bool soundEffects,
     required bool aprilFoolFeatures,
     required bool enterToSend,
@@ -73,6 +75,7 @@ class AppSettingsNotifier extends _$AppSettingsNotifier {
     final prefs = ref.watch(sharedPreferencesProvider);
     return AppSettings(
       autoTranslate: prefs.getBool(kAppAutoTranslate) ?? false,
+      dataSavingMode: prefs.getBool(kAppDataSavingMode) ?? false,
       soundEffects: prefs.getBool(kAppSoundEffects) ?? true,
       aprilFoolFeatures: prefs.getBool(kAppAprilFoolFeatures) ?? true,
       enterToSend: prefs.getBool(kAppEnterToSend) ?? true,
@@ -107,6 +110,12 @@ class AppSettingsNotifier extends _$AppSettingsNotifier {
     state = state.copyWith(autoTranslate: value);
   }
 
+  void setDataSavingMode(bool value){
+    final prefs = ref.read(sharedPreferencesProvider);
+    prefs.setBool(kAppDataSavingMode, value);
+    state = state.copyWith(dataSavingMode: value);
+  }
+
   void setSoundEffects(bool value) {
     final prefs = ref.read(sharedPreferencesProvider);
     prefs.setBool(kAppSoundEffects, value);

lib/pods/config.freezed.dart

@@ -14,7 +14,7 @@ T _$identity<T>(T value) => value;
 /// @nodoc
 mixin _$AppSettings {
 
- bool get autoTranslate; bool get soundEffects; bool get aprilFoolFeatures; bool get enterToSend; bool get appBarTransparent; bool get showBackgroundImage; String? get customFonts; int? get appColorScheme;// The color stored via the int type
+ bool get autoTranslate; bool get dataSavingMode; bool get soundEffects; bool get aprilFoolFeatures; bool get enterToSend; bool get appBarTransparent; bool get showBackgroundImage; String? get customFonts; int? get appColorScheme;// The color stored via the int type
  Size? get windowSize;
 /// Create a copy of AppSettings
 /// with the given fields replaced by the non-null parameter values.
@@ -26,16 +26,16 @@ $AppSettingsCopyWith<AppSettings> get copyWith => _$AppSettingsCopyWithImpl<AppS
 
 @override
 bool operator ==(Object other) {
-  return identical(this, other) || (other.runtimeType == runtimeType&&other is AppSettings&&(identical(other.autoTranslate, autoTranslate) || other.autoTranslate == autoTranslate)&&(identical(other.soundEffects, soundEffects) || other.soundEffects == soundEffects)&&(identical(other.aprilFoolFeatures, aprilFoolFeatures) || other.aprilFoolFeatures == aprilFoolFeatures)&&(identical(other.enterToSend, enterToSend) || other.enterToSend == enterToSend)&&(identical(other.appBarTransparent, appBarTransparent) || other.appBarTransparent == appBarTransparent)&&(identical(other.showBackgroundImage, showBackgroundImage) || other.showBackgroundImage == showBackgroundImage)&&(identical(other.customFonts, customFonts) || other.customFonts == customFonts)&&(identical(other.appColorScheme, appColorScheme) || other.appColorScheme == appColorScheme)&&(identical(other.windowSize, windowSize) || other.windowSize == windowSize));
+  return identical(this, other) || (other.runtimeType == runtimeType&&other is AppSettings&&(identical(other.autoTranslate, autoTranslate) || other.autoTranslate == autoTranslate)&&(identical(other.dataSavingMode, dataSavingMode) || other.dataSavingMode == dataSavingMode)&&(identical(other.soundEffects, soundEffects) || other.soundEffects == soundEffects)&&(identical(other.aprilFoolFeatures, aprilFoolFeatures) || other.aprilFoolFeatures == aprilFoolFeatures)&&(identical(other.enterToSend, enterToSend) || other.enterToSend == enterToSend)&&(identical(other.appBarTransparent, appBarTransparent) || other.appBarTransparent == appBarTransparent)&&(identical(other.showBackgroundImage, showBackgroundImage) || other.showBackgroundImage == showBackgroundImage)&&(identical(other.customFonts, customFonts) || other.customFonts == customFonts)&&(identical(other.appColorScheme, appColorScheme) || other.appColorScheme == appColorScheme)&&(identical(other.windowSize, windowSize) || other.windowSize == windowSize));
 }
 
 
 @override
-int get hashCode => Object.hash(runtimeType,autoTranslate,soundEffects,aprilFoolFeatures,enterToSend,appBarTransparent,showBackgroundImage,customFonts,appColorScheme,windowSize);
+int get hashCode => Object.hash(runtimeType,autoTranslate,dataSavingMode,soundEffects,aprilFoolFeatures,enterToSend,appBarTransparent,showBackgroundImage,customFonts,appColorScheme,windowSize);
 
 @override
 String toString() {
-  return 'AppSettings(autoTranslate: $autoTranslate, soundEffects: $soundEffects, aprilFoolFeatures: $aprilFoolFeatures, enterToSend: $enterToSend, appBarTransparent: $appBarTransparent, showBackgroundImage: $showBackgroundImage, customFonts: $customFonts, appColorScheme: $appColorScheme, windowSize: $windowSize)';
+  return 'AppSettings(autoTranslate: $autoTranslate, dataSavingMode: $dataSavingMode, soundEffects: $soundEffects, aprilFoolFeatures: $aprilFoolFeatures, enterToSend: $enterToSend, appBarTransparent: $appBarTransparent, showBackgroundImage: $showBackgroundImage, customFonts: $customFonts, appColorScheme: $appColorScheme, windowSize: $windowSize)';
 }
 
 
@@ -46,7 +46,7 @@ abstract mixin class $AppSettingsCopyWith<$Res>  {
   factory $AppSettingsCopyWith(AppSettings value, $Res Function(AppSettings) _then) = _$AppSettingsCopyWithImpl;
 @useResult
 $Res call({
- bool autoTranslate, bool soundEffects, bool aprilFoolFeatures, bool enterToSend, bool appBarTransparent, bool showBackgroundImage, String? customFonts, int? appColorScheme, Size? windowSize
+ bool autoTranslate, bool dataSavingMode, bool soundEffects, bool aprilFoolFeatures, bool enterToSend, bool appBarTransparent, bool showBackgroundImage, String? customFonts, int? appColorScheme, Size? windowSize
 });
 
 
@@ -63,9 +63,10 @@ class _$AppSettingsCopyWithImpl<$Res>
 
 /// Create a copy of AppSettings
 /// with the given fields replaced by the non-null parameter values.
-@pragma('vm:prefer-inline') @override $Res call({Object? autoTranslate = null,Object? soundEffects = null,Object? aprilFoolFeatures = null,Object? enterToSend = null,Object? appBarTransparent = null,Object? showBackgroundImage = null,Object? customFonts = freezed,Object? appColorScheme = freezed,Object? windowSize = freezed,}) {
+@pragma('vm:prefer-inline') @override $Res call({Object? autoTranslate = null,Object? dataSavingMode = null,Object? soundEffects = null,Object? aprilFoolFeatures = null,Object? enterToSend = null,Object? appBarTransparent = null,Object? showBackgroundImage = null,Object? customFonts = freezed,Object? appColorScheme = freezed,Object? windowSize = freezed,}) {
   return _then(_self.copyWith(
 autoTranslate: null == autoTranslate ? _self.autoTranslate : autoTranslate // ignore: cast_nullable_to_non_nullable
+as bool,dataSavingMode: null == dataSavingMode ? _self.dataSavingMode : dataSavingMode // ignore: cast_nullable_to_non_nullable
 as bool,soundEffects: null == soundEffects ? _self.soundEffects : soundEffects // ignore: cast_nullable_to_non_nullable
 as bool,aprilFoolFeatures: null == aprilFoolFeatures ? _self.aprilFoolFeatures : aprilFoolFeatures // ignore: cast_nullable_to_non_nullable
 as bool,enterToSend: null == enterToSend ? _self.enterToSend : enterToSend // ignore: cast_nullable_to_non_nullable
@@ -156,10 +157,10 @@ return $default(_that);case _:
 /// }
 /// ```
 
-@optionalTypeArgs TResult maybeWhen<TResult extends Object?>(TResult Function( bool autoTranslate,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)?  $default,{required TResult orElse(),}) {final _that = this;
+@optionalTypeArgs TResult maybeWhen<TResult extends Object?>(TResult Function( bool autoTranslate,  bool dataSavingMode,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)?  $default,{required TResult orElse(),}) {final _that = this;
 switch (_that) {
 case _AppSettings() when $default != null:
-return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);case _:
+return $default(_that.autoTranslate,_that.dataSavingMode,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);case _:
   return orElse();
 
 }
@@ -177,10 +178,10 @@ return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_
 /// }
 /// ```
 
-@optionalTypeArgs TResult when<TResult extends Object?>(TResult Function( bool autoTranslate,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)  $default,) {final _that = this;
+@optionalTypeArgs TResult when<TResult extends Object?>(TResult Function( bool autoTranslate,  bool dataSavingMode,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)  $default,) {final _that = this;
 switch (_that) {
 case _AppSettings():
-return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);}
+return $default(_that.autoTranslate,_that.dataSavingMode,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);}
 }
 /// A variant of `when` that fallback to returning `null`
 ///
@@ -194,10 +195,10 @@ return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_
 /// }
 /// ```
 
-@optionalTypeArgs TResult? whenOrNull<TResult extends Object?>(TResult? Function( bool autoTranslate,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)?  $default,) {final _that = this;
+@optionalTypeArgs TResult? whenOrNull<TResult extends Object?>(TResult? Function( bool autoTranslate,  bool dataSavingMode,  bool soundEffects,  bool aprilFoolFeatures,  bool enterToSend,  bool appBarTransparent,  bool showBackgroundImage,  String? customFonts,  int? appColorScheme,  Size? windowSize)?  $default,) {final _that = this;
 switch (_that) {
 case _AppSettings() when $default != null:
-return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);case _:
+return $default(_that.autoTranslate,_that.dataSavingMode,_that.soundEffects,_that.aprilFoolFeatures,_that.enterToSend,_that.appBarTransparent,_that.showBackgroundImage,_that.customFonts,_that.appColorScheme,_that.windowSize);case _:
   return null;
 
 }
@@ -209,10 +210,11 @@ return $default(_that.autoTranslate,_that.soundEffects,_that.aprilFoolFeatures,_
 
 
 class _AppSettings implements AppSettings {
-  const _AppSettings({required this.autoTranslate, required this.soundEffects, required this.aprilFoolFeatures, required this.enterToSend, required this.appBarTransparent, required this.showBackgroundImage, required this.customFonts, required this.appColorScheme, required this.windowSize});
+  const _AppSettings({required this.autoTranslate, required this.dataSavingMode, required this.soundEffects, required this.aprilFoolFeatures, required this.enterToSend, required this.appBarTransparent, required this.showBackgroundImage, required this.customFonts, required this.appColorScheme, required this.windowSize});
   
 
 @override final  bool autoTranslate;
+@override final  bool dataSavingMode;
 @override final  bool soundEffects;
 @override final  bool aprilFoolFeatures;
 @override final  bool enterToSend;
@@ -233,16 +235,16 @@ _$AppSettingsCopyWith<_AppSettings> get copyWith => __$AppSettingsCopyWithImpl<_
 
 @override
 bool operator ==(Object other) {
-  return identical(this, other) || (other.runtimeType == runtimeType&&other is _AppSettings&&(identical(other.autoTranslate, autoTranslate) || other.autoTranslate == autoTranslate)&&(identical(other.soundEffects, soundEffects) || other.soundEffects == soundEffects)&&(identical(other.aprilFoolFeatures, aprilFoolFeatures) || other.aprilFoolFeatures == aprilFoolFeatures)&&(identical(other.enterToSend, enterToSend) || other.enterToSend == enterToSend)&&(identical(other.appBarTransparent, appBarTransparent) || other.appBarTransparent == appBarTransparent)&&(identical(other.showBackgroundImage, showBackgroundImage) || other.showBackgroundImage == showBackgroundImage)&&(identical(other.customFonts, customFonts) || other.customFonts == customFonts)&&(identical(other.appColorScheme, appColorScheme) || other.appColorScheme == appColorScheme)&&(identical(other.windowSize, windowSize) || other.windowSize == windowSize));
+  return identical(this, other) || (other.runtimeType == runtimeType&&other is _AppSettings&&(identical(other.autoTranslate, autoTranslate) || other.autoTranslate == autoTranslate)&&(identical(other.dataSavingMode, dataSavingMode) || other.dataSavingMode == dataSavingMode)&&(identical(other.soundEffects, soundEffects) || other.soundEffects == soundEffects)&&(identical(other.aprilFoolFeatures, aprilFoolFeatures) || other.aprilFoolFeatures == aprilFoolFeatures)&&(identical(other.enterToSend, enterToSend) || other.enterToSend == enterToSend)&&(identical(other.appBarTransparent, appBarTransparent) || other.appBarTransparent == appBarTransparent)&&(identical(other.showBackgroundImage, showBackgroundImage) || other.showBackgroundImage == showBackgroundImage)&&(identical(other.customFonts, customFonts) || other.customFonts == customFonts)&&(identical(other.appColorScheme, appColorScheme) || other.appColorScheme == appColorScheme)&&(identical(other.windowSize, windowSize) || other.windowSize == windowSize));
 }
 
 
 @override
-int get hashCode => Object.hash(runtimeType,autoTranslate,soundEffects,aprilFoolFeatures,enterToSend,appBarTransparent,showBackgroundImage,customFonts,appColorScheme,windowSize);
+int get hashCode => Object.hash(runtimeType,autoTranslate,dataSavingMode,soundEffects,aprilFoolFeatures,enterToSend,appBarTransparent,showBackgroundImage,customFonts,appColorScheme,windowSize);
 
 @override
 String toString() {
-  return 'AppSettings(autoTranslate: $autoTranslate, soundEffects: $soundEffects, aprilFoolFeatures: $aprilFoolFeatures, enterToSend: $enterToSend, appBarTransparent: $appBarTransparent, showBackgroundImage: $showBackgroundImage, customFonts: $customFonts, appColorScheme: $appColorScheme, windowSize: $windowSize)';
+  return 'AppSettings(autoTranslate: $autoTranslate, dataSavingMode: $dataSavingMode, soundEffects: $soundEffects, aprilFoolFeatures: $aprilFoolFeatures, enterToSend: $enterToSend, appBarTransparent: $appBarTransparent, showBackgroundImage: $showBackgroundImage, customFonts: $customFonts, appColorScheme: $appColorScheme, windowSize: $windowSize)';
 }
 
 
@@ -253,7 +255,7 @@ abstract mixin class _$AppSettingsCopyWith<$Res> implements $AppSettingsCopyWith
   factory _$AppSettingsCopyWith(_AppSettings value, $Res Function(_AppSettings) _then) = __$AppSettingsCopyWithImpl;
 @override @useResult
 $Res call({
- bool autoTranslate, bool soundEffects, bool aprilFoolFeatures, bool enterToSend, bool appBarTransparent, bool showBackgroundImage, String? customFonts, int? appColorScheme, Size? windowSize
+ bool autoTranslate, bool dataSavingMode, bool soundEffects, bool aprilFoolFeatures, bool enterToSend, bool appBarTransparent, bool showBackgroundImage, String? customFonts, int? appColorScheme, Size? windowSize
 });
 
 
@@ -270,9 +272,10 @@ class __$AppSettingsCopyWithImpl<$Res>
 
 /// Create a copy of AppSettings
 /// with the given fields replaced by the non-null parameter values.
-@override @pragma('vm:prefer-inline') $Res call({Object? autoTranslate = null,Object? soundEffects = null,Object? aprilFoolFeatures = null,Object? enterToSend = null,Object? appBarTransparent = null,Object? showBackgroundImage = null,Object? customFonts = freezed,Object? appColorScheme = freezed,Object? windowSize = freezed,}) {
+@override @pragma('vm:prefer-inline') $Res call({Object? autoTranslate = null,Object? dataSavingMode = null,Object? soundEffects = null,Object? aprilFoolFeatures = null,Object? enterToSend = null,Object? appBarTransparent = null,Object? showBackgroundImage = null,Object? customFonts = freezed,Object? appColorScheme = freezed,Object? windowSize = freezed,}) {
   return _then(_AppSettings(
 autoTranslate: null == autoTranslate ? _self.autoTranslate : autoTranslate // ignore: cast_nullable_to_non_nullable
+as bool,dataSavingMode: null == dataSavingMode ? _self.dataSavingMode : dataSavingMode // ignore: cast_nullable_to_non_nullable
 as bool,soundEffects: null == soundEffects ? _self.soundEffects : soundEffects // ignore: cast_nullable_to_non_nullable
 as bool,aprilFoolFeatures: null == aprilFoolFeatures ? _self.aprilFoolFeatures : aprilFoolFeatures // ignore: cast_nullable_to_non_nullable
 as bool,enterToSend: null == enterToSend ? _self.enterToSend : enterToSend // ignore: cast_nullable_to_non_nullable

lib/pods/config.g.dart

@@ -7,7 +7,7 @@ part of 'config.dart';
 // **************************************************************************
 
 String _$appSettingsNotifierHash() =>
-    r'e3c13307eabb0201487b85ab67b1ab493e588e71';
+    r'cd18bff2614a94e3523634e6c577cefad0367eba';
 
 /// See also [AppSettingsNotifier].
 @ProviderFor(AppSettingsNotifier)

lib/screens/settings.dart

@@ -450,6 +450,20 @@ class SettingsScreen extends HookConsumerWidget {
           },
         ),
       ),
+      ListTile(
+        minLeadingWidth: 48,
+        title: Text('settingsDataSavingMode').tr(),
+        contentPadding: const EdgeInsets.only(left: 24, right: 17),
+        leading: const Icon(Symbols.data_saver_on_rounded),
+        trailing: Switch(
+          value: settings.dataSavingMode,
+          onChanged: (value) {
+            ref
+                .read(appSettingsNotifierProvider.notifier)
+                .setDataSavingMode(value);
+          },
+        ),
+      ),
     ];
 
     // Desktop-specific settings

lib/widgets/content/cloud_file_collection.dart

@@ -5,11 +5,11 @@ import 'dart:ui';
 
 import 'package:dismissible_page/dismissible_page.dart';
 import 'package:easy_localization/easy_localization.dart';
+import 'package:flutter_blurhash/flutter_blurhash.dart';
 import 'package:file_saver/file_saver.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
-import 'package:flutter_blurhash/flutter_blurhash.dart';
 import 'package:flutter_hooks/flutter_hooks.dart';
 import 'package:gap/gap.dart';
 import 'package:gal/gal.dart';
@@ -804,155 +804,79 @@ class _CloudFileListEntry extends HookConsumerWidget {
 
 @override
 Widget build(BuildContext context, WidgetRef ref) {
+    final dataSaving = ref.watch(
+        appSettingsNotifierProvider.select((s) => s.dataSavingMode),
+    );
     final showMature = useState(false);
+    final showDataSaving = useState(!dataSaving);
+    final lockedByDS     = dataSaving && !showDataSaving.value;
+    final lockedByMature = file.sensitiveMarks.isNotEmpty && !showMature.value;
+    final meta = file.fileMeta is Map ? file.fileMeta as Map : const {};
+    final ratio = (meta['ratio'] is num && (meta['ratio'] as num) != 0)
+      ? (meta['ratio'] as num).toDouble()
+      : 1.0;
 
-    var content = Stack(
-      fit: StackFit.expand,
-      children: [
-        if (isImage)
-          Positioned.fill(
-            child:
-                file.fileMeta?['blur'] is String
-                    ? BlurHash(hash: file.fileMeta?['blur'])
-                    : ImageFiltered(
+    Widget bg = const SizedBox.shrink();
+    if (isImage) {
+        if (meta['blur'] is String) {
+            bg = BlurHash(hash: meta['blur'] as String);
+        } else if (!lockedByDS && !lockedByMature) {
+            bg = ImageFiltered(
                 imageFilter: ImageFilter.blur(sigmaX: 10, sigmaY: 10),
-                      child: CloudFileWidget(item: file, noBlurhash: true),
+                child: CloudFileWidget(
+                    item: file,
+                    noBlurhash: true,
+                    useInternalGate: false,
                 ),
-          ),
-        if (isImage)
-          CloudFileWidget(
+            );
+        } else {
+            bg = const ColoredBox(color: Colors.black26);
+        }
+    }
+
+    final bool fullyUnlocked = !lockedByDS && !lockedByMature;
+    Widget fg = fullyUnlocked
+        ? (isImage
+            ? CloudFileWidget(
                 item: file,
                 heroTag: heroTag,
                 noBlurhash: true,
                 fit: BoxFit.contain,
+                useInternalGate: false,
             )
-        else
-          CloudFileWidget(item: file, heroTag: heroTag, fit: BoxFit.contain),
-      ],
-    );
+            : CloudFileWidget(
+                item: file,
+                heroTag: heroTag,
+                fit: BoxFit.contain,
+                useInternalGate: false,
+            )
+        )
+        : AspectRatio(aspectRatio: ratio, child: const SizedBox.shrink());
 
-    if (file.sensitiveMarks.isNotEmpty) {
-      // Show a blurred overlay only when not revealed yet, with a smooth transition
-      content = Stack(
-        children: [
-          content,
-          // Toggle blur overlay with animation
-          Positioned.fill(
-            child: AnimatedSwitcher(
-              duration: const Duration(milliseconds: 250),
-              switchInCurve: Curves.easeOut,
-              switchOutCurve: Curves.easeIn,
-              layoutBuilder:
-                  (currentChild, previousChildren) => Stack(
-                    fit: StackFit.expand,
-                    children: [
-                      ...previousChildren,
-                      if (currentChild != null) currentChild,
-                    ],
-                  ),
-              child:
-                  showMature.value
-                      ? const SizedBox.shrink(key: ValueKey('revealed'))
-                      : ColoredBox(
-                        key: const ValueKey('blurred'),
-                        color: Colors.transparent,
-                        child: BackdropFilter(
-                          filter: ImageFilter.blur(sigmaX: 64, sigmaY: 64),
-                          child: Stack(
-                            fit: StackFit.expand,
-                            children: [
-                              const ColoredBox(color: Colors.transparent),
-                              Center(
-                                child: Container(
-                                  margin: const EdgeInsets.all(12),
-                                  padding: const EdgeInsets.symmetric(
-                                    horizontal: 12,
-                                    vertical: 8,
-                                  ),
-                                  decoration: BoxDecoration(
-                                    color: Colors.black54,
-                                    borderRadius: BorderRadius.circular(12),
-                                  ),
-                                  child: ConstrainedBox(
-                                    constraints: const BoxConstraints(
-                                      maxWidth: 280,
-                                    ),
-                                    child: Column(
-                                      mainAxisSize: MainAxisSize.min,
-                                      children: [
-                                        const Icon(
-                                          Icons.warning,
-                                          color: Colors.white,
-                                          fill: 1,
-                                          size: 24,
-                                        ),
-                                        const Gap(4),
-                                        Text(
-                                          file.sensitiveMarks
-                                              .map(
-                                                (e) =>
-                                                    SensitiveCategory
-                                                        .values[e]
-                                                        .i18nKey
-                                                        .tr(),
-                                              )
-                                              .join(' · '),
-                                          style: const TextStyle(
-                                            color: Colors.white,
-                                            fontWeight: FontWeight.w600,
-                                          ),
-                                          textAlign: TextAlign.center,
-                                        ),
-                                        Text(
-                                          'Sensitive Content',
-                                          style: TextStyle(
-                                            color: Colors.white,
-                                            fontSize: 13,
-                                          ),
-                                        ),
-                                        const Gap(4),
-                                        Text(
-                                          'Tap to Reveal',
-                                          style: TextStyle(
-                                            color: Colors.white,
-                                            fontSize: 11,
-                                          ),
-                                        ),
-                                      ],
-                                    ),
-                                  ).padding(horizontal: 24, vertical: 16),
-                                ),
-                              ),
-                            ],
-                          ),
-                        ),
-                      ),
-            ),
-          ),
-          // When revealed (no blur), show a small control at top-left to re-enable blur
-          if (showMature.value)
-            Positioned(
-              top: 3,
-              left: 4,
-              child: IconButton(
-                iconSize: 16,
-                constraints: const BoxConstraints(),
-                icon: const Icon(Icons.visibility_off, color: Colors.white),
-                tooltip: 'Blur content',
-                onPressed: () {
-                  showMature.value = false;
-                },
-              ),
-            ),
-        ],
-      );
+    Widget overlays;
+    if (lockedByDS) {
+        overlays = _DataSavingOverlay();
+    } else if (lockedByMature) {
+        overlays = _SensitiveOverlay(file: file);
+    } else {
+        overlays = const SizedBox.shrink();
     }
 
-    if (onTap != null) {
+    final content = Stack(
+        fit: StackFit.expand,
+        children: [
+            if (isImage) Positioned.fill(child: bg),
+            fg,
+            overlays,
+        ],
+    );
+
     return InkWell(
         borderRadius: const BorderRadius.all(Radius.circular(16)),
         onTap: () {
-          if (!showMature.value) {
+            if (lockedByDS) {
+                showDataSaving.value = true;
+            } else if (lockedByMature) {
                 showMature.value = true;
             } else {
                 onTap?.call();
@@ -961,7 +885,88 @@ class _CloudFileListEntry extends HookConsumerWidget {
         child: content,
     );
 }
+}
 
-    return content;
+class _SensitiveOverlay extends StatelessWidget {
+  final SnCloudFile file;
+  const _SensitiveOverlay({required this.file});
+
+  @override
+  Widget build(BuildContext context) {
+    return BackdropFilter(
+      filter: ImageFilter.blur(sigmaX: 64, sigmaY: 64),
+      child: Container(
+        color: Colors.transparent,
+        child: Center(
+          child: _OverlayCard(
+            icon: Icons.warning,
+            title: file.sensitiveMarks
+                .map((e) => SensitiveCategory.values[e].i18nKey.tr())
+                .join(' · '),
+            subtitle: 'Sensitive Content',
+            hint: 'Tap to Reveal',
+          ),
+        ),
+      ),
+    );
+  }
+}
+
+class _DataSavingOverlay extends StatelessWidget {
+  @override
+  Widget build(BuildContext context) {
+    return ColoredBox(
+      color: Colors.black38,
+      child: Center(
+        child: _OverlayCard(
+          icon: Symbols.image,
+          title: 'Data Saving Mode',
+          subtitle: '',
+          hint: 'Tap to Load',
+        ),
+      ),
+    );
+  }
+}
+class _OverlayCard extends StatelessWidget {
+  final IconData icon;
+  final String title;
+  final String subtitle;
+  final String hint;
+
+  const _OverlayCard({
+    required this.icon,
+    required this.title,
+    required this.subtitle,
+    required this.hint,
+  });
+
+  @override
+  Widget build(BuildContext context) {
+    return Container(
+      margin: const EdgeInsets.all(12),
+      padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 8),
+      decoration: BoxDecoration(
+        color: Colors.black54,
+        borderRadius: BorderRadius.circular(12),
+      ),
+      constraints: const BoxConstraints(maxWidth: 280),
+      child: Column(
+        mainAxisSize: MainAxisSize.min,
+        children: [
+          Icon(icon, color: Colors.white, size: 24),
+          const Gap(4),
+          Text(title,
+              style: const TextStyle(
+                  color: Colors.white, fontWeight: FontWeight.w600),
+              textAlign: TextAlign.center),
+          Text(subtitle,
+              style: const TextStyle(color: Colors.white, fontSize: 13)),
+          const Gap(4),
+          Text(hint,
+              style: const TextStyle(color: Colors.white, fontSize: 11)),
+        ],
+      ),
+    );
   }
 }

lib/widgets/content/cloud_files.dart

@@ -14,6 +14,7 @@ import 'package:island/widgets/content/audio.dart';
 import 'package:material_symbols_icons/symbols.dart';
 import 'package:styled_widget/styled_widget.dart';
 import 'package:url_launcher/url_launcher_string.dart';
+import 'package:island/widgets/data_saving_gate.dart';
 
 import 'image.dart';
 import 'video.dart';
@@ -23,40 +24,51 @@ class CloudFileWidget extends HookConsumerWidget {
   final BoxFit fit;
   final String? heroTag;
   final bool noBlurhash;
+  final bool useInternalGate;
   const CloudFileWidget({
     super.key,
     required this.item,
     this.fit = BoxFit.cover,
     this.heroTag,
     this.noBlurhash = false,
+    this.useInternalGate = true,
   });
 
   @override
   Widget build(BuildContext context, WidgetRef ref) {
+    final dataSaving = ref.watch(
+      appSettingsNotifierProvider.select((s) => s.dataSavingMode),
+    );
     final serverUrl = ref.watch(serverUrlProvider);
     final uri = '$serverUrl/drive/files/${item.id}';
 
-    var ratio =
-        item.fileMeta?['ratio'] is num
-            ? item.fileMeta!['ratio'].toDouble()
-            : 1.0;
+    final unlocked = useState(false);
+
+    final meta = item.fileMeta is Map ? (item.fileMeta as Map) : const {};
+    final blurHash = noBlurhash ? null : (meta['blur'] as String?);
+    var ratio = meta['ratio'] is num ? (meta['ratio'] as num).toDouble() : 1.0;
     if (ratio == 0) ratio = 1.0;
+
+    Widget cloudImage() => UniversalImage(uri: uri, blurHash: blurHash, fit: fit);
+    Widget cloudVideo() => CloudVideoWidget(item: item);
+
+    Widget dataPlaceHolder(IconData icon) => _DataSavingPlaceholder(
+          icon: icon,
+          onTap: () {
+            unlocked.value = true;
+          },
+        );
+
     var content = switch (item.mimeType?.split('/').firstOrNull) {
-      "image" => AspectRatio(
+      'image' => AspectRatio(
           aspectRatio: ratio,
-        child: UniversalImage(
-          uri: uri,
-          blurHash:
-              noBlurhash
-                  ? null
-                  : (item.fileMeta is String ? item.fileMeta!['blur'] : null),
+          child: (useInternalGate && dataSaving && !unlocked.value) ? dataPlaceHolder(Symbols.image) : cloudImage(),
         ),
-      ),
-      "video" => AspectRatio(
+      'video' => AspectRatio(
           aspectRatio: ratio,
-        child: CloudVideoWidget(item: item),
+          child: (useInternalGate && dataSaving && !unlocked.value) ? dataPlaceHolder(Symbols.play_arrow) : cloudVideo(),
         ),
-      "audio" => Center(
+      'audio' => Center(
           child: ConstrainedBox(
             constraints: BoxConstraints(
               maxWidth: math.min(360, MediaQuery.of(context).size.width * 0.8),
@@ -113,6 +125,35 @@ class CloudFileWidget extends HookConsumerWidget {
   }
 }
 
+class _DataSavingPlaceholder extends StatelessWidget {
+  final IconData icon;
+  final VoidCallback onTap;
+  const _DataSavingPlaceholder({required this.icon, required this.onTap});
+
+  @override
+  Widget build(BuildContext context) {
+    return GestureDetector(
+      onTap: onTap,
+      child: Container(
+        color: Colors.black26,
+        alignment: Alignment.center,
+        child: Column(
+          mainAxisSize: MainAxisSize.min,
+          children: [
+            Icon(icon, size: 36,
+              color: Theme.of(context).colorScheme.onSurfaceVariant),
+            const Gap(8),
+            Text(
+              'dataSavingHint'.tr(),
+              style: Theme.of(context).textTheme.bodySmall,
+              textAlign: TextAlign.center,
+            ),
+          ],
+        ),
+      ),
+    );
+  }
+}
 class CloudVideoWidget extends HookConsumerWidget {
   final SnCloudFile item;
   const CloudVideoWidget({super.key, required this.item});
@@ -314,29 +355,32 @@ class ProfilePictureWidget extends ConsumerWidget {
 @override
   Widget build(BuildContext context, WidgetRef ref) {
     final serverUrl = ref.watch(serverUrlProvider);
-    final uri = '$serverUrl/drive/files/${file?.id ?? fileId}';
+    final String? id = file?.id ?? fileId;
+
+    final fallback = Icon(
+      fallbackIcon ?? Symbols.account_circle,
+      size: radius,
+      color: fallbackColor ?? Theme.of(context).colorScheme.onPrimaryContainer,
+    ).center();
 
     return ClipRRect(
-      borderRadius:
-          borderRadius == null
+      borderRadius: borderRadius == null
           ? BorderRadius.all(Radius.circular(radius))
           : BorderRadius.all(Radius.circular(borderRadius!)),
       child: Container(
         width: radius * 2,
         height: radius * 2,
         color: Theme.of(context).colorScheme.primaryContainer,
-        child:
-            file != null
-                ? CloudFileWidget(item: file!, fit: BoxFit.cover)
-                : fileId == null
-                ? Icon(
-                  fallbackIcon ?? Symbols.account_circle,
-                  size: radius,
-                  color:
-                      fallbackColor ??
-                      Theme.of(context).colorScheme.onPrimaryContainer,
-                ).center()
-                : UniversalImage(uri: uri, fit: BoxFit.cover),
+        child: id == null
+            ? fallback
+            : DataSavingGate(
+                bypass: true,
+                placeholder: fallback,
+                content: () => UniversalImage(
+                  uri: '$serverUrl/drive/files/$id',
+                  fit: BoxFit.cover,
+                ),
+              ),
       ),
     );
   }

lib/widgets/data_saving_gate.dart

@@ -0,0 +1,27 @@
+import 'package:flutter/material.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:island/pods/config.dart';
+
+
+typedef WidgetBuilder0 = Widget Function();
+
+class DataSavingGate extends ConsumerWidget {
+  final bool bypass;
+  final WidgetBuilder0 content;
+  final Widget placeholder;
+
+  const DataSavingGate({
+    super.key,
+    required this.bypass,
+    required this.content,
+    required this.placeholder,
+  });
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final dataSaving =
+        ref.watch(appSettingsNotifierProvider.select((s) => s.dataSavingMode));
+    if (bypass || !dataSaving) return content();
+    return placeholder;
+  }
+}