[UI-KIT] Add connection status builder

Signed-off-by: Sahil Kumar <[email protected]>
This commit is contained in:
Sahil Kumar
2021-01-29 13:33:45 +05:30
parent 18f0956717
commit d5c57f3cb5
11 changed files with 546 additions and 499 deletions
@@ -150,9 +150,8 @@ class _GroupChatDetailsScreenState extends State<GroupChatDetailsScreen> {
),
],
),
body: ValueListenableBuilder<ConnectionStatus>(
valueListenable: StreamChat.of(context).client.wsConnectionStatus,
builder: (context, status, _) {
body: ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
@@ -259,7 +258,8 @@ class _GroupChatDetailsScreenState extends State<GroupChatDetailsScreen> {
],
),
);
}),
},
),
),
);
}
@@ -134,9 +134,8 @@ class _NewChatScreenState extends State<NewChatScreen> {
),
centerTitle: true,
),
body: ValueListenableBuilder<ConnectionStatus>(
valueListenable: StreamChat.of(context).client.wsConnectionStatus,
builder: (context, status, _) {
body: ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
@@ -87,9 +87,8 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
)
],
),
body: ValueListenableBuilder<ConnectionStatus>(
valueListenable: StreamChat.of(context).client.wsConnectionStatus,
builder: (context, status, _) {
body: ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
@@ -163,8 +162,7 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
.white,
shape: BoxShape.circle,
border: Border.all(
color:
StreamChatTheme.of(context)
color: StreamChatTheme.of(context)
.colorTheme
.whiteSnow,
),
@@ -201,9 +199,8 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
child: Container(
width: double.maxFinite,
decoration: BoxDecoration(
gradient: StreamChatTheme.of(context)
.colorTheme
.bgGradient,
gradient:
StreamChatTheme.of(context).colorTheme.bgGradient,
),
child: Padding(
padding: const EdgeInsets.symmetric(
@@ -307,7 +304,8 @@ class _NewGroupChatScreenState extends State<NewGroupChatScreen> {
),
),
);
}),
},
),
);
}
}
@@ -9,6 +9,7 @@ import 'package:stream_chat_flutter/src/stream_chat_theme.dart';
import '../stream_chat_flutter.dart';
import './channel_name.dart';
import 'channel_image.dart';
import 'connection_status_builder.dart';
/// ![screenshot](https://raw.githubusercontent.com/GetStream/stream-chat-flutter/master/screenshots/channel_header.png)
/// ![screenshot](https://raw.githubusercontent.com/GetStream/stream-chat-flutter/master/screenshots/channel_header_paint.png)
@@ -85,11 +86,9 @@ class ChannelHeader extends StatelessWidget implements PreferredSizeWidget {
@override
Widget build(BuildContext context) {
final channel = StreamChannel.of(context).channel;
final _client = StreamChat.of(context).client;
return ValueListenableBuilder<ConnectionStatus>(
valueListenable: _client.wsConnectionStatus,
builder: (context, status, _) {
return ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
@@ -2,6 +2,8 @@ import 'package:flutter/material.dart';
import 'package:jiffy/jiffy.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
import 'connection_status_builder.dart';
class ChannelInfo extends StatelessWidget {
final Channel channel;
@@ -25,9 +27,8 @@ class ChannelInfo extends StatelessWidget {
stream: channel.state.membersStream,
initialData: channel.state.members,
builder: (context, snapshot) {
return ValueListenableBuilder(
valueListenable: client.wsConnectionStatus,
builder: (context, status, child) {
return ConnectionStatusBuilder(
statusBuilder: (context, status) {
switch (status) {
case ConnectionStatus.connected:
return _buildConnectedTitleState(context, snapshot.data);
@@ -6,6 +6,7 @@ import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
import 'package:stream_chat_flutter/src/stream_neumorphic_button.dart';
import 'package:stream_chat_flutter/stream_chat_flutter.dart';
import 'connection_status_builder.dart';
import 'info_tile.dart';
import 'stream_chat.dart';
@@ -79,9 +80,8 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget {
Widget build(BuildContext context) {
final _client = client ?? StreamChat.of(context).client;
final user = _client.state.user;
return ValueListenableBuilder<ConnectionStatus>(
valueListenable: _client.wsConnectionStatus,
builder: (context, status, child) {
return ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
@@ -130,9 +130,8 @@ class ChannelListHeader extends StatelessWidget implements PreferredSizeWidget {
actions: [
StreamNeumorphicButton(
child: IconButton(
icon: ValueListenableBuilder<ConnectionStatus>(
valueListenable: _client.wsConnectionStatus,
builder: (context, status, child) {
icon: ConnectionStatusBuilder(
statusBuilder: (context, status) {
var color;
switch (status) {
case ConnectionStatus.connected:
@@ -0,0 +1,55 @@
import 'package:flutter/material.dart';
import 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
import 'stream_chat.dart';
class ConnectionStatusBuilder extends StatelessWidget {
/// Creates a new ConnectionStatusBuilder
const ConnectionStatusBuilder({
Key key,
@required this.statusBuilder,
this.initialStatus = ConnectionStatus.disconnected,
this.connectionStatusStream,
this.errorBuilder,
this.loadingBuilder,
}) : assert(statusBuilder != null),
super(key: key);
/// The connection status that will be used to create the initial snapshot.
final ConnectionStatus initialStatus;
/// The asynchronous computation to which this builder is currently connected.
final Stream<ConnectionStatus> connectionStatusStream;
/// The builder that will be used in case of error
final Widget Function(BuildContext context, Object error) errorBuilder;
/// The builder that will be used in case of loading
final WidgetBuilder loadingBuilder;
/// The builder that will be used in case of data
final Widget Function(BuildContext context, ConnectionStatus status)
statusBuilder;
@override
Widget build(BuildContext context) {
final stream = connectionStatusStream ??
StreamChat.of(context).client.wsConnectionStatusStream;
return StreamBuilder<ConnectionStatus>(
initialData: initialStatus,
stream: stream,
builder: (context, snapshot) {
if (snapshot.hasError) {
if (errorBuilder != null) {
return errorBuilder(context, snapshot.error);
}
return Offstage();
}
if (!snapshot.hasData) {
if (loadingBuilder != null) return loadingBuilder(context);
return Offstage();
}
return statusBuilder(context, snapshot.data);
},
);
}
}
@@ -14,6 +14,7 @@ import 'package:stream_chat_flutter/src/system_message.dart';
import 'package:visibility_detector/visibility_detector.dart';
import '../stream_chat_flutter.dart';
import 'connection_status_builder.dart';
import 'date_divider.dart';
import 'swipeable.dart';
import 'extension.dart';
@@ -301,17 +302,14 @@ class _MessageListViewState extends State<MessageListView> {
}
_messageListLength = newMessagesListLength;
final _client = StreamChat.of(context).client;
return Stack(
alignment: Alignment.center,
children: [
ValueListenableBuilder<ConnectionStatus>(
valueListenable: _client.wsConnectionStatus,
builder: (context, status, _) {
ConnectionStatusBuilder(
statusBuilder: (context, status) {
String statusString = '';
bool showStatus = true;
switch (status) {
case ConnectionStatus.connected:
statusString = 'Connected';
@@ -326,8 +324,7 @@ class _MessageListViewState extends State<MessageListView> {
}
return InfoTile(
showMessage:
widget.showConnectionStateTile ? showStatus : false,
showMessage: widget.showConnectionStateTile ? showStatus : false,
tileAnchor: Alignment.topCenter,
childAnchor: Alignment.topCenter,
message: statusString,
@@ -373,9 +370,8 @@ class _MessageListViewState extends State<MessageListView> {
final replyCount = widget.parentMessage.replyCount;
return Container(
decoration: BoxDecoration(
gradient: StreamChatTheme.of(context)
.colorTheme
.bgGradient,
gradient:
StreamChatTheme.of(context).colorTheme.bgGradient,
),
child: Padding(
padding: const EdgeInsets.all(8.0),
@@ -491,7 +487,8 @@ class _MessageListViewState extends State<MessageListView> {
),
),
);
}),
},
),
if (widget.showScrollToBottom) _buildScrollToBottom(),
Positioned(
top: 20.0,
@@ -40,4 +40,5 @@ export 'src/channel_file_display_screen.dart';
export 'src/channel_media_display_screen.dart';
export 'src/info_tile.dart';
export 'src/stream_chat.dart';
export 'src/connection_status_builder.dart';
export 'package:stream_chat_flutter_core/stream_chat_flutter_core.dart';
-2
View File
@@ -32,8 +32,6 @@ dependencies:
image_picker: ^0.6.7+17
flutter_keyboard_visibility: ^4.0.2
mime: ^0.9.7
stream_chat:
path: ../dart_client
video_compress: ^2.1.1
visibility_detector: ^0.1.5
http_parser: ^3.1.4
@@ -10,8 +10,8 @@ environment:
flutter: ">=1.17.0"
dependencies:
stream_chat: ^0.2.23+3
rxdart: ^0.24.1
stream_chat:
path: ../dart_client
flutter:
sdk: flutter