feat: add context menu actions for desktops

Related: #849

Signed-off-by: TheOneWithTheBraid <the-one@with-the-braid.cf>
This commit is contained in:
TheOneWithTheBraid 2022-03-02 20:28:16 +01:00
parent 004edc7f8f
commit 49f0a5bde8
7 changed files with 513 additions and 345 deletions

View File

@ -2750,5 +2750,6 @@
"experimentalVideoCalls": "Experimental video calls",
"@experimentalVideoCalls": {},
"emailOrUsername": "Email or username",
"@emailOrUsername": {}
"@emailOrUsername": {},
"select": "Select"
}

View File

@ -1,3 +1,4 @@
import 'package:fluffychat/utils/contextual_actions.dart';
import 'package:flutter/material.dart';
import 'package:adaptive_dialog/adaptive_dialog.dart';
@ -6,6 +7,7 @@ import 'package:future_loading_dialog/future_loading_dialog.dart';
import 'package:matrix/matrix.dart';
import 'package:pedantic/pedantic.dart';
import 'package:vrouter/vrouter.dart';
import 'package:contextmenu/contextmenu.dart';
import 'package:fluffychat/config/app_config.dart';
import 'package:fluffychat/utils/matrix_sdk_extensions.dart/matrix_locals.dart';
@ -155,7 +157,70 @@ class ChatListItem extends StatelessWidget {
? 20.0
: 14.0
: 0.0;
return ListTile(
return ContextMenuArea(
builder: (c) {
// important to separate between [c] and [context]
final provider = ContextualActions.of(context);
if (provider.actions.isNotEmpty) {
return provider.buildContextMenu(c)
..insert(
0,
ListTile(
title: Text(L10n.of(context)!.select),
leading: const Icon(Icons.select_all),
onTap: () {
Navigator.of(c).pop();
onLongPress?.call();
},
),
);
} else {
return [
ListTile(
title: Text(L10n.of(context)!.select),
leading: const Icon(Icons.select_all),
onTap: () {
Navigator.of(c).pop();
onLongPress?.call();
},
),
/*
if (controller.spaces.isNotEmpty)
ContextualAction(
label: L10n.of(context)!.addToSpace,
icon: const Icon(Icons.group_work_outlined),
action: controller.addOrRemoveToSpace,
),
ContextualAction(
label: L10n.of(context)!.toggleUnread,
icon: Icon(controller.anySelectedRoomNotMarkedUnread
? Icons.mark_chat_read_outlined
: Icons.mark_chat_unread_outlined),
action: controller.toggleUnread,
),
ContextualAction(
label: L10n.of(context)!.toggleFavorite,
icon: Icon(controller.anySelectedRoomNotFavorite
? Icons.push_pin_outlined
: Icons.push_pin),
action: controller.toggleFavouriteRoom,
),
ContextualAction(
icon: Icon(controller.anySelectedRoomNotMuted
? Icons.notifications_off_outlined
: Icons.notifications_outlined),
label: L10n.of(context)!.toggleMuted,
action: controller.toggleMuted,
),
ContextualAction(
icon: const Icon(Icons.delete_outlined),
label: L10n.of(context)!.archive,
action: controller.archiveAction,
), */
];
}
},
child: ListTile(
selected: selected || activeChat,
selectedTileColor: selected
? Theme.of(context).primaryColor.withAlpha(100)
@ -320,6 +385,7 @@ class ChatListItem extends StatelessWidget {
],
),
onTap: () => clickAction(context),
),
);
}
}

View File

@ -1,5 +1,6 @@
import 'dart:async';
import 'package:fluffychat/utils/contextual_actions.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
@ -25,10 +26,48 @@ class ChatListView extends StatelessWidget {
@override
Widget build(BuildContext context) {
return ContextualActions(
child: Builder(builder: (context) {
return StreamBuilder<Object?>(
stream: Matrix.of(context).onShareContentChanged.stream,
builder: (_, __) {
builder: (context, __) {
final selectMode = controller.selectMode;
if (selectMode == SelectMode.select) {
ContextualActions.of(context).actions.addAll({
if (controller.spaces.isNotEmpty)
ContextualAction(
label: L10n.of(context)!.addToSpace,
icon: const Icon(Icons.group_work_outlined),
action: controller.addOrRemoveToSpace,
),
ContextualAction(
label: L10n.of(context)!.toggleUnread,
icon: Icon(controller.anySelectedRoomNotMarkedUnread
? Icons.mark_chat_read_outlined
: Icons.mark_chat_unread_outlined),
action: controller.toggleUnread,
),
ContextualAction(
label: L10n.of(context)!.toggleFavorite,
icon: Icon(controller.anySelectedRoomNotFavorite
? Icons.push_pin_outlined
: Icons.push_pin),
action: controller.toggleFavouriteRoom,
),
ContextualAction(
icon: Icon(controller.anySelectedRoomNotMuted
? Icons.notifications_off_outlined
: Icons.notifications_outlined),
label: L10n.of(context)!.toggleMuted,
action: controller.toggleMuted,
),
ContextualAction(
icon: const Icon(Icons.delete_outlined),
label: L10n.of(context)!.archive,
action: controller.archiveAction,
),
});
}
return VWidgetGuard(
onSystemPop: (redirector) async {
final selMode = controller.selectMode;
@ -57,41 +96,7 @@ class ChatListView extends StatelessWidget {
actions: selectMode == SelectMode.share
? null
: selectMode == SelectMode.select
? [
if (controller.spaces.isNotEmpty)
IconButton(
tooltip: L10n.of(context)!.addToSpace,
icon: const Icon(Icons.group_work_outlined),
onPressed: controller.addOrRemoveToSpace,
),
IconButton(
tooltip: L10n.of(context)!.toggleUnread,
icon: Icon(
controller.anySelectedRoomNotMarkedUnread
? Icons.mark_chat_read_outlined
: Icons.mark_chat_unread_outlined),
onPressed: controller.toggleUnread,
),
IconButton(
tooltip: L10n.of(context)!.toggleFavorite,
icon: Icon(controller.anySelectedRoomNotFavorite
? Icons.push_pin_outlined
: Icons.push_pin),
onPressed: controller.toggleFavouriteRoom,
),
IconButton(
icon: Icon(controller.anySelectedRoomNotMuted
? Icons.notifications_off_outlined
: Icons.notifications_outlined),
tooltip: L10n.of(context)!.toggleMuted,
onPressed: controller.toggleMuted,
),
IconButton(
icon: const Icon(Icons.delete_outlined),
tooltip: L10n.of(context)!.archive,
onPressed: controller.archiveAction,
),
]
? ContextualActions.of(context).buildAppBar()
: [
IconButton(
icon: const Icon(Icons.search_outlined),
@ -232,7 +237,10 @@ class ChatListView extends StatelessWidget {
),
),
);
});
},
);
}),
);
}
}

View File

@ -0,0 +1,78 @@
import 'package:flutter/material.dart';
class ContextualActions extends InheritedWidget {
final ContextualActionState _state = ContextualActionState();
ContextualActions({Key? key, required Widget child})
: super(key: key, child: child);
static ContextualActions of(BuildContext context) {
final ContextualActions? result =
context.dependOnInheritedWidgetOfExactType<ContextualActions>();
assert(result != null, 'No ContextualActions found in context');
return result!;
}
Set<ContextualAction> get actions => _state.actions;
set actions(Set<ContextualAction> actions) => _state.actions = actions;
List<Widget> buildAppBar() => _state.buildAppBar();
List<Widget> buildContextMenu(BuildContext context) =>
_state.buildContextMenu(context);
@override
bool updateShouldNotify(covariant ContextualActions oldWidget) =>
_state != oldWidget._state;
}
class ContextualActionState {
/// the currently set [ContextualActions]
///
/// use [replace] instead of `=` operator
Set<ContextualAction> actions = {};
Set<ContextualAction> contextMenuOnly = {};
/// unregisters all present actions and adds riven [newActions]
void replace(Iterable<ContextualAction> newActions) {
actions.removeWhere((element) => true);
actions.addAll(newActions);
}
/// buildseach item of [actions] as [IconButton] for use in AppBar
List<Widget> buildAppBar() {
return actions
.map(
(action) => IconButton(
icon: action.icon,
tooltip: action.label,
onPressed: action.action,
),
)
.toList();
}
/// builds each item of [actions] as [ListTile] for use in a [ContextMenuArea]
List<Widget> buildContextMenu(BuildContext context) {
return actions
.map(
(action) => ListTile(
leading: action.icon,
title: Text(action.label),
onTap: () {
Navigator.of(context).pop();
action.action.call();
},
),
)
.toList();
}
}
class ContextualAction {
final VoidCallback action;
final Widget icon;
final String label;
const ContextualAction(
{required this.action, required this.icon, required this.label});
}

View File

@ -22,6 +22,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "2.3.0"
after_layout:
dependency: transitive
description:
name: after_layout
url: "https://pub.dartlang.org"
source: hosted
version: "1.1.0"
analyzer:
dependency: transitive
description:
@ -241,6 +248,13 @@ packages:
url: "https://pub.dartlang.org"
source: hosted
version: "1.2.0"
contextmenu:
dependency: "direct main"
description:
name: contextmenu
url: "https://pub.dartlang.org"
source: hosted
version: "3.0.0"
convert:
dependency: transitive
description:

View File

@ -18,6 +18,7 @@ dependencies:
chewie: ^1.2.2
collection: ^1.15.0-nullsafety.4
connectivity_plus: ^2.2.0
contextmenu: ^3.0.0
cupertino_icons: any
desktop_drop: ^0.3.2
desktop_lifecycle: ^0.1.0

View File

@ -32,7 +32,7 @@
<link rel="stylesheet" type="text/css" href="splash/style.css">
</head>
<body style="position: fixed; inset: 0px; overflow: hidden; padding: 0px; margin: 0px; user-select: none; touch-action: none; font: 14px sans-serif; color: red;">
<body oncontextmenu="return false;" style="position: fixed; inset: 0px; overflow: hidden; padding: 0px; margin: 0px; user-select: none; touch-action: none; font: 14px sans-serif; color: red;">
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->