diff --git a/commet/lib/ui/organisms/room_side_panel/room_side_panel.dart b/commet/lib/ui/organisms/room_side_panel/room_side_panel.dart index c6d11d35..5a299b0d 100644 --- a/commet/lib/ui/organisms/room_side_panel/room_side_panel.dart +++ b/commet/lib/ui/organisms/room_side_panel/room_side_panel.dart @@ -12,17 +12,19 @@ import 'package:flutter/material.dart'; import 'package:tiamat/atoms/tile.dart'; import 'package:tiamat/tiamat.dart' as tiamat; -enum _SidePanelState { +enum SidePanelState { defaultView, thread, search, } class RoomSidePanel extends StatefulWidget { - const RoomSidePanel({required this.state, super.key}); + const RoomSidePanel({required this.state, this.builder, super.key}); final MainPageState state; + final Widget Function(SidePanelState state, Widget child)? builder; + @override State createState() => _RoomSidePanelState(); } @@ -31,7 +33,7 @@ class _RoomSidePanelState extends State { String? _currentThreadId; String? get currentThreadId => _currentThreadId; - _SidePanelState state = _SidePanelState.defaultView; + SidePanelState state = SidePanelState.defaultView; late List subs; @@ -56,7 +58,7 @@ class _RoomSidePanelState extends State { @override Widget build(BuildContext context) { - bool showBackButton = state == _SidePanelState.thread; + bool showBackButton = state == SidePanelState.thread; Widget result = Stack( alignment: Alignment.topRight, @@ -71,30 +73,36 @@ class _RoomSidePanelState extends State { icon: Icons.close, radius: 24, onPressed: () => setState(() { - state = _SidePanelState.defaultView; + state = SidePanelState.defaultView; })), ), ), ], ); - if (state == _SidePanelState.thread) { - result = Flexible(child: result); - } - - return Material( + result = Material( color: Colors.transparent, child: result, ); + + if (widget.builder != null) { + result = widget.builder!.call(state, result); + } + + // if (state == _SidePanelState.thread) { + // result = Flexible(child: result); + // } + + return result; } Widget buildPanelContent(BuildContext context) { switch (state) { - case _SidePanelState.defaultView: + case SidePanelState.defaultView: return buildDefaultView(); - case _SidePanelState.thread: + case SidePanelState.thread: return buildThread(); - case _SidePanelState.search: + case SidePanelState.search: return buildSearch(); } } @@ -108,14 +116,14 @@ class _RoomSidePanelState extends State { setState(() { _currentThreadId = threadId; - state = _SidePanelState.thread; + state = SidePanelState.thread; }); } void onCloseThreadSignal(void event) { setState(() { _currentThreadId = null; - state = _SidePanelState.defaultView; + state = SidePanelState.defaultView; }); } @@ -141,35 +149,33 @@ class _RoomSidePanelState extends State { } Widget buildThread() { - return Flexible( - child: Tile( - caulkPadLeft: true, - caulkClipTopLeft: true, - caulkClipBottomLeft: true, - caulkPadBottom: true, - child: Stack( - children: [ - Chat( - widget.state.currentRoom!, - threadId: currentThreadId, - key: ValueKey( - "room-timeline-key-${widget.state.currentRoom!.localId}_thread_$currentThreadId"), - ), - ScaledSafeArea( - child: Align( - alignment: Alignment.topRight, - child: Padding( - padding: const EdgeInsets.all(24.0), - child: tiamat.CircleButton( - icon: Icons.close, - radius: 24, - onPressed: () => EventBus.closeThread.add(null), - ), + return Tile( + caulkPadLeft: true, + caulkClipTopLeft: true, + caulkClipBottomLeft: true, + caulkPadBottom: true, + child: Stack( + children: [ + Chat( + widget.state.currentRoom!, + threadId: currentThreadId, + key: ValueKey( + "room-timeline-key-${widget.state.currentRoom!.localId}_thread_$currentThreadId"), + ), + ScaledSafeArea( + child: Align( + alignment: Alignment.topRight, + child: Padding( + padding: const EdgeInsets.all(24.0), + child: tiamat.CircleButton( + icon: Icons.close, + radius: 24, + onPressed: () => EventBus.closeThread.add(null), ), ), ), - ], - ), + ), + ], ), ); } @@ -184,14 +190,14 @@ class _RoomSidePanelState extends State { EventBus.focusTimeline.add(null); }, close: () => setState(() { - state = _SidePanelState.defaultView; + state = SidePanelState.defaultView; }), )); } void onStartSearch(void event) { setState(() { - state = _SidePanelState.search; + state = SidePanelState.search; }); } } diff --git a/commet/lib/ui/pages/main/main_page_view_desktop.dart b/commet/lib/ui/pages/main/main_page_view_desktop.dart index 48e096ec..211d5a46 100644 --- a/commet/lib/ui/pages/main/main_page_view_desktop.dart +++ b/commet/lib/ui/pages/main/main_page_view_desktop.dart @@ -212,10 +212,11 @@ class MainPageViewDesktop extends StatelessWidget { ), ), Expanded( - child: Row( + child: Flex( + direction: Axis.horizontal, mainAxisSize: MainAxisSize.max, children: [ - Flexible( + Expanded( child: Tile( caulkPadLeft: true, caulkClipTopLeft: true, @@ -232,17 +233,25 @@ class MainPageViewDesktop extends StatelessWidget { ), ), ), - Tile.surfaceContainer( - caulkPadLeft: true, - caulkPadBottom: true, - caulkClipBottomLeft: true, - caulkClipTopLeft: true, - child: RoomSidePanel( + RoomSidePanel( key: ValueKey( "room-sidepanel-key-${state.currentRoom!.localId}"), state: state, - ), - ) + builder: (state, child) { + Widget result = Tile.surfaceContainer( + caulkPadLeft: true, + caulkPadBottom: true, + caulkClipBottomLeft: true, + caulkClipTopLeft: true, + child: child, + ); + + if (state == SidePanelState.thread) { + result = Flexible(child: result); + } + + return result; + }) ], ), ), diff --git a/commet/lib/ui/pages/main/main_page_view_mobile.dart b/commet/lib/ui/pages/main/main_page_view_mobile.dart index 887642e3..a6c89700 100644 --- a/commet/lib/ui/pages/main/main_page_view_mobile.dart +++ b/commet/lib/ui/pages/main/main_page_view_mobile.dart @@ -111,15 +111,23 @@ class _MainPageViewMobileState extends State { Widget? rightPanel(BuildContext context) { if (widget.state.currentRoom != null) { return Tile.surfaceContainer( - caulkPadLeft: true, - caulkClipTopLeft: true, - caulkClipBottomLeft: true, - child: ScaledSafeArea( - bottom: false, - child: RoomSidePanel( - key: ValueKey( - "room-side-panel-${widget.state.currentRoom!.localId}"), - state: widget.state))); + caulkPadLeft: true, + caulkClipTopLeft: true, + caulkClipBottomLeft: true, + child: ScaledSafeArea( + bottom: false, + child: Column( + children: [ + Expanded( + child: RoomSidePanel( + key: ValueKey( + "room-side-panel-${widget.state.currentRoom!.localId}"), + state: widget.state), + ) + ], + ), + ), + ); } return null;