Implement message_list
This commit is contained in:
@@ -2,9 +2,11 @@ import 'package:flutter/material.dart';
|
||||
import 'package:infinite_scroll_pagination/infinite_scroll_pagination.dart';
|
||||
import 'package:provider/provider.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';
|
||||
|
||||
class MessageListPage extends StatefulWidget {
|
||||
@@ -15,10 +17,12 @@ class MessageListPage extends StatefulWidget {
|
||||
}
|
||||
|
||||
class _MessageListPageState extends State<MessageListPage> {
|
||||
static const _pageSize = 20; //TODO
|
||||
static const _pageSize = 128;
|
||||
|
||||
final PagingController<String, Message> _pagingController = PagingController(firstPageKey: '@start');
|
||||
|
||||
Map<String, Channel>? _channels = null;
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
_pagingController.addPageRequestListener((pageKey) {
|
||||
@@ -42,7 +46,12 @@ class _MessageListPageState extends State<MessageListPage> {
|
||||
}
|
||||
|
||||
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') {
|
||||
_pagingController.appendLastPage(newItems);
|
||||
@@ -50,23 +59,31 @@ class _MessageListPageState extends State<MessageListPage> {
|
||||
_pagingController.appendPage(newItems, npt);
|
||||
}
|
||||
} catch (error) {
|
||||
print("API-Error: "); //TODO remove me, proper error handling
|
||||
print(error); //TODO remove me, proper error handling
|
||||
_pagingController.error = error;
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return PagedListView<String, Message>(
|
||||
pagingController: _pagingController,
|
||||
builderDelegate: PagedChildBuilderDelegate<Message>(
|
||||
itemBuilder: (context, item, index) => MessageListItem(
|
||||
message: item,
|
||||
return Padding(
|
||||
padding: EdgeInsets.fromLTRB(8, 4, 8, 4),
|
||||
child: PagedListView<String, Message>(
|
||||
pagingController: _pagingController,
|
||||
builderDelegate: PagedChildBuilderDelegate<Message>(
|
||||
itemBuilder: (context, item, index) => MessageListItem(
|
||||
message: item,
|
||||
allChannels: _channels ?? {},
|
||||
onPressed: () {
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => MessageViewPage(messageID: item.messageID)),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
void _createChannel() {
|
||||
//TODO
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,17 +1,161 @@
|
||||
import 'dart:math';
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:simplecloudnotifier/models/channel.dart';
|
||||
import 'package:simplecloudnotifier/models/message.dart';
|
||||
import 'package:intl/intl.dart';
|
||||
|
||||
class MessageListItem extends StatelessWidget {
|
||||
static final _dateFormat = DateFormat('yyyy-MM-dd kk:mm');
|
||||
static final _lineCount = 3;
|
||||
|
||||
const MessageListItem({
|
||||
required this.message,
|
||||
required this.allChannels,
|
||||
required this.onPressed,
|
||||
super.key,
|
||||
});
|
||||
|
||||
final Message message;
|
||||
final Map<String, Channel> allChannels;
|
||||
final Null Function() onPressed;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) => ListTile(
|
||||
leading: const SizedBox(width: 40, height: 40, child: const Placeholder()),
|
||||
title: Text(message.messageID),
|
||||
Widget build(BuildContext context) {
|
||||
if (showChannel(message)) {
|
||||
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';
|
||||
}
|
||||
}
|
||||
|
||||
55
flutter/lib/pages/message_view/message_view.dart
Normal file
55
flutter/lib/pages/message_view/message_view.dart
Normal 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());
|
||||
},
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user