Implement UserMessageTile Widget and Tests

This commit introduces the UserMessageTile widget, designed to display user messages in the chat interface. The widget includes the following features:
- Proper alignment based on available screen width
- A predefined minimum height with flexible expansion for longer messages
- Styling including a white background, thin black border, and small corner radius

Alongside the widget, this commit also includes comprehensive widget tests to ensure the correct rendering and functionality of the UserMessageTile. The tests cover:
- Rendering without errors
- Displaying the correct user message
- Showing the "User" title as expected

These implementations improve the structure and readability of the user messages within the chat view, ensuring a consistent and user-friendly experience.

lib/views/chat/user_message_tile.dart

@@ -0,0 +1,70 @@
+import 'package:flutter/material.dart';
+
+class UserMessageTile extends StatelessWidget {
+  final String message;
+
+  // Constructor takes the user message as a required parameter
+  const UserMessageTile({
+    Key? key,
+    required this.message,
+  }) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return LayoutBuilder(
+      builder: (context, constraints) {
+        // Calculate the width of the chat view based on the constraints provided
+        double chatViewWidth = constraints.maxWidth;
+
+        // Determine the width of the message tile based on the chat view width
+        double tileWidth = (chatViewWidth >= 1000) ? 900 : chatViewWidth - 40;
+
+        return Align(
+          alignment: Alignment.center,
+          child: Container(
+            width: tileWidth,
+            // Minimum height constraint for the container
+            constraints: const BoxConstraints(
+              minHeight: 50,
+            ),
+            // Margin and padding for styling
+            margin: const EdgeInsets.symmetric(vertical: 8),
+            padding: const EdgeInsets.symmetric(horizontal: 20),
+            // Decoration to style the container with a white background, thin black border, and small corner radius
+            decoration: BoxDecoration(
+              color: Colors.white,
+              border: Border.all(color: Colors.black, width: 0.5),
+              borderRadius: BorderRadius.circular(4),
+            ),
+            child: Row(
+              children: [
+                // "User" label with custom styling
+                const Text(
+                  "User",
+                  style: TextStyle(
+                    color: Colors.black,
+                    fontSize: 16,
+                    fontWeight: FontWeight.bold,
+                  ),
+                ),
+                const SizedBox(width: 20),
+                // Expanded widget to accommodate the message text
+                Expanded(
+                  child: Container(
+                    // Padding for the text content
+                    padding: const EdgeInsets.fromLTRB(0, 10, 20, 10),
+                    // Displaying the user message with no max line limit
+                    child: Text(
+                      message,
+                      maxLines: null,
+                    ),
+                  ),
+                ),
+              ],
+            ),
+          ),
+        );
+      },
+    );
+  }
+}

test/user_message_tile_test.dart

@@ -0,0 +1,42 @@
+import 'package:auto_gpt_flutter_client/views/chat/user_message_tile.dart';
+import 'package:flutter/material.dart';
+import 'package:flutter_test/flutter_test.dart';
+
+void main() {
+  // Test group for UserMessageTile widget
+  group('UserMessageTile', () {
+    // Test to check if the widget renders without error
+    testWidgets('renders without error', (WidgetTester tester) async {
+      await tester.pumpWidget(const MaterialApp(
+        home: Scaffold(
+          body: UserMessageTile(message: 'Hello, User!'),
+        ),
+      ));
+      expect(find.byType(UserMessageTile), findsOneWidget);
+    });
+
+    // Test to check if the widget displays the correct user message
+    testWidgets('displays the correct user message',
+        (WidgetTester tester) async {
+      const testMessage = 'Test Message';
+      await tester.pumpWidget(const MaterialApp(
+        home: Scaffold(
+          body: UserMessageTile(message: testMessage),
+        ),
+      ));
+
+      expect(find.text(testMessage), findsOneWidget);
+    });
+
+    // Test to check if the widget displays the "User" title
+    testWidgets('displays the "User" title', (WidgetTester tester) async {
+      await tester.pumpWidget(const MaterialApp(
+        home: Scaffold(
+          body: UserMessageTile(message: 'Any Message'),
+        ),
+      ));
+
+      expect(find.text('User'), findsOneWidget);
+    });
+  });
+}