Phase 3 testing fixes: Fastify 5, SSE→WebSocket+FCM, enums, security, session lifecycle

- Upgrade Fastify 4→5 with all plugins (@fastify/websocket 11, cors 11, sensible 6)
- Migrate all SSE endpoints to WebSocket + FCM push (mitra chat requests, customer pairing status)
- Add flutter_local_notifications for foreground push notifications with sound
- Add splash screen to both apps (hide auth loading flash)
- Introduce constants/enums across entire codebase (no raw string literals)
- Move price tiers from hardcoded array to app_config DB (data-driven, includes 1-min test tier)
- Add session ownership validation on all shared chat routes
- Add ownership checks on endSession, respondToExtension, requestExtension
- Fix session timer: auto-complete expired/stale sessions on server restart
- Add 5-min grace period for abandoned closing sessions
- Fix extension flow: proper session_resumed handling, clearExtensionRequest, closure grace timer cleanup
- Fix chat screens: ConnectChat in initState, session status check on connect
- Fix customer expired view: 5-min countdown, closure state priority over expired state
- Fix mitra extension UI: loading spinner, disable buttons, handle EXTENSION_RESOLVED error
- Fix GoRouter navigation consistency (no more Navigator.pushNamed)
- Fix goodbye view keyboard overflow (SingleChildScrollView)
- Add active session card on customer home screen with refresh on navigate back
- Fix PricingBottomSheet extension mode (RequestExtension instead of new pairing)
- Send session_resumed to both parties on extension accept

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

client_app/lib/features/chat/screens/chat_screen.dart

@@ -4,6 +4,7 @@ import 'package:flutter_bloc/flutter_bloc.dart';
 import 'package:go_router/go_router.dart';
 import '../../../core/chat/chat_bloc.dart';
 import '../../../core/chat/session_closure_bloc.dart';
+import '../../../core/constants.dart';
 import '../widgets/pricing_bottom_sheet.dart';
 
 class ChatScreen extends StatefulWidget {
@@ -21,8 +22,15 @@ class _ChatScreenState extends State<ChatScreen> {
   final _scrollController = ScrollController();
   Timer? _typingThrottle;
 
+  @override
+  void initState() {
+    super.initState();
+    context.read<ChatBloc>().add(ConnectChat(widget.sessionId));
+  }
+
   @override
   void dispose() {
+    context.read<ChatBloc>().add(DisconnectChat());
     _messageController.dispose();
     _scrollController.dispose();
     _typingThrottle?.cancel();
@@ -64,19 +72,31 @@ class _ChatScreenState extends State<ChatScreen> {
             if (prev is ChatConnected && curr is ChatConnected) {
               return prev.sessionExpired != curr.sessionExpired ||
                   prev.sessionClosing != curr.sessionClosing ||
+                  prev.sessionPaused != curr.sessionPaused ||
                   prev.messages.length != curr.messages.length;
             }
             return true;
           },
           listener: (context, state) {
             if (state is ChatConnected) {
-              if (state.sessionClosing) {
-                context.read<SessionClosureBloc>().add(DeclineExtension());
+              // Only trigger goodbye if closing AND not expired (expired shows extend dialog first)
+              if (state.sessionClosing && !state.sessionExpired) {
+                final closureState = context.read<SessionClosureBloc>().state;
+                if (closureState is ClosureInitial) {
+                  context.read<SessionClosureBloc>().add(DeclineExtension());
+                }
+              }
+              // Extension accepted — reset closure bloc to go back to chat
+              if (!state.sessionPaused && !state.sessionExpired && !state.sessionClosing) {
+                final closureState = context.read<SessionClosureBloc>().state;
+                if (closureState is! ClosureInitial) {
+                  context.read<SessionClosureBloc>().add(ResetClosure());
+                }
               }
               _scrollToBottom();
               // Auto-mark received messages as read
               final unread = state.messages
-                  .where((m) => m.senderType == 'mitra' && m.status != 'read')
+                  .where((m) => m.senderType == UserType.mitra && m.status != MessageStatus.read)
                   .map((m) => m.id)
                   .toList();
               if (unread.isNotEmpty) {
@@ -138,17 +158,17 @@ class _ChatScreenState extends State<ChatScreen> {
   }
 
   Widget _buildChatBody(BuildContext context, ChatConnected state) {
-    // Show session expired dialog
-    if (state.sessionExpired) {
-      return _buildExpiredView(context);
-    }
-
-    // Show goodbye input
+    // Show goodbye input (takes priority — user already decided to close)
     final closureState = context.watch<SessionClosureBloc>().state;
     if (closureState is ClosureShowGoodbye || closureState is ClosureSubmitting) {
       return _buildGoodbyeView(context, closureState);
     }
 
+    // Show session expired dialog (extend or close?)
+    if (state.sessionExpired) {
+      return _buildExpiredView(context);
+    }
+
     if (state.sessionPaused) {
       return _buildPausedView();
     }
@@ -162,7 +182,7 @@ class _ChatScreenState extends State<ChatScreen> {
             itemCount: state.messages.length,
             itemBuilder: (context, index) {
               final msg = state.messages[index];
-              final isMe = msg.senderType == 'customer';
+              final isMe = msg.senderType == UserType.customer;
               return _buildMessageBubble(msg, isMe);
             },
           ),
@@ -219,11 +239,11 @@ class _ChatScreenState extends State<ChatScreen> {
     switch (status) {
       case 'sending':
         return const Icon(Icons.access_time, size: 14, color: Colors.grey);
-      case 'sent':
+      case MessageStatus.sent:
         return const Icon(Icons.check, size: 14, color: Colors.grey);
-      case 'delivered':
+      case MessageStatus.delivered:
         return const Icon(Icons.done_all, size: 14, color: Colors.grey);
-      case 'read':
+      case MessageStatus.read:
         return const Icon(Icons.done_all, size: 14, color: Colors.blue);
       default:
         return const SizedBox.shrink();
@@ -264,25 +284,48 @@ class _ChatScreenState extends State<ChatScreen> {
     return Center(
       child: Padding(
         padding: const EdgeInsets.all(32),
-        child: Column(
-          mainAxisAlignment: MainAxisAlignment.center,
-          children: [
-            const Icon(Icons.timer_off, size: 64, color: Colors.orange),
-            const SizedBox(height: 16),
-            const Text('Waktu sesi habis', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
-            const SizedBox(height: 8),
-            const Text('Apakah kamu ingin memperpanjang sesi?', textAlign: TextAlign.center),
-            const SizedBox(height: 24),
-            ElevatedButton(
-              onPressed: () => PricingBottomSheet.show(context),
-              child: const Text('Perpanjang Sesi'),
-            ),
-            const SizedBox(height: 12),
-            TextButton(
-              onPressed: () => context.read<SessionClosureBloc>().add(DeclineExtension()),
-              child: const Text('Tidak, akhiri sesi'),
-            ),
-          ],
+        child: TweenAnimationBuilder<int>(
+          tween: IntTween(begin: 300, end: 0),
+          duration: const Duration(seconds: 300),
+          builder: (context, remaining, _) {
+            if (remaining <= 0) {
+              // Auto-decline when countdown reaches 0
+              WidgetsBinding.instance.addPostFrameCallback((_) {
+                context.read<SessionClosureBloc>().add(DeclineExtension());
+              });
+            }
+            final minutes = remaining ~/ 60;
+            final seconds = remaining % 60;
+            return Column(
+              mainAxisAlignment: MainAxisAlignment.center,
+              children: [
+                const Icon(Icons.timer_off, size: 64, color: Colors.orange),
+                const SizedBox(height: 16),
+                const Text('Waktu sesi habis', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
+                const SizedBox(height: 8),
+                const Text('Apakah kamu ingin memperpanjang sesi?', textAlign: TextAlign.center),
+                const SizedBox(height: 12),
+                Text(
+                  '$minutes:${seconds.toString().padLeft(2, '0')}',
+                  style: TextStyle(
+                    fontSize: 32,
+                    fontWeight: FontWeight.bold,
+                    color: remaining < 60 ? Colors.red : Colors.orange,
+                  ),
+                ),
+                const SizedBox(height: 24),
+                ElevatedButton(
+                  onPressed: () => PricingBottomSheet.showForExtension(context, sessionId: widget.sessionId),
+                  child: const Text('Perpanjang Sesi'),
+                ),
+                const SizedBox(height: 12),
+                TextButton(
+                  onPressed: () => context.read<SessionClosureBloc>().add(DeclineExtension()),
+                  child: const Text('Tidak, akhiri sesi'),
+                ),
+              ],
+            );
+          },
         ),
       ),
     );
@@ -290,13 +333,12 @@ class _ChatScreenState extends State<ChatScreen> {
 
   Widget _buildGoodbyeView(BuildContext context, SessionClosureState closureState) {
     final controller = TextEditingController();
-    return Center(
-      child: Padding(
-        padding: const EdgeInsets.all(32),
-        child: Column(
-          mainAxisAlignment: MainAxisAlignment.center,
-          children: [
-            const Icon(Icons.waving_hand, size: 64, color: Colors.amber),
+    return SingleChildScrollView(
+      padding: const EdgeInsets.all(32),
+      child: Column(
+        children: [
+          const SizedBox(height: 48),
+          const Icon(Icons.waving_hand, size: 64, color: Colors.amber),
             const SizedBox(height: 16),
             const Text('Pesan Penutup', style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
             const SizedBox(height: 8),
@@ -328,7 +370,6 @@ class _ChatScreenState extends State<ChatScreen> {
             ),
           ],
         ),
-      ),
     );
   }
 

client_app/lib/features/chat/screens/chat_transcript_screen.dart

@@ -1,6 +1,7 @@
 import 'package:flutter/material.dart';
 import 'package:flutter_bloc/flutter_bloc.dart';
 import '../../../core/api/api_client.dart';
+import '../../../core/constants.dart';
 
 class ChatTranscriptScreen extends StatefulWidget {
   final String sessionId;
@@ -47,7 +48,7 @@ class _ChatTranscriptScreenState extends State<ChatTranscriptScreen> {
               padding: const EdgeInsets.all(16),
               children: [
                 ..._messages.map((m) {
-                  final isMe = m['sender_type'] == 'customer';
+                  final isMe = m['sender_type'] == UserType.customer;
                   final time = DateTime.parse(m['created_at'] as String).toLocal();
                   return Align(
                     alignment: isMe ? Alignment.centerRight : Alignment.centerLeft,
@@ -79,7 +80,7 @@ class _ChatTranscriptScreenState extends State<ChatTranscriptScreen> {
                   const SizedBox(height: 8),
                   ..._closures.map((c) => Card(
                     child: ListTile(
-                      title: Text(c['user_type'] == 'customer' ? 'Kamu' : 'Bestie'),
+                      title: Text(c['user_type'] == UserType.customer ? 'Kamu' : 'Bestie'),
                       subtitle: Text(c['message'] as String),
                     ),
                   )),