Wai-Technologies
Design System > Create new component for Chatbot
The Chat component is designed to facilitate a user commenting system similar to chat interfaces. Key functionalities include:
User Comments Display: Displays a list of comments made by users, including their names, profile pictures, timestamps, and content (text and images).
Current User Identification: Differentiates between comments made by the current user and other users, adjusting the layout accordingly for better visual context.
Emoji Picker Integration: Provides an option for users to add emojis to their comments through an integrated emoji picker.(Additional component creation required, for now keep this value false)
Image Upload Support: Allows users to upload images to their comments. Only image files are accepted, and the uploaded image is displayed within the comment.
Comment Deletion: If enabled, allows users to delete their comments, with appropriate UI feedback for the deletion action.
Dynamic Date Formatting: Formats comment timestamps according to a specified date format (e.g., mm/dd/yyyy, dd/mm/yyyy, mm/dd/yyyy with time).
Comment Count Tracking: The parent component can access the current count of comments through a callback, allowing for state management and UI updates in the parent context.
Responsive Design: The component is styled to be responsive, ensuring usability across different devices and screen sizes.
Requirements Changes :
1.Switch the positions of comments made by the current user and those made by other users to enhance user experience.
2. Fix the time span for the delete option, allowing users to delete their comments only within a specified timeframe after posting.
3. Implement dynamic background color changes for comments based on their status or criteria to improve visual differentiation.
Raname Chat = Chatbot
allow Delete & date Format Control are not working.
Remove information icon as per above commented image.
Input box display square Expected as rounded as per above commented image.
working fine on dev and stagging icon is visible inside the input box
Not fixed on Prod
1)uploader and emoji size icon issue
in figma
2)Chat sending issue
The Enter key on the keyboard should work there for sending chat
3)can't delete entered chat
