Social Messaging Application – Layout

The Social Messaging Application consists of the following three sections:

1. Header – this is the header for the widget. It contains the icon for the Social media source (Facebook or Twitter), as well as the channel public or private level. Additionally, it may contain two or more buttons. It looks like this:
   
2. Messages Panel – in this section, all messages fetched for the current request are rendered. This looks as demonstrated in the screenshot below:
   
3. Reply section
   Once the agent selects a message, they can reply to it in the Reply section. This is a standard text area, where the reply can be entered and sent to the customer. It looks like this:
   
   Once the reply has been entered, it can be sent by simply clicking on the Reply element, represented by an arrow.
   
   The reply section also contains additional features:
   
   Predefined replies icon -  administrators can create canned replies in Puzzel Admin so that these are presented to the agent. The predefined icon allows the agent to select one of the replies using a single click which populates the reply section.
   
   
   File attachments icon - the attach icon can be used to browse a file or image in the agents computer to send to the customer as an attachment in the conversation.