New feature: Add sms template title

package.json

@@ -1,6 +1,6 @@
 {
   "name": "pipedrive-embeddable-ringcentral-phone-spa",
-  "version": "3.5.3",
+  "version": "3.5.4",
   "description": "Add RingCentral Embeddable Voice widgets to Pipedrive",
   "keywords": [
     "RingCentral",

src/lib/sms.js

@@ -15,6 +15,7 @@ const key = 'rc-smses'
 export default (props) => {
   const [smses, setSMSes] = useState([])
   const [sms, setSMS] = useState('')
+  const [smsTitle, setSMSTitle] = useState('')
   const [showModal, setShowModal] = useState(false)
   useEffect(() => {
     async function init () {
@@ -25,16 +26,18 @@ export default (props) => {
     return () => null
   }, [])
   function onSelect (v, opt) {
+    const { key } = opt
+    const obj = smses.find(s => s.id === key)
     if (props.path.startsWith('/composeText')) {
       window.rc.postMessage({
         type: 'rc-adapter-new-sms',
         phoneNumber: '',
-        text: opt.children
+        text: obj.sms
       })
     } else {
       window.rc.postMessage({
         type: 'rc-adapter-auto-populate-conversation',
-        text: opt.children
+        text: obj.sms
       })
     }
   }
@@ -52,50 +55,67 @@ export default (props) => {
   }
   function submit () {
     if (!sms) {
-      return message.warn('required')
+      return message.warn('sms required')
     }
     setSMSes(old => {
       const res = [
         ...old, {
           id: Math.random() + '',
-          sms
+          sms,
+          smsTitle
         }
       ]
       ls.set(key, res)
       return res
     })
     setSMS('')
+    setSMSTitle('')
   }
   const editIcon = (
     <PlusCircleOutlined
       onClick={openModal}
     />
   )
   const AddSMS = (
-    <div className='rc-pd1y'>
+    <div className='rc-pd1y rc-mg2b'>
       <div className='rc-sms-form'>
-        <Input
-          className='rc-sms-input'
-          value={sms}
-          onChange={e => setSMS(e.target.value)}
-        />
-        <span
-          className='rc-sms-add-btn'
-          onClick={submit}
-        >
-          <PlusCircleOutlined /> Add SMS
-        </span>
+        <div className='rc-sms-form'>
+          <Input
+            className='rc-sms-input'
+            value={smsTitle}
+            placeholder='SMS title'
+            onChange={e => setSMSTitle(e.target.value)}
+          />
+        </div>
+        <div className='rc-sms-form'>
+          <Input.TextArea
+            className='rc-sms-input'
+            value={sms}
+            rows={1}
+            placeholder='SMS'
+            onChange={e => setSMS(e.target.value)}
+          />
+          <span
+            className='rc-sms-add-btn'
+            onClick={submit}
+          >
+            <PlusCircleOutlined /> Add SMS
+          </span>
+        </div>
       </div>
     </div>
   )
   function renderSms (sms) {
     return (
       <div className='rc-pd1b' key={sms.id}>
-        {sms.sms || 'no sms'}
-        <CloseCircleOutlined
-          className='rc-del-sms'
-          onClick={() => delSms(sms)}
-        />
+        <p className='rc-fix'>
+          <b>{sms.smsTitle}</b>
+          <CloseCircleOutlined
+            className='rc-del-sms'
+            onClick={() => delSms(sms)}
+          />
+        </p>
+        <p>{sms.sms}</p>
       </div>
     )
   }
@@ -113,7 +133,7 @@ export default (props) => {
           smses.map(sms => {
             return (
               <Option key={sms.id} value={sms.id}>
-                {sms.sms}
+                {sms.smsTitle || sms.sms}
               </Option>
             )
           })

src/manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "Ringcentral Embeddable Widgets for Pipedrive",
-  "version": "3.5.3",
+  "version": "3.5.4",
   "description": "Add RingCentral Embeddable Voice widgets to Pipedrive",
   "key": "MIIBIjANBgkqhkiG9w0BAQEFAAOCAQ8AMIIBCgKCAQEA1YqYvCEeGGNOgtKrx8DfG33ujx7NgAwbyVpikug4mHiNvKZYWulw7lY5fjaD8wAy5bmXnkfULDzqMkL8UOxUcf8qD2lJFcLm+BqBtqNnoSz00vwjSOxXrcDvpvsMrjEZkI7N/FD60sTWp1U+QOehua7OboUpXb4iV7TQfppz3PsCz7qGOa4PWjUMAZTTgomUtW47Es6f/vjIeejs7Ihro3Al5Jo3SWIbjpjSU9BK34XgFvtcZx3lZQgfFiK+ZNyxlx8mgC/PLqJB+uX63ywMrT86TdcfxBuaThy98S8SCXjZTpHOP6X5pmGMk0lPM06hwxmSCBZgHOHL/Wk6r8FUlQIDAQAB",
   "permissions": [