more refactors and logs page handling

This commit is contained in:
shenlong-tanwen
2024-10-23 02:30:46 +05:30
parent 8f47645cdb
commit a0afea04d8
90 changed files with 2386 additions and 584 deletions
@@ -26,6 +26,8 @@ class _HomePageState extends State<HomePage> {
@override
Widget build(BuildContext context) {
final gridHasPadding = !context.isTablet && _showAppBar.value;
return Scaffold(
body: BlocProvider(
create: (_) => AssetGridCubit(
@@ -33,32 +35,35 @@ class _HomePageState extends State<HomePage> {
),
child: Stack(children: [
ImAssetGrid(
topPadding: kToolbarHeight + context.mediaQueryPadding.top - 8,
),
ValueListenableBuilder(
valueListenable: _showAppBar,
builder: (_, shouldShow, appBar) {
final Duration duration;
if (shouldShow) {
// Animate out app bar slower
duration = Durations.short3;
} else {
// Animate in app bar faster
duration = Durations.medium2;
}
return AnimatedPositioned(
duration: duration,
curve: Curves.easeOut,
left: 0,
right: 0,
top: shouldShow
? 0
: -(kToolbarHeight + context.mediaQueryPadding.top),
child: appBar!,
);
},
child: const ImAppBar(),
topPadding: gridHasPadding
? kToolbarHeight + context.mediaQueryPadding.top - 8
: null,
),
if (!context.isTablet)
ValueListenableBuilder(
valueListenable: _showAppBar,
builder: (_, shouldShow, appBar) {
final Duration duration;
if (shouldShow) {
// Animate out app bar slower
duration = Durations.short3;
} else {
// Animate in app bar faster
duration = Durations.medium2;
}
return AnimatedPositioned(
left: 0,
top: shouldShow
? 0
: -(kToolbarHeight + context.mediaQueryPadding.top),
right: 0,
curve: Curves.easeOut,
duration: duration,
child: appBar!,
);
},
child: const ImAppBar(),
),
]),
),
);
@@ -1,3 +1,5 @@
import 'dart:async';
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:flutter_bloc/flutter_bloc.dart';
@@ -55,15 +57,15 @@ class _LoginPageState extends State<LoginPage>
void _onLoginPageStateChange(BuildContext context, LoginPageState state) {
if (state.isLoginSuccessful) {
context.replaceRoute(const TabControllerRoute());
unawaited(context.replaceRoute(const TabControllerRoute()));
}
}
@override
Widget build(BuildContext context) {
final PreferredSizeWidget? appBar;
late final Widget primaryBody;
late final Widget secondaryBody;
final Widget primaryBody;
final Widget secondaryBody;
Widget rotatingLogo = GestureDetector(
onDoubleTap: _populateDemoCredentials,
@@ -73,7 +75,7 @@ class _LoginPageState extends State<LoginPage>
children: [
RotationTransition(
turns: _animationController,
child: const ImLogo(width: 100),
child: const ImLogo(dimension: 100),
),
const SizedGap.lh(),
const ImLogoText(),
@@ -104,7 +106,7 @@ class _LoginPageState extends State<LoginPage>
),
),
TextButton(
onPressed: () => context.navigateRoot(const LogsRoute()),
onPressed: () => unawaited(context.navigateRoot(const LogsRoute())),
child: const Text('Logs'),
),
],
@@ -122,7 +124,9 @@ class _LoginPageState extends State<LoginPage>
fontWeight: FontWeight.w500,
),
child: InkWell(
onTap: () => launchUrl(Uri.parse(_serverUrlController.text)),
onTap: () => unawaited(
launchUrl(Uri.parse(_serverUrlController.text)),
),
child: Text(
_serverUrlController.text,
textAlign: TextAlign.center,
@@ -157,12 +161,12 @@ class _LoginPageState extends State<LoginPage>
bottom,
]),
);
secondaryBody = const SizedBox.shrink();
}
return BlocListener<LoginPageCubit, LoginPageState>(
listener: _onLoginPageStateChange,
child: Scaffold(
resizeToAvoidBottomInset: false,
appBar: appBar,
body: SafeArea(
child: ImAdaptiveScaffoldBody(
@@ -170,6 +174,7 @@ class _LoginPageState extends State<LoginPage>
secondaryBody: (_) => secondaryBody,
),
),
resizeToAvoidBottomInset: false,
),
);
}
@@ -182,13 +187,14 @@ class _MobileAppBar extends StatelessWidget implements PreferredSizeWidget {
Widget build(BuildContext context) {
return AppBar(
automaticallyImplyLeading: false,
scrolledUnderElevation: 0.0,
actions: [
IconButton(
onPressed: () => context.navigateRoot(const SettingsRoute()),
onPressed: () =>
unawaited(context.navigateRoot(const SettingsRoute())),
icon: const Icon(Symbols.settings),
),
],
scrolledUnderElevation: 0.0,
);
}
@@ -61,7 +61,7 @@ class LoginPageCubit extends Cubit<LoginPageState> with LogMixin {
// Check for /.well-known/immich
url = await loginService.resolveEndpoint(uri);
di<IStoreRepository>().upsert(StoreKey.serverEndpoint, url);
await di<IStoreRepository>().upsert(StoreKey.serverEndpoint, url);
await di<LoginService>().handlePostUrlResolution(url);
emit(state.copyWith(isServerValidated: true));
@@ -34,14 +34,14 @@ class LoginForm extends StatelessWidget {
builder: (_, isServerValidated) => SingleChildScrollView(
child: AnimatedSwitcher(
duration: Durations.medium1,
layoutBuilder: (current, previous) =>
current ?? (previous.lastOrNull ?? const SizedBox.shrink()),
child: isServerValidated
? _CredentialsForm(
emailController: emailController,
passwordController: passwordController,
)
: _ServerForm(controller: serverUrlController),
layoutBuilder: (current, previous) =>
current ?? (previous.lastOrNull ?? const SizedBox.shrink()),
),
),
);
@@ -75,13 +75,13 @@ class _ServerFormState extends State<_ServerForm> {
child: BlocSelector<LoginPageCubit, LoginPageState, bool>(
selector: (model) => model.isValidationInProgress,
builder: (_, isValidationInProgress) => Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
ImTextFormField(
controller: widget.controller,
label: context.t.login.label.endpoint,
validator: context.read<LoginPageCubit>().validateServerUrl,
label: context.t.login.label.endpoint,
autoFillHints: const [AutofillHints.url],
keyboardType: TextInputType.url,
textInputAction: TextInputAction.go,
@@ -89,10 +89,10 @@ class _ServerFormState extends State<_ServerForm> {
),
const SizedGap.mh(),
ImFilledButton(
label: context.t.login.label.next_button,
icon: Symbols.arrow_forward_rounded,
onPressed: () => unawaited(_validateForm(context)),
isDisabled: isValidationInProgress,
label: context.t.login.label.next_button,
),
const SizedGap.mh(),
if (isValidationInProgress) const ImLoadingIndicator(),
@@ -117,11 +117,11 @@ class _CredentialsForm extends StatefulWidget {
}
class _CredentialsFormState extends State<_CredentialsForm> {
final passwordFocusNode = FocusNode();
final _passwordFocusNode = FocusNode();
@override
void dispose() {
passwordFocusNode.dispose();
_passwordFocusNode.dispose();
super.dispose();
}
@@ -134,28 +134,27 @@ class _CredentialsFormState extends State<_CredentialsForm> {
: ValueListenableBuilder(
valueListenable: di<ServerFeatureConfigProvider>(),
builder: (_, state, __) => Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
if (state.features.hasPasswordLogin) ...[
ImTextFormField(
controller: widget.emailController,
label: context.t.login.label.email,
isDisabled: isValidationInProgress,
textInputAction: TextInputAction.next,
onSubmitted: (_) => passwordFocusNode.requestFocus(),
isDisabled: isValidationInProgress,
onSubmitted: (_) => _passwordFocusNode.requestFocus(),
),
const SizedGap.mh(),
ImPasswordFormField(
controller: widget.passwordController,
focusNode: _passwordFocusNode,
label: context.t.login.label.password,
focusNode: passwordFocusNode,
isDisabled: isValidationInProgress,
textInputAction: TextInputAction.go,
isDisabled: isValidationInProgress,
),
const SizedGap.mh(),
ImFilledButton(
label: context.t.login.label.login_button,
icon: Symbols.login_rounded,
onPressed: () => unawaited(
context.read<LoginPageCubit>().passwordLogin(
@@ -163,31 +162,32 @@ class _CredentialsFormState extends State<_CredentialsForm> {
password: widget.passwordController.text,
),
),
label: context.t.login.label.login_button,
),
// Divider when both password and oAuth login is enabled
if (state.features.hasOAuthLogin) const Divider(),
],
if (state.features.hasOAuthLogin)
ImFilledButton(
label: state.config.oauthButtonText ??
context.t.login.label.oauth_button,
icon: Symbols.pin_rounded,
onPressed: () => unawaited(
context.read<LoginPageCubit>().oAuthLogin(),
),
label: state.config.oauthButtonText ??
context.t.login.label.oauth_button,
),
if (!state.features.hasPasswordLogin &&
!state.features.hasOAuthLogin)
ImFilledButton(
label: context.t.login.label.login_disabled,
isDisabled: true,
label: context.t.login.label.login_disabled,
),
const SizedGap.sh(),
ImTextButton(
label: context.t.login.label.back_button,
icon: Symbols.arrow_back_rounded,
onPressed:
context.read<LoginPageCubit>().resetServerValidation,
label: context.t.login.label.back_button,
),
],
),
@@ -1,12 +0,0 @@
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
@RoutePage()
class LogsPage extends StatelessWidget {
const LogsPage({super.key});
@override
Widget build(BuildContext context) {
return const Scaffold(body: Center(child: Text("Logs Page")));
}
}
@@ -0,0 +1,201 @@
import 'dart:async';
import 'package:auto_route/auto_route.dart';
import 'package:dynamic_color/dynamic_color.dart';
import 'package:flutter/material.dart';
import 'package:immich_mobile/domain/interfaces/log.interface.dart';
import 'package:immich_mobile/domain/models/log.model.dart';
import 'package:immich_mobile/i18n/strings.g.dart';
import 'package:immich_mobile/presentation/components/common/gap.widget.dart';
import 'package:immich_mobile/presentation/components/common/skeletonized_future_builder.widget.dart';
import 'package:immich_mobile/presentation/components/scaffold/adaptive_route_appbar.widget.dart';
import 'package:immich_mobile/presentation/components/scaffold/adaptive_route_wrapper.widget.dart';
import 'package:immich_mobile/presentation/router/router.dart';
import 'package:immich_mobile/presentation/theme/app_typography.dart';
import 'package:immich_mobile/service_locator.dart';
import 'package:immich_mobile/utils/constants/size_constants.dart';
import 'package:immich_mobile/utils/extensions/build_context.extension.dart';
import 'package:immich_mobile/utils/extensions/color.extension.dart';
import 'package:immich_mobile/utils/log_manager.dart';
import 'package:intl/intl.dart';
import 'package:material_symbols_icons/material_symbols_icons.dart';
import 'package:skeletonizer/skeletonizer.dart';
@RoutePage()
class LogsWrapperPage extends StatelessWidget {
const LogsWrapperPage({super.key});
@override
Widget build(BuildContext context) {
return ImAdaptiveRouteWrapper(
primaryRoute: LogsRoute.name,
primaryBody: (_) => const LogsPage(),
bodyRatio: RatioConstants.oneThird,
);
}
}
@RoutePage()
class LogsPage extends StatefulWidget {
const LogsPage({super.key});
@override
State createState() => _LogsPageState();
}
class _LogsPageState extends State<LogsPage> {
void _onClearLogs() {
// refetch logs on clear
setState(() {
unawaited(LogManager.I.clearLogs());
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: ImAdaptiveRouteAppBar(
title: context.t.logs.title,
isPrimary: true,
actions: [
IconButton(
onPressed: _onClearLogs,
icon: Icon(Symbols.delete_rounded),
),
],
),
body: SkeletonizedFutureBuilder(
future: di<ILogRepository>().getAll(),
builder: (_, data) => _LogList(logs: data!),
loadingBuilder: (_) => const _LogListShimmer(),
errorBuilder: (_, __) => const _LogListEmpty(),
emptyBuilder: (_) => const _LogListEmpty(),
emptyWhen: (data) => data == null || data.isEmpty,
),
);
}
}
class _LogLevelIndicator extends StatelessWidget {
final LogLevel level;
const _LogLevelIndicator({required this.level});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(
color: switch (level) {
LogLevel.info => context.colorScheme.primary,
LogLevel.error ||
LogLevel.wtf =>
Colors.redAccent.harmonizeWith(context.colorScheme.primary),
LogLevel.warning =>
Colors.orangeAccent.harmonizeWith(context.colorScheme.primary),
LogLevel.verbose ||
LogLevel.debug =>
Colors.grey.harmonizeWith(context.colorScheme.primary),
},
shape: BoxShape.circle,
),
width: 10,
height: 10,
);
}
}
class _LogList extends StatelessWidget {
final List<LogMessage> logs;
const _LogList({required this.logs});
/// Truncate the log message to a [maxLines]] number of lines
String _truncateLogMessage(String message) {
final msg = message.split("\n").firstOrNull;
return msg?.substring(0, 75.clamp(0, msg.length)) ?? message;
}
Color _getTileColor(BuildContext context, LogLevel level) {
return switch (level) {
LogLevel.info => Colors.transparent,
LogLevel.error || LogLevel.wtf => Colors.redAccent
.harmonizeWith(context.colorScheme.primary)
.withOpacity(RatioConstants.halfQuarter),
LogLevel.warning => Colors.orangeAccent
.harmonizeWith(context.colorScheme.primary)
.withOpacity(RatioConstants.halfQuarter),
LogLevel.verbose || LogLevel.debug => context.colorScheme.primary
.harmonizeWith(context.colorScheme.primary)
.withOpacity(RatioConstants.halfQuarter),
};
}
@override
Widget build(BuildContext context) {
return ListView.separated(
itemBuilder: (_, i) {
final log = logs[i];
return ListTile(
leading: _LogLevelIndicator(level: log.level),
title: Text(
_truncateLogMessage(log.content),
style: AppTypography.bodyMedium,
),
subtitle: Text(
"at ${DateFormat("HH:mm:ss.SSS").format(log.createdAt)} in ${log.logger ?? "<NA>"}",
style: AppTypography.bodyMedium.copyWith(
color: context.colorScheme.onSurface
.darken(amount: RatioConstants.oneThird),
),
),
trailing: const Icon(Symbols.arrow_forward_ios_rounded, size: 18),
dense: true,
visualDensity: VisualDensity.compact,
tileColor: _getTileColor(context, log.level),
minLeadingWidth: 10,
);
},
separatorBuilder: (_, __) => Divider(height: 0),
itemCount: logs.length,
);
}
}
class _LogListShimmer extends StatelessWidget {
const _LogListShimmer();
@override
Widget build(BuildContext context) {
return ListView.separated(
itemBuilder: (_, __) => ListTile(
leading: Bone.circle(size: 20),
title: Bone.text(words: 3),
subtitle: Bone.text(words: 1),
),
separatorBuilder: (_, __) => Divider(height: 5, thickness: 0.5),
itemCount: 15,
);
}
}
class _LogListEmpty extends StatelessWidget {
const _LogListEmpty();
@override
Widget build(BuildContext context) {
return Center(
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
Icon(
Symbols.comments_disabled_rounded,
size: 50,
color: context.colorScheme.primary,
),
const SizedGap.mh(),
Text(context.t.logs.no_logs),
],
),
);
}
}
@@ -5,18 +5,18 @@ import 'package:material_symbols_icons/symbols.dart';
enum SettingSection {
general._(
icon: Symbols.interests_rounded,
labelKey: 'settings.sections.general',
icon: Symbols.interests_rounded,
destination: GeneralSettingsRoute(),
),
advance._(
icon: Symbols.build_rounded,
labelKey: 'settings.sections.advance',
icon: Symbols.build_rounded,
destination: AdvanceSettingsRoute(),
),
about._(
icon: Symbols.help_rounded,
labelKey: 'settings.sections.about',
icon: Symbols.help_rounded,
destination: AboutSettingsRoute(),
);
@@ -12,14 +12,14 @@ class AboutSettingsPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: const ImAdaptiveRouteSecondaryAppBar(),
appBar: const ImAdaptiveRouteAppBar(isPrimary: false),
body: ListTile(
title: Text(context.t.settings.about.third_party_title),
subtitle: Text(context.t.settings.about.third_party_sub_title),
onTap: () => showLicensePage(
context: context,
applicationName: context.t.immich,
applicationIcon: const ImLogo(width: SizeConstants.xl),
applicationIcon: const ImLogo(dimension: SizeConstants.xl),
),
),
);
@@ -9,7 +9,7 @@ class AdvanceSettingsPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const Scaffold(
appBar: ImAdaptiveRouteSecondaryAppBar(),
appBar: ImAdaptiveRouteAppBar(isPrimary: false),
body: Center(child: Text('Advanced Settings')),
);
}
@@ -9,7 +9,7 @@ class GeneralSettingsPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return const Scaffold(
appBar: ImAdaptiveRouteSecondaryAppBar(),
appBar: ImAdaptiveRouteAppBar(isPrimary: false),
body: Center(child: Text('General Settings')),
);
}
@@ -1,3 +1,5 @@
import 'dart:async';
import 'package:auto_route/auto_route.dart';
import 'package:flutter/material.dart';
import 'package:immich_mobile/i18n/strings.g.dart';
@@ -15,32 +17,31 @@ class SettingsWrapperPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ImAdaptiveRouteWrapper(
primaryBody: (_) => const SettingsPage(),
primaryRoute: SettingsRoute.name,
bodyRatio: BodyRatioConstants.oneThird,
primaryBody: (_) => const SettingsPage(),
bodyRatio: RatioConstants.oneThird,
);
}
}
@RoutePage()
// ignore: prefer-single-widget-per-file
class SettingsPage extends StatelessWidget {
const SettingsPage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: const ImAdaptiveRoutePrimaryAppBar(),
appBar: const ImAdaptiveRouteAppBar(isPrimary: true),
body: ListView.builder(
itemCount: SettingSection.values.length,
itemBuilder: (_, index) {
final section = SettingSection.values.elementAt(index);
return ListTile(
title: Text(context.t[section.labelKey]),
onTap: () => context.navigateRoot(section.destination),
leading: Icon(section.icon),
title: Text(context.t[section.labelKey]),
onTap: () => unawaited(context.navigateRoot(section.destination)),
);
},
itemCount: SettingSection.values.length,
),
);
}