diff --git a/lib/providers/navigation.dart b/lib/providers/navigation.dart
index ec8e037..2a4e3a2 100644
--- a/lib/providers/navigation.dart
+++ b/lib/providers/navigation.dart
@@ -60,11 +60,6 @@ class NavigationProvider extends ChangeNotifier {
screen: 'chat',
label: 'screenChat',
),
- AppNavDestination(
- icon: Icon(Symbols.account_circle, weight: 400, opticalSize: 20),
- screen: 'account',
- label: 'screenAccount',
- ),
AppNavDestination(
icon: Icon(Symbols.group, weight: 400, opticalSize: 20),
screen: 'realm',
diff --git a/lib/router.dart b/lib/router.dart
index e8a8926..2e6b512 100644
--- a/lib/router.dart
+++ b/lib/router.dart
@@ -127,102 +127,111 @@ final _appRoutes = [
),
],
),
- GoRoute(
- path: '/account',
- name: 'account',
- builder: (context, state) => const AccountScreen(),
+ ShellRoute(
+ builder: (context, state, child) => ResponsiveScaffold(
+ aside: const AccountScreen(),
+ child: child,
+ ),
routes: [
GoRoute(
- path: '/punishments',
- name: 'accountPunishments',
- builder: (context, state) => const PunishmentsScreen(),
- ),
- GoRoute(
- path: '/programs',
- name: 'accountProgram',
- builder: (context, state) => const AccountProgramScreen(),
- ),
- GoRoute(
- path: '/contacts',
- name: 'accountContactMethods',
- builder: (context, state) => const AccountContactMethod(),
- ),
- GoRoute(
- path: '/events',
- name: 'accountActionEvents',
- builder: (context, state) => const ActionEventScreen(),
- ),
- GoRoute(
- path: '/tickets',
- name: 'accountAuthTickets',
- builder: (context, state) => const AccountAuthTicket(),
- ),
- GoRoute(
- path: '/badges',
- name: 'accountBadges',
- builder: (context, state) => const AccountBadgesScreen(),
- ),
- GoRoute(
- path: '/wallet',
- name: 'accountWallet',
- builder: (context, state) => const WalletScreen(),
- ),
- GoRoute(
- path: '/keypairs',
- name: 'accountKeyPairs',
- builder: (context, state) => const KeyPairScreen(),
- ),
- GoRoute(
- path: '/settings',
- name: 'accountSettings',
- builder: (context, state) => AccountSettingsScreen(),
- routes: [
- GoRoute(
- path: '/notify',
- name: 'accountSettingsNotify',
- builder: (context, state) => const AccountNotifyPrefsScreen(),
- ),
- GoRoute(
- path: '/auth',
- name: 'accountSettingsSecurity',
- builder: (context, state) => const AccountSecurityPrefsScreen(),
- ),
- ],
- ),
- GoRoute(
- path: '/settings/factors',
- name: 'factorSettings',
- builder: (context, state) => FactorSettingsScreen(),
- ),
- GoRoute(
- path: '/profile/edit',
- name: 'accountProfileEdit',
- builder: (context, state) => ProfileEditScreen(),
- ),
- GoRoute(
- path: '/publishers',
- name: 'accountPublishers',
- builder: (context, state) => PublisherScreen(),
- ),
- GoRoute(
- path: '/publishers/new',
- name: 'accountPublisherNew',
- builder: (context, state) => AccountPublisherNewScreen(),
- ),
- GoRoute(
- path: '/publishers/edit/:name',
- name: 'accountPublisherEdit',
- builder: (context, state) => AccountPublisherEditScreen(
- name: state.pathParameters['name']!,
- ),
- ),
- GoRoute(
- path: '/profile/:name',
- name: 'accountProfilePage',
- pageBuilder: (context, state) => NoTransitionPage(
- child: UserScreen(name: state.pathParameters['name']!),
- ),
- ),
+ path: '/account',
+ name: 'account',
+ builder: (context, state) =>
+ const ResponsiveScaffoldLanding(child: AccountScreen()),
+ routes: [
+ GoRoute(
+ path: '/punishments',
+ name: 'accountPunishments',
+ builder: (context, state) => const PunishmentsScreen(),
+ ),
+ GoRoute(
+ path: '/programs',
+ name: 'accountProgram',
+ builder: (context, state) => const AccountProgramScreen(),
+ ),
+ GoRoute(
+ path: '/contacts',
+ name: 'accountContactMethods',
+ builder: (context, state) => const AccountContactMethod(),
+ ),
+ GoRoute(
+ path: '/events',
+ name: 'accountActionEvents',
+ builder: (context, state) => const ActionEventScreen(),
+ ),
+ GoRoute(
+ path: '/tickets',
+ name: 'accountAuthTickets',
+ builder: (context, state) => const AccountAuthTicket(),
+ ),
+ GoRoute(
+ path: '/badges',
+ name: 'accountBadges',
+ builder: (context, state) => const AccountBadgesScreen(),
+ ),
+ GoRoute(
+ path: '/wallet',
+ name: 'accountWallet',
+ builder: (context, state) => const WalletScreen(),
+ ),
+ GoRoute(
+ path: '/keypairs',
+ name: 'accountKeyPairs',
+ builder: (context, state) => const KeyPairScreen(),
+ ),
+ GoRoute(
+ path: '/settings',
+ name: 'accountSettings',
+ builder: (context, state) => AccountSettingsScreen(),
+ routes: [
+ GoRoute(
+ path: '/notify',
+ name: 'accountSettingsNotify',
+ builder: (context, state) => const AccountNotifyPrefsScreen(),
+ ),
+ GoRoute(
+ path: '/auth',
+ name: 'accountSettingsSecurity',
+ builder: (context, state) =>
+ const AccountSecurityPrefsScreen(),
+ ),
+ ],
+ ),
+ GoRoute(
+ path: '/settings/factors',
+ name: 'factorSettings',
+ builder: (context, state) => FactorSettingsScreen(),
+ ),
+ GoRoute(
+ path: '/profile/edit',
+ name: 'accountProfileEdit',
+ builder: (context, state) => ProfileEditScreen(),
+ ),
+ GoRoute(
+ path: '/publishers',
+ name: 'accountPublishers',
+ builder: (context, state) => PublisherScreen(),
+ ),
+ GoRoute(
+ path: '/publishers/new',
+ name: 'accountPublisherNew',
+ builder: (context, state) => AccountPublisherNewScreen(),
+ ),
+ GoRoute(
+ path: '/publishers/edit/:name',
+ name: 'accountPublisherEdit',
+ builder: (context, state) => AccountPublisherEditScreen(
+ name: state.pathParameters['name']!,
+ ),
+ ),
+ GoRoute(
+ path: '/profile/:name',
+ name: 'accountProfilePage',
+ pageBuilder: (context, state) => NoTransitionPage(
+ child: UserScreen(name: state.pathParameters['name']!),
+ ),
+ ),
+ ]),
],
),
GoRoute(
diff --git a/lib/screens/account.dart b/lib/screens/account.dart
index 8fa83e1..31dfba0 100644
--- a/lib/screens/account.dart
+++ b/lib/screens/account.dart
@@ -141,15 +141,6 @@ class AccountScreen extends StatelessWidget {
],
)
: null,
- actions: [
- IconButton(
- icon: const Icon(Symbols.settings, fill: 1),
- onPressed: () {
- GoRouter.of(context).pushNamed('settings');
- },
- ),
- const Gap(8),
- ],
),
body: SingleChildScrollView(
child: ua.isAuthorized
diff --git a/lib/widgets/navigation/app_rail_navigation.dart b/lib/widgets/navigation/app_rail_navigation.dart
index c3c7a55..e11cf51 100644
--- a/lib/widgets/navigation/app_rail_navigation.dart
+++ b/lib/widgets/navigation/app_rail_navigation.dart
@@ -1,10 +1,12 @@
import 'package:easy_localization/easy_localization.dart';
import 'package:flutter/material.dart';
+import 'package:gap/gap.dart';
import 'package:go_router/go_router.dart';
import 'package:material_symbols_icons/symbols.dart';
import 'package:provider/provider.dart';
-import 'package:styled_widget/styled_widget.dart';
import 'package:surface/providers/navigation.dart';
+import 'package:surface/providers/userinfo.dart';
+import 'package:surface/widgets/account/account_image.dart';
class AppRailNavigation extends StatefulWidget {
const AppRailNavigation({super.key});
@@ -18,43 +20,59 @@ class _AppRailNavigationState extends State<AppRailNavigation> {
void initState() {
super.initState();
WidgetsBinding.instance.addPostFrameCallback((_) {
- context.read<NavigationProvider>().autoDetectIndex(GoRouter.maybeOf(context));
+ context
+ .read<NavigationProvider>()
+ .autoDetectIndex(GoRouter.maybeOf(context));
});
}
@override
Widget build(BuildContext context) {
+ final ua = context.watch<UserProvider>();
final nav = context.watch<NavigationProvider>();
return ListenableBuilder(
listenable: nav,
builder: (context, _) {
- final destinations = nav.destinations.where((ele) => ele.isPinned).toList();
+ final destinations = nav.destinations.toList();
return SizedBox(
width: 80,
child: NavigationRail(
- selectedIndex:
- nav.currentIndex != null && nav.currentIndex! < nav.pinnedDestinationCount ? nav.currentIndex : null,
+ labelType: NavigationRailLabelType.selected,
+ backgroundColor: Theme.of(context)
+ .colorScheme
+ .surfaceContainerLow
+ .withOpacity(0.5),
+ selectedIndex: nav.currentIndex != null &&
+ nav.currentIndex! < nav.destinations.length
+ ? nav.currentIndex
+ : null,
destinations: [
- ...destinations.where((ele) => ele.isPinned).map((ele) {
+ ...destinations.map((ele) {
return NavigationRailDestination(
icon: ele.icon,
label: Text(ele.label).tr(),
);
}),
],
+ leading: const Gap(4),
trailing: Expanded(
child: Align(
alignment: Alignment.bottomCenter,
- child: StyledWidget(
- IconButton(
- icon: const Icon(Symbols.menu),
- onPressed: () {
- Scaffold.of(context).openDrawer();
+ child: Padding(
+ padding: EdgeInsets.only(bottom: 24),
+ child: GestureDetector(
+ child: AccountImage(
+ content: ua.user?.avatar,
+ fallbackWidget:
+ ua.isAuthorized ? null : const Icon(Symbols.login),
+ ),
+ onTap: () {
+ GoRouter.of(context).goNamed('account');
},
),
- ).padding(bottom: 16),
+ ),
),
),
onDestinationSelected: (idx) {
diff --git a/lib/widgets/navigation/app_scaffold.dart b/lib/widgets/navigation/app_scaffold.dart
index 7208f62..4f87552 100644
--- a/lib/widgets/navigation/app_scaffold.dart
+++ b/lib/widgets/navigation/app_scaffold.dart
@@ -13,7 +13,6 @@ import 'package:surface/providers/navigation.dart';
import 'package:surface/widgets/connection_indicator.dart';
import 'package:surface/widgets/navigation/app_background.dart';
import 'package:surface/widgets/navigation/app_bottom_navigation.dart';
-import 'package:surface/widgets/navigation/app_drawer_navigation.dart';
import 'package:surface/widgets/navigation/app_rail_navigation.dart';
import 'package:surface/widgets/notify_indicator.dart';
@@ -111,7 +110,6 @@ class AppRootScaffold extends StatelessWidget {
final devicePixelRatio = MediaQuery.of(context).devicePixelRatio;
final isCollapseDrawer = cfg.drawerIsCollapsed;
- final isExpandedDrawer = cfg.drawerIsExpanded;
final routeName = GoRouter.of(context)
.routerDelegate
@@ -132,19 +130,7 @@ class AppRootScaffold extends StatelessWidget {
? body
: Row(
children: [
- Container(
- decoration: BoxDecoration(
- border: Border(
- right: BorderSide(
- color: Theme.of(context).dividerColor,
- width: 1 / devicePixelRatio,
- ),
- ),
- ),
- child: isExpandedDrawer
- ? AppNavigationDrawer(elevation: 0)
- : AppRailNavigation(),
- ),
+ AppRailNavigation(),
Expanded(child: body),
],
);
@@ -232,10 +218,57 @@ class AppRootScaffold extends StatelessWidget {
),
],
),
- drawer: !isExpandedDrawer ? AppNavigationDrawer() : null,
drawerEdgeDragWidth: isPopable ? 0 : null,
bottomNavigationBar:
isShowBottomNavigation ? AppBottomNavigationBar() : null,
);
}
}
+
+class ResponsiveScaffold extends StatelessWidget {
+ final Widget aside;
+ final Widget? child;
+ const ResponsiveScaffold(
+ {super.key, required this.aside, required this.child});
+
+ @override
+ Widget build(BuildContext context) {
+ if (ResponsiveBreakpoints.of(context).largerOrEqualTo(TABLET)) {
+ return Row(
+ children: [
+ Flexible(
+ flex: 1,
+ child: aside,
+ ),
+ VerticalDivider(width: 1),
+ if (child != null && child != aside)
+ Flexible(flex: 2, child: child!)
+ else
+ const Flexible(
+ flex: 2,
+ child: ResponsiveScaffoldLanding(child: null),
+ ),
+ ],
+ );
+ }
+
+ return child ?? aside;
+ }
+}
+
+class ResponsiveScaffoldLanding extends StatelessWidget {
+ final Widget? child;
+ const ResponsiveScaffoldLanding({super.key, required this.child});
+
+ @override
+ Widget build(BuildContext context) {
+ if (ResponsiveBreakpoints.of(context).largerOrEqualTo(TABLET) ||
+ child == null) {
+ return AppScaffold(
+ appBar: AppBar(),
+ body: const SizedBox.shrink(),
+ );
+ }
+ return child!;
+ }
+}