Implement message_list

This commit is contained in:
Mike Schwörer 2024-05-21 23:20:34 +02:00
parent 20358a700a
commit 34925b6678
Signed by: Mikescher
GPG Key ID: D3C7172E0A70F8CF
14 changed files with 334 additions and 60 deletions

View File

@ -39,7 +39,7 @@ class APIClient {
return User.fromJson(jsonDecode(response.body)); return User.fromJson(jsonDecode(response.body));
} }
static getChannelList(KeyTokenAuth auth, ChannelSelector sel) async { static Future<List<ChannelWithSubscription>> getChannelList(KeyTokenAuth auth, ChannelSelector sel) async {
var url = '$_base/users/${auth.userId}/channels?selector=${sel.apiKey}'; var url = '$_base/users/${auth.userId}/channels?selector=${sel.apiKey}';
final uri = Uri.parse(url); final uri = Uri.parse(url);
@ -51,10 +51,10 @@ class APIClient {
final data = jsonDecode(response.body); final data = jsonDecode(response.body);
return data['channels'].map<ChannelWithSubscription>((e) => ChannelWithSubscription.fromJson(e)).toList(); return data['channels'].map<ChannelWithSubscription>((e) => ChannelWithSubscription.fromJson(e)).toList() as List<ChannelWithSubscription>;
} }
static getMessageList(KeyTokenAuth auth, String pageToken, int? pageSize) async { static Future<(String, List<Message>)> getMessageList(KeyTokenAuth auth, String pageToken, int? pageSize) async {
var url = '$_base/messages?next_page_token=$pageToken'; var url = '$_base/messages?next_page_token=$pageToken';
if (pageSize != null) { if (pageSize != null) {
url += '&page_size=$pageSize'; url += '&page_size=$pageSize';
@ -71,8 +71,19 @@ class APIClient {
final npt = data['next_page_token'] as String; final npt = data['next_page_token'] as String;
final messages = data['messages'].map<Message>((e) => Message.fromJson(e)).toList(); final messages = data['messages'].map<Message>((e) => Message.fromJson(e)).toList() as List<Message>;
return [npt, messages]; return (npt, messages);
}
static Future<Message> getMessage(KeyTokenAuth auth, String msgid) async {
final uri = Uri.parse('$_base/messages/$msgid');
final response = await http.get(uri, headers: {'Authorization': 'SCN ${auth.token}'});
if (response.statusCode != 200) {
throw Exception('API request failed');
}
return Message.fromJson(jsonDecode(response.body));
} }
} }

View File

@ -0,0 +1,42 @@
import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:provider/provider.dart';
import 'package:simplecloudnotifier/state/app_theme.dart';
class SCNAppBar extends StatelessWidget implements PreferredSizeWidget {
const SCNAppBar({Key? key, this.title}) : super(key: key);
final String? title;
@override
Widget build(BuildContext context) {
return AppBar(
title: Text(title ?? 'Simple Cloud Notifier 2.0'),
actions: <Widget>[
Consumer<AppTheme>(
builder: (context, appTheme, child) => IconButton(
icon: Icon(appTheme.darkMode ? FontAwesomeIcons.solidSun : FontAwesomeIcons.solidMoon),
tooltip: 'Debug',
onPressed: () {
appTheme.switchDarkMode();
},
),
),
IconButton(
icon: const Icon(FontAwesomeIcons.solidSpiderBlackWidow),
tooltip: 'Debug',
onPressed: () {},
),
IconButton(
icon: const Icon(FontAwesomeIcons.solidMagnifyingGlass),
tooltip: 'Search',
onPressed: () {},
),
],
backgroundColor: Theme.of(context).secondaryHeaderColor,
);
}
@override
Size get preferredSize => const Size.fromHeight(kToolbarHeight);
}

View File

@ -0,0 +1,19 @@
import 'package:flutter/material.dart';
import 'package:simplecloudnotifier/components/layout/app_bar.dart';
class SCNScaffold extends StatelessWidget {
const SCNScaffold({Key? key, required this.child, this.title}) : super(key: key);
final Widget child;
final String? title;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: SCNAppBar(
title: title,
),
body: child,
);
}
}

View File

@ -9,8 +9,14 @@ void main() {
runApp( runApp(
MultiProvider( MultiProvider(
providers: [ providers: [
ChangeNotifierProvider(create: (context) => UserAccount()), ChangeNotifierProvider(
ChangeNotifierProvider(create: (context) => AppTheme()), create: (context) => UserAccount(),
lazy: false,
),
ChangeNotifierProvider(
create: (context) => AppTheme(),
lazy: false,
),
], ],
child: const SCNApp(), child: const SCNApp(),
), ),

View File

@ -1,14 +1,13 @@
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart'; import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:provider/provider.dart'; import 'package:simplecloudnotifier/components/layout/app_bar.dart';
import 'package:simplecloudnotifier/pages/channel_list/root.dart'; import 'package:simplecloudnotifier/pages/channel_list/root.dart';
import 'package:simplecloudnotifier/pages/send/root.dart'; import 'package:simplecloudnotifier/pages/send/root.dart';
import 'bottom_fab/fab_bottom_app_bar.dart'; import 'components/bottom_fab/fab_bottom_app_bar.dart';
import 'pages/account/root.dart'; import 'pages/account/root.dart';
import 'pages/message_list/message_list.dart'; import 'pages/message_list/message_list.dart';
import 'pages/settings/root.dart'; import 'pages/settings/root.dart';
import 'state/app_theme.dart';
class SCNNavLayout extends StatefulWidget { class SCNNavLayout extends StatefulWidget {
const SCNNavLayout({super.key}); const SCNNavLayout({super.key});
@ -43,7 +42,7 @@ class _SCNNavLayoutState extends State<SCNNavLayout> {
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return Scaffold( return Scaffold(
appBar: _buildAppBar(context), appBar: SCNAppBar(),
body: _subPages.elementAt(_selectedIndex), body: _subPages.elementAt(_selectedIndex),
bottomNavigationBar: _buildNavBar(context), bottomNavigationBar: _buildNavBar(context),
floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked, floatingActionButtonLocation: FloatingActionButtonLocation.centerDocked,
@ -86,32 +85,4 @@ class _SCNNavLayoutState extends State<SCNNavLayout> {
], ],
); );
} }
PreferredSizeWidget _buildAppBar(BuildContext context) {
return AppBar(
title: const Text('Simple Cloud Notifier 2.0'),
actions: <Widget>[
Consumer<AppTheme>(
builder: (context, appTheme, child) => IconButton(
icon: Icon(appTheme.darkMode ? FontAwesomeIcons.solidSun : FontAwesomeIcons.solidMoon),
tooltip: 'Debug',
onPressed: () {
appTheme.switchDarkMode();
},
),
),
IconButton(
icon: const Icon(FontAwesomeIcons.solidSpiderBlackWidow),
tooltip: 'Debug',
onPressed: () {},
),
IconButton(
icon: const Icon(FontAwesomeIcons.solidMagnifyingGlass),
tooltip: 'Search',
onPressed: () {},
),
],
backgroundColor: Theme.of(context).secondaryHeaderColor,
);
}
} }

View File

@ -2,9 +2,11 @@ import 'package:flutter/material.dart';
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart'; import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
import 'package:provider/provider.dart'; import 'package:provider/provider.dart';
import 'package:simplecloudnotifier/api/api_client.dart'; import 'package:simplecloudnotifier/api/api_client.dart';
import 'package:simplecloudnotifier/models/channel.dart';
import 'package:simplecloudnotifier/models/message.dart';
import 'package:simplecloudnotifier/pages/message_view/message_view.dart';
import 'package:simplecloudnotifier/state/user_account.dart';
import '../../models/message.dart';
import '../../state/user_account.dart';
import 'message_list_item.dart'; import 'message_list_item.dart';
class MessageListPage extends StatefulWidget { class MessageListPage extends StatefulWidget {
@ -15,10 +17,12 @@ class MessageListPage extends StatefulWidget {
} }
class _MessageListPageState extends State<MessageListPage> { class _MessageListPageState extends State<MessageListPage> {
static const _pageSize = 20; //TODO static const _pageSize = 128;
final PagingController<String, Message> _pagingController = PagingController(firstPageKey: '@start'); final PagingController<String, Message> _pagingController = PagingController(firstPageKey: '@start');
Map<String, Channel>? _channels = null;
@override @override
void initState() { void initState() {
_pagingController.addPageRequestListener((pageKey) { _pagingController.addPageRequestListener((pageKey) {
@ -42,7 +46,12 @@ class _MessageListPageState extends State<MessageListPage> {
} }
try { try {
final [npt, newItems] = await APIClient.getMessageList(acc.auth!, thisPageToken, _pageSize); if (_channels == null) {
final channels = await APIClient.getChannelList(acc.auth!, ChannelSelector.allAny);
_channels = Map.fromIterable(channels, key: (e) => e.channelID);
}
final (npt, newItems) = await APIClient.getMessageList(acc.auth!, thisPageToken, _pageSize);
if (npt == '@end') { if (npt == '@end') {
_pagingController.appendLastPage(newItems); _pagingController.appendLastPage(newItems);
@ -50,23 +59,31 @@ class _MessageListPageState extends State<MessageListPage> {
_pagingController.appendPage(newItems, npt); _pagingController.appendPage(newItems, npt);
} }
} catch (error) { } catch (error) {
print("API-Error: "); //TODO remove me, proper error handling
print(error); //TODO remove me, proper error handling
_pagingController.error = error; _pagingController.error = error;
} }
} }
@override @override
Widget build(BuildContext context) { Widget build(BuildContext context) {
return PagedListView<String, Message>( return Padding(
padding: EdgeInsets.fromLTRB(8, 4, 8, 4),
child: PagedListView<String, Message>(
pagingController: _pagingController, pagingController: _pagingController,
builderDelegate: PagedChildBuilderDelegate<Message>( builderDelegate: PagedChildBuilderDelegate<Message>(
itemBuilder: (context, item, index) => MessageListItem( itemBuilder: (context, item, index) => MessageListItem(
message: item, message: item,
allChannels: _channels ?? {},
onPressed: () {
Navigator.push(
context,
MaterialPageRoute(builder: (context) => MessageViewPage(messageID: item.messageID)),
);
},
),
), ),
), ),
); );
} }
void _createChannel() {
//TODO
}
} }

View File

@ -1,17 +1,161 @@
import 'dart:math';
import 'package:flutter/material.dart'; import 'package:flutter/material.dart';
import 'package:simplecloudnotifier/models/channel.dart';
import 'package:simplecloudnotifier/models/message.dart'; import 'package:simplecloudnotifier/models/message.dart';
import 'package:intl/intl.dart';
class MessageListItem extends StatelessWidget { class MessageListItem extends StatelessWidget {
static final _dateFormat = DateFormat('yyyy-MM-dd kk:mm');
static final _lineCount = 3;
const MessageListItem({ const MessageListItem({
required this.message, required this.message,
required this.allChannels,
required this.onPressed,
super.key, super.key,
}); });
final Message message; final Message message;
final Map<String, Channel> allChannels;
final Null Function() onPressed;
@override @override
Widget build(BuildContext context) => ListTile( Widget build(BuildContext context) {
leading: const SizedBox(width: 40, height: 40, child: const Placeholder()), if (showChannel(message)) {
title: Text(message.messageID), return Card.filled(
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
//clipBehavior: Clip.hardEdge, // nto needed, because our borderRadius is 0 anyway
child: InkWell(
splashColor: Theme.of(context).primaryColor.withAlpha(30),
onTap: onPressed,
child: Padding(
padding: const EdgeInsets.all(8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Container(
padding: const EdgeInsets.fromLTRB(4, 0, 4, 0),
margin: const EdgeInsets.fromLTRB(0, 0, 4, 0),
decoration: BoxDecoration(
color: Theme.of(context).hintColor,
borderRadius: BorderRadius.all(Radius.circular(4)),
),
child: Text(
resolveChannelName(message),
style: TextStyle(fontWeight: FontWeight.bold, color: Theme.of(context).cardColor, fontSize: 12),
overflow: TextOverflow.clip,
maxLines: 1,
),
),
Expanded(child: SizedBox()),
Text(
_dateFormat.format(DateTime.parse(message.timestamp).toLocal()),
style: const TextStyle(fontWeight: FontWeight.normal, fontSize: 11),
overflow: TextOverflow.clip,
maxLines: 1,
),
],
),
SizedBox(height: 4),
Text(
processTitle(message.title),
style: const TextStyle(fontWeight: FontWeight.bold),
overflow: TextOverflow.ellipsis,
maxLines: 3,
),
Text(
processContent(message.content),
style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color?.withAlpha(160)),
overflow: TextOverflow.ellipsis,
maxLines: _lineCount,
),
],
),
),
),
); );
} else {
return Card.filled(
margin: EdgeInsets.fromLTRB(0, 4, 0, 4),
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(0)),
//clipBehavior: Clip.hardEdge, // nto needed, because our borderRadius is 0 anyway
child: InkWell(
splashColor: Theme.of(context).primaryColor.withAlpha(30),
onTap: onPressed,
child: Padding(
padding: const EdgeInsets.all(8),
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: [
Row(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Expanded(
child: Text(
processTitle(message.title),
style: const TextStyle(fontWeight: FontWeight.bold),
overflow: TextOverflow.ellipsis,
maxLines: 3,
),
),
Text(
_dateFormat.format(DateTime.parse(message.timestamp).toLocal()),
style: const TextStyle(fontWeight: FontWeight.normal, fontSize: 11),
overflow: TextOverflow.clip,
maxLines: 1,
),
],
),
SizedBox(height: 4),
Text(
processContent(message.content),
style: TextStyle(color: Theme.of(context).textTheme.bodyLarge?.color?.withAlpha(160)),
overflow: TextOverflow.ellipsis,
maxLines: _lineCount,
),
],
),
),
),
);
}
}
processContent(String? v) {
if (v == null) {
return '';
}
var lines = v.split('\n');
if (lines.isEmpty) {
return '';
}
return lines.sublist(0, min(_lineCount, lines.length)).join("\n").trim();
}
processTitle(String? v) {
if (v == null) {
return '';
}
v = v.replaceAll("\n", " ");
v = v.replaceAll("\t", " ");
v = v.replaceAll("\r", "");
return v;
}
String resolveChannelName(Message message) {
return allChannels[message.channelID]?.displayName ?? message.channelInternalName;
}
showChannel(Message message) {
return message.channelInternalName != 'main';
}
} }

View File

@ -0,0 +1,55 @@
import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:simplecloudnotifier/api/api_client.dart';
import 'package:simplecloudnotifier/components/layout/scaffold.dart';
import 'package:simplecloudnotifier/models/message.dart';
import 'package:simplecloudnotifier/state/user_account.dart';
class MessageViewPage extends StatefulWidget {
const MessageViewPage({super.key, required this.messageID});
final String messageID;
@override
State<MessageViewPage> createState() => _MessageViewPageState();
}
class _MessageViewPageState extends State<MessageViewPage> {
late Future<Message>? futureMessage;
@override
void initState() {
super.initState();
futureMessage = fetchMessage();
}
Future<Message> fetchMessage() async {
final acc = Provider.of<UserAccount>(context, listen: false);
return await APIClient.getMessage(acc.auth!, widget.messageID);
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return SCNScaffold(
title: 'Message',
child: FutureBuilder<Message>(
future: futureMessage,
builder: (context, snapshot) {
if (snapshot.hasData) {
return Center(child: Text(snapshot.data!.title));
} else if (snapshot.hasError) {
return Center(child: Text('${snapshot.error}')); //TODO nice error page
}
return const Center(child: CircularProgressIndicator());
},
),
);
}
}

View File

@ -82,10 +82,10 @@ packages:
dependency: "direct dev" dependency: "direct dev"
description: description:
name: flutter_lints name: flutter_lints
sha256: "9e8c3858111da373efc5aa341de011d9bd23e2c5c5e0c62bccf32438e192d7b1" sha256: "3f41d009ba7172d5ff9be5f6e6e6abb4300e263aab8866d2a0842ed2a70f8f0c"
url: "https://pub.dev" url: "https://pub.dev"
source: hosted source: hosted
version: "3.0.2" version: "4.0.0"
flutter_staggered_grid_view: flutter_staggered_grid_view:
dependency: transitive dependency: transitive
description: description:
@ -135,6 +135,14 @@ packages:
url: "https://pub.dev" url: "https://pub.dev"
source: hosted source: hosted
version: "4.0.0" version: "4.0.0"
intl:
dependency: "direct main"
description:
name: intl
sha256: d6f56758b7d3014a48af9701c085700aac781a92a87a62b1333b46d8879661cf
url: "https://pub.dev"
source: hosted
version: "0.19.0"
leak_tracker: leak_tracker:
dependency: transitive dependency: transitive
description: description:
@ -163,10 +171,10 @@ packages:
dependency: transitive dependency: transitive
description: description:
name: lints name: lints
sha256: cbf8d4b858bb0134ef3ef87841abdf8d63bfc255c266b7bf6b39daa1085c4290 sha256: "976c774dd944a42e83e2467f4cc670daef7eed6295b10b36ae8c85bcbf828235"
url: "https://pub.dev" url: "https://pub.dev"
source: hosted source: hosted
version: "3.0.0" version: "4.0.0"
matcher: matcher:
dependency: transitive dependency: transitive
description: description:

View File

@ -42,6 +42,7 @@ dependencies:
qr_flutter: ^4.1.0 qr_flutter: ^4.1.0
url_launcher: ^6.2.4 url_launcher: ^6.2.4
infinite_scroll_pagination: ^4.0.0 infinite_scroll_pagination: ^4.0.0
intl: ^0.19.0
dependency_overrides: dependency_overrides:
@ -58,7 +59,7 @@ dev_dependencies:
# activated in the `analysis_options.yaml` file located at the root of your # activated in the `analysis_options.yaml` file located at the root of your
# package. See that file for information about deactivating specific lint # package. See that file for information about deactivating specific lint
# rules and activating additional ones. # rules and activating additional ones.
flutter_lints: ^3.0.1 flutter_lints: ^4.0.0
# For information on the generic Dart part of this file, see the # For information on the generic Dart part of this file, see the
# following page: https://dart.dev/tools/pub/pubspec # following page: https://dart.dev/tools/pub/pubspec