Manage customer communication directly within the platform.

The Full Screen Modal with Send Email feature in Naologic allows users to receive, review, and respond to emails without switching to external tools. It is primarily used for customer support but can be adapted for other communication needs.

Installing the Full Screen Modal with Send Email

1. Navigate to the Desired Project
   From the Builder Overview, locate and select the project where you want to install the modal.

2. Access the Individual App Canvas
   Within the selected project, hover over the desired app and click Access App Flow to open the app where you want to add the modal.

3. Open Add Elements
   On the left side of the app canvas, click the “+” button to open the Add Elements navigation.

4. Search for the Modal
   Use the search bar to look for Full Screen Modal with Send Email.

5. Drag and Drop to Install
   Once you've located the modal, simply drag and drop it onto the app canvas screen.

Setting up the Full Screen Modal with Send Email

The Full Screen Modal with Send Email is an advanced feature that requires proper configuration to function effectively. Follow the steps below to ensure that the modal is set up correctly within your app.

In order to properly set up the modal, you will first need to create two Data Structures and two Data Documents. For this example, we will create the modal inside a Customer Support app that handles customer conversations.

Create the Data Structures and Data Documents

1. Conversation Data Structure
   This is used to track the request itself and should contain the following:

   • Title - String
   • Email - String
   • Status - String

2. Conversation Data Document
   In this Data Document, you will need to create a view that contains the following:

[
  {
    "get": {
      "cfpPath": "customer-support/customer-support",
      "naoQueryOptions": {
        "docName": "conversationMessage",
        "cfpPath": "customer-support/customer-support"
      },
      "property": "docId",
      "targetProperty": "data.parentId",
      "projection": {
        "data": 1,
        "info": 1,
        "docId": 1
      },
      "transform": "data-array"
    },
    "set": {
      "cfpPath": "customer-support/customer-support",
      "property": "data.emails"
    }
  }
]

Conversation Message

The Conversation Message data structure is used for the chat and email-sending functionality. It should contain the following fields:

• From Email: A string representing the sender's email address.
• From Name: A string representing the sender's name.
• To: An array of strings representing the recipients (required).
• Cc: An array of strings for recipients to be copied on the email.
• Bcc: An array of strings for blind copied recipients.
• Subject: A string for the email subject.
• Body: A string for the email body (required).
• Parent Id: A string that links to the parent conversation (required).
• Email System Sent: A boolean indicating if the email was sent via the system.
• Email System Id: A string representing the email system ID.
• Received At Date: A date field for when the email was received.
• Support User Reply: A boolean indicating whether the reply came from a support user.

Configuring the Modal

To properly configure the modal, follow these steps:

1. Edit the Modal
   After installing the modal, hover over it and click on Edit.

2. Match the Fields
   Ensure the fields match the data structures created earlier:

   • Flow document id: This should point to the Conversation Data Structure.
   • Data relationship: This should reference the view created in the Conversation Data Document.
   • Conversations data pointer: Select Conversation Message, which is a field generated by the view.
   • Email Data Document: This should reference the Conversation Message Data Structure.

3. Save Changes
   Click on Save Changes to finalize your configuration.

Conclusion

The Full Screen Modal with Send Email feature provides a versatile and integrated solution for managing customer communications directly within your app. By following the installation and setup instructions, you can ensure:

• Seamless email interactions for customer support, sales, or other communication needs.
• Efficient and effective correspondence management through proper configuration of data structures and documents.

By leveraging this feature, your team can handle customer communications with greater efficiency and focus, all within your Naologic application.