diff --git a/lib/app/communications/contact.js b/lib/app/communications/contact.js
index 0a7ae8a..e69669c 100644
--- a/lib/app/communications/contact.js
+++ b/lib/app/communications/contact.js
@@ -73,7 +73,7 @@ class Contact {
                     if (item == null) {
                         return false;
                     }
-                    item.Id = -1;
+                    //item.Id = -1;
                     item.SaveToCustomer = 0;
                     if (typeof this.#option.onSave === 'function') {
                         return this.#option.onSave.call(this, item, 'workorder');
diff --git a/lib/app/communications/customer.js b/lib/app/communications/customer.js
index 233f9fd..fd3fbae 100644
--- a/lib/app/communications/customer.js
+++ b/lib/app/communications/customer.js
@@ -337,6 +337,7 @@ class CustomerCommunication {
         if (option.autoUpdatesVisible === false) {
             checkAutoUpdate.style.display = 'none';
         }
+        const This = this;
         const checkLink = createCheckbox({
             className: 'check-status-link',
             enabled: !readonly,
@@ -347,6 +348,9 @@ class CustomerCommunication {
                 setTooltip(checkLink, this.checked ?
                     r('statusLinkIncluded', 'Status Link Included') :
                     r('statusLinkExcluded', 'Status Link Excluded'));
+                if (typeof option.onStatusLinkChanged === 'function') {
+                    option.onStatusLinkChanged.call(This, this.checked);
+                }
             }
         });
         if (option.statusLinkVisible === false) {
@@ -898,7 +902,33 @@ class CustomerCommunication {
                             });
                         });
                     })
-                )
+                ),
+                createElement('div', div => {
+                    div.className = 'bar-info';
+                    div.innerText = r('contactInformation', 'Contact Information');
+                }),
+                createElement('div', div => {
+                    if (option.contactCollapsed) {
+                        container.classList.add('collapsed');
+                        div.className = 'bar-collapser collapsed';
+                    } else {
+                        div.className = 'bar-collapser';
+                    }
+                    div.addEventListener('click', () => {
+                        const collapsed = div.classList.contains('collapsed');
+                        if (collapsed) {
+                            div.classList.remove('collapsed');
+                            container.classList.remove('collapsed');
+                        } else {
+                            div.classList.add('collapsed');
+                            container.classList.add('collapsed');
+                        }
+                        if (typeof option.onContactCollapsed === 'function') {
+                            option.onContactCollapsed.call(this, !collapsed);
+                        }
+                    });
+                    div.append(createElement('span'));
+                })
             )
         );
         return contacts;
diff --git a/lib/app/communications/style.scss b/lib/app/communications/style.scss
index acbf88c..ed1392c 100644
--- a/lib/app/communications/style.scss
+++ b/lib/app/communications/style.scss
@@ -42,7 +42,7 @@
         &:hover {
             background-color: var(--dark-fore-opacity-color);
 
-            > svg {
+            >svg {
                 opacity: .6;
             }
         }
@@ -52,12 +52,12 @@
             fill: lightgray;
             background-color: transparent !important;
 
-            &:hover > svg {
+            &:hover>svg {
                 opacity: unset;
             }
         }
 
-        > svg {
+        >svg {
             width: 13px;
             height: 14px;
             display: block;
@@ -75,16 +75,16 @@
         align-items: center;
         font-size: var(--font-larger-size);
 
-        > div {
+        >div {
             flex: 1 1 auto;
         }
 
-        > .title-functions {
+        >.title-functions {
             flex: 0 0 auto;
             display: flex;
             padding: 4px;
 
-            > label {
+            >label {
                 margin: 0 4px;
                 box-sizing: border-box;
                 cursor: pointer;
@@ -97,7 +97,7 @@
                 justify-content: center;
                 transition: background-color .2s;
 
-                > svg {
+                >svg {
                     fill: var(--strong-color);
                     width: 14px;
                     height: 14px;
@@ -107,7 +107,7 @@
                 &:hover {
                     background-color: var(--dark-fore-opacity-color);
 
-                    > svg {
+                    >svg {
                         opacity: .6;
                     }
                 }
@@ -119,7 +119,7 @@
                     &:hover {
                         background-color: var(--dark-fore-color);
 
-                        > svg {
+                        >svg {
                             opacity: unset;
                         }
                     }
@@ -133,24 +133,27 @@
         padding: 4px 0;
         display: flex;
         border-bottom: 1px solid var(--title-bg-color);
+        position: relative;
 
-        > .bar-icon {
+        >.bar-icon {
             flex: 0 0 auto;
 
-            > svg {
+            >svg {
                 width: 30px;
                 height: 30px;
                 margin: 0 8px;
             }
         }
 
-        > .bar-list {
+        >.bar-list {
             flex: 1 1 auto;
             width: calc(100% - 46px);
 
             .bar-list-container {
+                min-height: 26px;
                 max-height: 120px;
                 overflow: auto;
+                position: relative;
             }
 
             .contact-item {
@@ -158,7 +161,7 @@
                 align-items: center;
                 line-height: 22px;
 
-                > svg {
+                >svg {
                     flex: 0 0 auto;
                     width: 16px;
                     height: 16px;
@@ -166,7 +169,7 @@
                     fill: var(--strong-color);
                 }
 
-                > span {
+                >span {
                     // flex: 1 1 auto;
                     color: var(--strong-color);
                     font-size: var(--font-size);
@@ -178,23 +181,82 @@
             }
         }
 
+        >.bar-info {
+            display: none;
+            flex: 1 1 auto;
+            text-align: right;
+            margin-right: 50px;
+        }
+
+        >.bar-collapser {
+            position: absolute;
+            top: 3px;
+            right: 18px;
+            width: 26px;
+            height: 26px;
+            box-sizing: border-box;
+            padding: 10px;
+            cursor: pointer;
+            border-radius: 13px;
+            transition: background-color .12s ease;
+
+            &:hover {
+                background-color: var(--light-color);
+            }
+
+            >span {
+                width: 6px;
+                height: 6px;
+                position: absolute;
+                border-top: 1px solid var(--strong-color);
+                border-right: 1px solid var(--strong-color);
+                top: 8px;
+                transform: rotate(135deg);
+            }
+
+            &.collapsed>span {
+                top: 9px;
+                left: 8px;
+                transform: rotate(45deg);
+            }
+        }
+
         .roundbtn {
             float: right;
             margin: 4px 10px 10px;
 
-            > svg {
+            >svg {
                 width: 16px;
             }
         }
     }
 
+    &.collapsed {
+        .contact-bar {
+            border-bottom-color: transparent;
+
+            >.bar-icon,
+            >.bar-list {
+                display: none;
+            }
+
+            >.bar-info {
+                display: block;
+            }
+        }
+
+        .follower-bar {
+            display: none !important;
+        }
+    }
+
     .message-bar {
         flex: 0 0 auto;
         border-bottom: 1px solid var(--title-bg-color);
         display: flex;
         flex-direction: column;
 
-        > textarea {
+        >textarea {
             padding: 10px 10px 0;
             border: 1px solid var(--title-bg-color);
             border-radius: 5px;
@@ -208,17 +270,17 @@
             @include outline();
         }
 
-        > div {
+        >div {
             padding: 0 10px 10px;
 
-            > .customer-name {
+            >.customer-name {
                 float: left;
 
-                > span {
+                >span {
                     font-size: var(--font-smaller-size);
                 }
 
-                > .ui-input {
+                >.ui-input {
                     margin-left: 4px;
                     width: 150px;
                     border-top: none;
@@ -227,7 +289,7 @@
                 }
             }
 
-            > .prompt-count {
+            >.prompt-count {
                 display: inline-block;
                 color: var(--light-color);
                 font-size: var(--font-smaller-size);
@@ -263,7 +325,7 @@
                 font-size: var(--font-size);
                 align-self: flex-start;
 
-                .ui-tooltip-wrapper > .ui-tooltip-content {
+                .ui-tooltip-wrapper>.ui-tooltip-content {
                     font-weight: normal;
                 }
             }
@@ -277,7 +339,7 @@
                 max-width: 240px;
                 background-color: rgb(244, 244, 244);
 
-                a > svg {
+                a>svg {
                     width: 13px;
                     height: 13px;
                     fill: #2140fb;
@@ -287,7 +349,7 @@
                     }
                 }
 
-                > span::after {
+                >span::after {
                     content: '';
                     display: block;
                 }
@@ -339,7 +401,7 @@
             height: 100%;
             min-height: 120px;
 
-            > .ui-grid-body .ui-grid-body-content > .ui-grid-row > td {
+            >.ui-grid-body .ui-grid-body-content>.ui-grid-row>td {
                 vertical-align: top;
 
                 .col-icon {
@@ -349,11 +411,11 @@
                 .icon-contact-type {
                     cursor: unset;
 
-                    > svg {
+                    >svg {
                         fill: #333;
                     }
 
-                    &:hover > svg {
+                    &:hover>svg {
                         opacity: unset;
                     }
                 }
@@ -381,11 +443,11 @@
             flex-direction: column;
             width: 600px;
 
-            > .follower-search {
+            >.follower-search {
                 margin-bottom: 6px;
             }
 
-            > .follower-grid {
+            >.follower-grid {
                 height: 380px;
             }
         }
@@ -395,7 +457,7 @@
             flex-direction: column;
             width: 780px;
 
-            > .selcontact-grid {
+            >.selcontact-grid {
                 height: 200px;
             }
         }
@@ -409,4 +471,4 @@
         --strong-color: #ccc;
         --light-color: #333;
     }
-}*/
+}*/
\ No newline at end of file
diff --git a/lib/ui/tooltip.js b/lib/ui/tooltip.js
index 80b3c7e..f1bf656 100644
--- a/lib/ui/tooltip.js
+++ b/lib/ui/tooltip.js
@@ -72,10 +72,10 @@ function setTooltip(container, content, flag = false, parent = null) {
                     top -= p.scrollTop;
                     p = p.parentElement;
                 }
-                left += (c.offsetWidth - wrapper.offsetWidth) / 2;
-                wrapper.style.left = `${left}px`;
                 // check overflow
                 let t = c.offsetTop;
+                let l = c.offsetLeft;
+                let lastWidth = c.offsetWidth;
                 p = c.offsetParent;
                 while (p != null) {
                     const overflow = window.getComputedStyle(p).overflow;
@@ -83,16 +83,26 @@ function setTooltip(container, content, flag = false, parent = null) {
                         break;
                     }
                     t += p.offsetTop;
+                    l += p.offsetLeft;
+                    lastWidth = p.offsetWidth;
                     p = p.offsetParent;
                 }
                 const offsetHeight = wrapper.offsetHeight + 14;
                 if (t + top - offsetHeight < 0) {
-                    top += c.parentElement.offsetHeight + 14;
+                    top += c.parentElement.offsetHeight + 10;
                     wrapper.classList.add('ui-tooltip-down');
                 } else {
                     top -= offsetHeight;
                     wrapper.classList.remove('ui-tooltip-down');
                 }
+                const offsetWidth = wrapper.offsetWidth;
+                left += (c.offsetWidth - offsetWidth) / 2;
+                if (left < -l) {
+                    left = 2;
+                } else if (left + offsetWidth + 2 > lastWidth) {
+                    left = lastWidth - offsetWidth - 2;
+                }
+                wrapper.style.left = `${left}px`;
                 wrapper.style.top = `${top}px`;
                 wrapper.style.visibility = 'visible';
                 wrapper.style.opacity = 1;