Add settings screen on mobile (#463)

* Refactor profile drawer to sub component

* Added setting page, routing with some options

* Added setting service

* Implement three stage settings

* get app setting for three stage loading

mobile/lib/modules/settings/ui/image_viewer_quality_setting/image_viewer_quality_setting.dart

@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+import 'package:immich_mobile/modules/settings/ui/image_viewer_quality_setting/three_stage_loading.dart';
+
+class ImageViewerQualitySetting extends StatelessWidget {
+  const ImageViewerQualitySetting({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return const ExpansionTile(
+      title: Text(
+        'Image viewer quality',
+        style: TextStyle(
+          fontWeight: FontWeight.bold,
+        ),
+      ),
+      subtitle: Text(
+        'Adjust the quality of the detail image viewer',
+        style: TextStyle(
+          fontSize: 13,
+        ),
+      ),
+      children: [
+        ThreeStageLoading(),
+      ],
+    );
+  }
+}

mobile/lib/modules/settings/ui/image_viewer_quality_setting/three_stage_loading.dart

@@ -0,0 +1,54 @@
+import 'package:flutter/material.dart';
+import 'package:flutter_hooks/flutter_hooks.dart';
+import 'package:hooks_riverpod/hooks_riverpod.dart';
+import 'package:immich_mobile/shared/services/app_settings.service.dart';
+
+class ThreeStageLoading extends HookConsumerWidget {
+  const ThreeStageLoading({
+    Key? key,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context, WidgetRef ref) {
+    final appSettingService = ref.watch(appSettingsServiceProvider);
+
+    final isEnable = useState(false);
+
+    useEffect(
+      () {
+        var isThreeStageLoadingEnable =
+            appSettingService.getSetting(AppSettingsEnum.threeStageLoading);
+
+        isEnable.value = isThreeStageLoadingEnable;
+        return null;
+      },
+      [],
+    );
+
+    void onSwitchChanged(bool switchValue) {
+      appSettingService.setSetting(
+        AppSettingsEnum.threeStageLoading,
+        switchValue,
+      );
+      isEnable.value = switchValue;
+    }
+
+    return SwitchListTile.adaptive(
+      title: const Text(
+        "Enable three stage loading",
+        style: TextStyle(
+          fontSize: 12,
+          fontWeight: FontWeight.bold,
+        ),
+      ),
+      subtitle: const Text(
+        "The three-stage loading delivers the best quality image in exchange for a slower loading speed",
+        style: TextStyle(
+          fontSize: 12,
+        ),
+      ),
+      value: isEnable.value,
+      onChanged: onSwitchChanged,
+    );
+  }
+}