feat: add voice message duration display to VoiceMessageView

doc/documentation.md

@@ -605,6 +605,39 @@ void onSendTap(String message, ReplyMessage replyMessage, MessageType messageTyp
 
 > Note: You can evaluate message type from the 'messageType' parameter and perform operations accordingly.
 
+## Voice Message Duration
+
+For voice messages, you can display the duration by passing the `voiceMessageDuration` parameter when creating a message:
+
+```dart
+final voiceMessage = Message(
+  id: '4',
+  message: '/path/to/audio/file.m4a',
+  createdAt: DateTime.now(),
+  sentBy: currentUser.id,
+  messageType: MessageType.voice,
+  voiceMessageDuration: Duration(seconds: 15),  // Display duration in voice message bubble
+);
+
+chatController.addMessage(voiceMessage);
+```
+
+The duration will be automatically displayed in the voice message bubble using the HH:MM:SS format. You can customize the text style using the `VoiceMessageConfiguration`:
+
+```dart
+ChatView(
+  // ...
+  sendMessageConfig: SendMessageConfiguration(
+    voiceMessageConfig: VoiceMessageConfiguration(
+      durationTextStyle: TextStyle(
+        fontSize: 12,
+        color: Colors.white,
+      ),
+    ),
+  ),
+)
+```
+
 # ChatView - Advanced Usage
 
 ChatView offers extensive customization options to tailor the chat UI to your specific needs.
@@ -798,6 +831,12 @@ ChatView(
       //   - Multiple audios can be played simultaneously.
       //   - Starting recording will not affect any currently playing audio.
       playerMode: PlayerMode.single,
+
+      // Customize the text style for voice message duration display
+      durationTextStyle: TextStyle(
+        fontSize: 12,
+        color: Colors.white,
+      ),
     )
   ),
   // ...

lib/src/models/config_models/voice_message_configuration.dart

@@ -45,6 +45,7 @@ class VoiceMessageConfiguration {
     this.waveformPadding,
     this.enableSeekGesture = true,
     this.playerMode = PlayerMode.multi,
+    this.durationTextStyle,
   });
 
   /// Applies style to waveform.
@@ -100,4 +101,7 @@ class VoiceMessageConfiguration {
   ///   - Multiple audios can be played simultaneously.
   ///   - Note: Starting recording will not affect any currently playing audio.
   final PlayerMode playerMode;
+
+  /// TextStyle for voice message duration text.
+  final TextStyle? durationTextStyle;
 }

lib/src/widgets/voice_message_view.dart

@@ -171,6 +171,18 @@ class _VoiceMessageViewState extends State<VoiceMessageView> {
                     const Duration(milliseconds: 500),
                 enableSeekGesture: widget.config?.enableSeekGesture ?? true,
               ),
+              if (widget.message.voiceMessageDuration != null)
+                Padding(
+                  padding: const EdgeInsets.only(right: 8),
+                  child: Text(
+                    widget.message.voiceMessageDuration!.toHHMMSS(),
+                    style: widget.config?.durationTextStyle ??
+                        const TextStyle(
+                          fontSize: 12,
+                          color: Colors.white,
+                        ),
+                  ),
+                ),
             ],
           ),
         ),