feat: Action redesign: Updating the config for SMTP plugin to use sections and zones format (#36091)
## Description Action redesign: Updating the config for SMTP plugin to use sections and zones format Fixes [#35505 ](https://github.com/appsmithorg/appsmith/issues/35505) ## Automation /ok-to-test tags="@tag.All" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/10704929692> > Commit: f58dfce0a2729442a0e1222762f97cc483e5459b > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10704929692&attempt=2" target="_blank">Cypress dashboard</a>. > Tags: `@tag.All` > Spec: > <hr>Wed, 04 Sep 2024 19:46:08 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [ ] No <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit - **New Features** - Introduced a comprehensive email sending interface in the SMTP plugin, allowing users to input recipient addresses, subject, body type, and attachments. - Enhanced layout with a new `DOUBLE_COLUMN_ZONE` structure for improved organization of input fields. - **Improvements** - Expanded styling capabilities for the dynamic input text control, allowing for more flexible sizing and better responsiveness in the UI. - Updated existing configurations to streamline the email composition process and improve user experience. - **Bug Fixes** - Adjusted CSS rules to remove minimum height and width constraints for better adaptability of UI components. <!-- end of auto-generated comment: release notes by coderabbit.ai -->
This commit is contained in:
parent
7d7a601cdc
commit
5aa93926ef
|
|
@ -84,7 +84,10 @@ export function InputText(props: {
|
|||
}
|
||||
}
|
||||
return (
|
||||
<div className={`t--${props?.name}`} style={customStyle}>
|
||||
<div
|
||||
className={`t--${props?.name} uqi-dynamic-input-text`}
|
||||
style={customStyle}
|
||||
>
|
||||
{/* <div style={customStyle}> */}
|
||||
<StyledDynamicTextField
|
||||
dataTreePath={dataTreePath}
|
||||
|
|
|
|||
|
|
@ -47,6 +47,11 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
/* DynamicInputTextControl min height and width removed */
|
||||
& :global(.uqi-dynamic-input-text) {
|
||||
width: unset !important;
|
||||
min-height: unset !important;
|
||||
}
|
||||
|
||||
/* Remove when code editor min width is resolved in DynamicTextFeildControl */
|
||||
& :global(.dynamic-text-field-control) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,108 @@
|
|||
{
|
||||
"controlType": "SECTION_V2",
|
||||
"identifier": "BODY",
|
||||
"conditionals": {
|
||||
"show": "{{actionConfiguration.formData.command === 'SEND'}}"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"controlType": "SINGLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z1",
|
||||
"children": [
|
||||
{
|
||||
"label": "Recepients",
|
||||
"subtitle": "Separate with comma",
|
||||
"configProperty": "actionConfiguration.formData.send.to",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "email@example.com, email2@example.com",
|
||||
"isRequired": true
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z2",
|
||||
"children": [
|
||||
{
|
||||
"label": "CC",
|
||||
"subtitle": "Separate with comma",
|
||||
"configProperty": "actionConfiguration.formData.send.cc",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "email@example.com, email2@example.com"
|
||||
},
|
||||
{
|
||||
"label": "BCC",
|
||||
"subtitle": "Separate with comma",
|
||||
"configProperty": "actionConfiguration.formData.send.bcc",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "email@example.com, email2@example.com"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "SINGLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z3",
|
||||
"children": [
|
||||
{
|
||||
"label": "Subject",
|
||||
"configProperty": "actionConfiguration.formData.send.subject",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "Awesome email subject"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z4",
|
||||
"children": [
|
||||
{
|
||||
"label": "Body type",
|
||||
"configProperty": "actionConfiguration.formData.send.bodyType",
|
||||
"controlType": "DROP_DOWN",
|
||||
"initialValue": "text/plain",
|
||||
"options": [
|
||||
{
|
||||
"label": "Plain text",
|
||||
"value": "text/plain"
|
||||
},
|
||||
{
|
||||
"label": "HTML",
|
||||
"value": "text/html"
|
||||
}
|
||||
],
|
||||
"evaluationSubstitutionType": "TEMPLATE"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "SINGLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z5",
|
||||
"children": [
|
||||
{
|
||||
"label": "Body",
|
||||
"configProperty": "actionConfiguration.body",
|
||||
"controlType": "QUERY_DYNAMIC_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "Incredible body text"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "SINGLE_COLUMN_ZONE",
|
||||
"identifier": "BODY-Z6",
|
||||
"children": [
|
||||
{
|
||||
"label": "Attachment(s)",
|
||||
"configProperty": "actionConfiguration.formData.send.attachments",
|
||||
"controlType": "QUERY_DYNAMIC_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "{{Filepicker.files}}"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
@ -1,24 +1,30 @@
|
|||
{
|
||||
"editor": [
|
||||
{
|
||||
"controlType": "SECTION",
|
||||
"controlType": "SECTION_V2",
|
||||
"identifier": "SELECTOR",
|
||||
"children": [
|
||||
{
|
||||
"label": "Command",
|
||||
"description": "Choose method you would like to use to send an email",
|
||||
"configProperty": "actionConfiguration.formData.command",
|
||||
"controlType": "DROP_DOWN",
|
||||
"initialValue": "SEND",
|
||||
"options": [
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "SELECTOR-Z1",
|
||||
"children": [
|
||||
{
|
||||
"label": "Send email",
|
||||
"value": "SEND"
|
||||
"label": "Command",
|
||||
"description": "Choose method you would like to use to send an email",
|
||||
"configProperty": "actionConfiguration.formData.command",
|
||||
"controlType": "DROP_DOWN",
|
||||
"initialValue": "SEND",
|
||||
"options": [
|
||||
{
|
||||
"label": "Send email",
|
||||
"value": "SEND"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"files": ["send.json"]
|
||||
"files": ["send.json", "body.json"]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,96 +1,49 @@
|
|||
{
|
||||
"controlType": "SECTION_V2",
|
||||
"identifier": "SEND",
|
||||
"controlType": "SECTION",
|
||||
"conditionals": {
|
||||
"show": "{{actionConfiguration.formData.command === 'SEND'}}"
|
||||
},
|
||||
"children": [
|
||||
{
|
||||
"controlType": "SECTION",
|
||||
"label": "Email Configuration",
|
||||
"description": "Optional",
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "SEND-Z1",
|
||||
"children": [
|
||||
{
|
||||
"label": "From email *",
|
||||
"label": "From email",
|
||||
"configProperty": "actionConfiguration.formData.send.from",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "fromAddress@example.com"
|
||||
},
|
||||
"placeholderText": "email@example.com",
|
||||
"isRequired": true
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "SEND-Z2",
|
||||
"children": [
|
||||
{
|
||||
"label": "Set Reply To Email",
|
||||
"label": "Set reply to email",
|
||||
"configProperty": "actionConfiguration.formData.send.isReplyTo",
|
||||
"controlType": "SWITCH",
|
||||
"evaluationSubstitutionType": "TEMPLATE"
|
||||
},
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"controlType": "DOUBLE_COLUMN_ZONE",
|
||||
"identifier": "SEND-Z3",
|
||||
"children": [
|
||||
{
|
||||
"label": "Reply to email",
|
||||
"configProperty": "actionConfiguration.formData.send.replyTo",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "replyTo@example.com",
|
||||
"placeholderText": "email@example.com",
|
||||
"conditionals": {
|
||||
"show": "{{actionConfiguration.formData.send.isReplyTo === true}}"
|
||||
}
|
||||
},
|
||||
{
|
||||
"label": "To email(s) *",
|
||||
"configProperty": "actionConfiguration.formData.send.to",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "to@example.com,to2@example.com"
|
||||
},
|
||||
{
|
||||
"label": "CC email(s)",
|
||||
"configProperty": "actionConfiguration.formData.send.cc",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "cc@example.com,cc2@example.com"
|
||||
},
|
||||
{
|
||||
"label": "BCC email(s)",
|
||||
"configProperty": "actionConfiguration.formData.send.bcc",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "bcc@example.com,bcc2@example.com"
|
||||
},
|
||||
{
|
||||
"label": "Subject",
|
||||
"configProperty": "actionConfiguration.formData.send.subject",
|
||||
"controlType": "QUERY_DYNAMIC_INPUT_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "Awesome email subject"
|
||||
},
|
||||
{
|
||||
"label": "Body type",
|
||||
"configProperty": "actionConfiguration.formData.send.bodyType",
|
||||
"controlType": "DROP_DOWN",
|
||||
"initialValue": "text/plain",
|
||||
"options": [
|
||||
{
|
||||
"label": "Plain text",
|
||||
"value": "text/plain"
|
||||
},
|
||||
{
|
||||
"label": "HTML",
|
||||
"value": "text/html"
|
||||
}
|
||||
],
|
||||
"evaluationSubstitutionType": "TEMPLATE"
|
||||
},
|
||||
{
|
||||
"label": "Body",
|
||||
"configProperty": "actionConfiguration.body",
|
||||
"controlType": "QUERY_DYNAMIC_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "Incredible body text"
|
||||
},
|
||||
{
|
||||
"label": "Attachment(s)",
|
||||
"configProperty": "actionConfiguration.formData.send.attachments",
|
||||
"controlType": "QUERY_DYNAMIC_TEXT",
|
||||
"evaluationSubstitutionType": "TEMPLATE",
|
||||
"placeholderText": "{{Filepicker.files}}"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user